Some changes for better touch support and scripts
[opentodolist:opentodolist.git] / OpenTodoList / qml / OpenTodoList / ProgressIndicator.qml
1 /*
2  *  OpenTodoListDesktopQml - Desktop QML frontend for OpenTodoList
3  *  Copyright (C) 2013  Martin Höher <martin@rpdev.net>
4  *
5  *  This program is free software: you can redistribute it and/or modify
6  *  it under the terms of the GNU General Public License as published by
7  *  the Free Software Foundation, either version 3 of the License, or
8  *  (at your option) any later version.
9  *
10  *  This program is distributed in the hope that it will be useful,
11  *  but WITHOUT ANY WARRANTY; without even the implied warranty of
12  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
13  *  GNU General Public License for more details.
14  *
15  *  You should have received a copy of the GNU General Public License
16  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
17  */
18
19 import QtQuick 2.0
20
21 Item {
22     id: indicator
23
24     property int percentage: 25
25     property int indicatorBorder: 10
26     property bool readOnly: false
27     property color innerColor: colors.button
28     property color outerColor: colors.complementaryColorDarker2
29
30     signal decreasePressed()
31     signal increasePressed()
32
33     function stepUp() {
34         return Math.max( 0, Math.min( 100, percentage + 10 ) );
35     }
36
37     function stepDown() {
38         return Math.max( 0, Math.min( 100, percentage - 10 ) );
39     }
40
41     Behavior on percentage { SmoothedAnimation { velocity: 120 } }
42     width: 150
43     height: 150
44
45     Image {
46         source: "image://primitives/pie/fill=" +
47                 indicator.outerColor +
48                 ",percentage=" + indicator.percentage
49         width: indicator.width
50         height: indicator.height
51     }
52
53     Image {
54         source: "image://primitives/pie/fill=" +
55                 indicator.innerColor + ",percentage=100"
56         width: indicator.width - indicator.indicatorBorder * 2
57         height: indicator.height - indicator.indicatorBorder * 2
58         x: indicator.indicatorBorder
59         y: indicator.indicatorBorder
60     }
61
62     SymbolButton {
63         id: decreaseButton
64         text: "\uf068"
65         font.pointSize: fonts.p
66         anchors.verticalCenter: parent.verticalCenter
67         anchors.left: parent.left
68         anchors.leftMargin: indicator.indicatorBorder * 2
69         color: colors.fontColorFor( indicator.innerColor )
70
71         onClicked: indicator.decreasePressed()
72     }
73
74     Text {
75         anchors.centerIn: parent
76         text: indicator.percentage + "%"
77         font.pointSize: fonts.p
78         color: colors.fontColorFor( indicator.innerColor )
79     }
80
81     SymbolButton {
82         id: increaseButton
83         text: "\uf067"
84         font.pointSize: fonts.p
85         color: colors.fontColorFor( indicator.innerColor )
86         anchors {
87             verticalCenter: parent.verticalCenter
88             right: parent.right
89             rightMargin: indicator.indicatorBorder * 2
90         }
91
92         onClicked: indicator.increasePressed()
93     }
94 }