blob: 7af64c5f39549e678724a6153ec569cd8a74488f (
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
|
/******************************************************************************
Copyright (C) 2013-2016 Wang Bin <wbsecg1@gmail.com>
This library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.
This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
Lesser General Public License for more details.
You should have received a copy of the GNU Lesser General Public
License along with this library; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
******************************************************************************/
import QtQuick 2.0
Rectangle {
id: root
property string text
property url icon
property alias iconChecked: iconChecked.source
property bool checkable: false
property bool checked: false
property color bgColor: "#555555"
property color bgColorSelected: "#ee6666dd"
property color textColor: "white"
property bool hovered: false //mouseArea.containsMouse
readonly property alias pressed: mouseArea.pressed
signal clicked()
signal pressAndHold()
opacity: 0.7
color: checked ? bgColorSelected : mouseArea.pressed ? Qt.darker(bgColor) : bgColor
border.color: Qt.lighter(color)
Text {
id: text
anchors.fill: parent
text: root.text
font.pixelSize: 0.5 * parent.height
color: textColor
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
Image {
source: icon
anchors.fill: parent
visible: !checked
}
Image {
id: iconChecked
anchors.fill: parent
visible: checked
}
MouseArea {
id: mouseArea
anchors.fill: parent
hoverEnabled: true
onClicked: {
if (root.checkable)
root.checked = !root.checked
root.clicked()
}
onHoveredChanged: {
if (mouseX > 65535) //qt5.6 touch screen release finger becomes very large e.g. 0x7fffffff
return
hovered = mouseArea.containsMouse
}
onPressAndHold: root.pressAndHold()
}
states: [
State {
name: "brighter"
when: hovered // only the first true State is applied, so put scale and opacity together
PropertyChanges { target: root; opacity: 1.0; scale: mouseArea.pressed ? 1.06 : 1.0 }
}
]
transitions: [
Transition {
from: "*"; to: "*"
PropertyAnimation {
properties: "opacity,scale"
easing.type: Easing.OutQuart
duration: 300
}
}
]
}
|