summaryrefslogtreecommitdiff
path: root/src/mobile/qml/GridChooser.qml
blob: b4d1612e11d4f914754be0f5eb84eb78c3e041c9 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
import QtQuick 2.1
import BibleTime 1.0

Rectangle {
    id: gridChooser

    property int columns: 5
    property int rows: 5
    property int buttonWidth: 100
    property int buttonHeight: 30
    property int topMargin: 10
    property int leftMargin: 10
    property int titleHeight: 20
    property int space:5
    property string selected: ""
    property string titleText: ""
    property int maxLength: 0

    signal accepted(string choosenText);
    signal canceled();

    onVisibleChanged: {

        var count = gridChooserModel.length
        if (count < 36)
            count = 36;

        calculateColumns(count);

        buttonWidth = (width-50)/columns;
        buttonHeight = Math.floor((height-(rows*5))/rows);

        topMargin = (height - rows*(buttonHeight+space) + space)/2 +titleHeight;
        leftMargin = (width - columns*(buttonWidth+space) + space)/2;
    }

    function calculateColumns(count) {
        var aspectRatio = 0.175;
        var columnsF = Math.sqrt(count * width * aspectRatio / height);
        columns = Math.ceil(columnsF);
        rows = Math.ceil((count-0.01)/columns);
    }

    function accept(value) {
        visible = false;
        gridChooser.accepted(value);
    }

    Text {
        id: title

        text: titleText
        font.pointSize: btStyle.uiFontPointSize
        height: titleHeight
        anchors.top: parent.top
        anchors.horizontalCenter: parent.horizontalCenter
    }

    BtStyle {
        id: btStyle
    }

    MouseArea {
        id: mouseArea

        anchors.fill: parent
        enabled: gridChooser.opacity
    }

    Rectangle {
        anchors.fill: parent
        color: btStyle.buttonBackground
    }

    Rectangle {
        id: topSpace

        width: leftMargin
        height: topMargin
        color: btStyle.buttonBackground
    }

    Grid {
        id: grid

        anchors.top: topSpace.bottom
        anchors.bottom: bottom.top
        anchors.left: topSpace.right
        anchors.right: parent.right
        columns: gridChooser.columns
        spacing: gridChooser.space

        Repeater {
            id: repeater

            model: gridChooserModel

            GridChooserButton {
                id: buttonX

                text: modelData
                textHeight: btStyle.uiFontPointSize
                buttonWidth: gridChooser.buttonWidth
                buttonHeight: gridChooser.buttonHeight
                textColor: {
                    if (text == gridChooser.selected)
                        return btStyle.buttonHighlightedText
                    else
                        return btStyle.buttonTextColor
                }
                buttonColor: btStyle.buttonColor
                activeButtonColor: btStyle.buttonTextColor
                onClicked: gridChooser.accept(text)
            }
        }
    }
}