blob: bafe78322227e48ec54dff99391eaedd10951e6a (
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Controls
import Qt.labs.UmlQuick.Generators
Rectangle {
id: root
objectName: "busybox"
height: 256
width: 256
color: "#444"
border.color: "cyan"
border.width: 2
antialiasing: true
component HoverTapButton: Rectangle {
id: htbutton
property string name: ""
objectName: name + " handlers button"
property alias pressed: utap.pressed
property point lastPressPos: Qt.point(-1, -1)
property point lastReleasePos: Qt.point(-1, -1)
property int clickedCount: 0
onPressedChanged: {
if (pressed)
lastPressPos = utap.point.position;
else
lastReleasePos = utap.point.position;
}
width: 100; height: 40
color: utap.pressed ? "tomato" : "beige"
radius: 5
border.width: 3
border.color: uhover.hovered ? "orange" : "black"
antialiasing: true
HoverHandler {
id: uhover
objectName: htbutton.name + " HoverHandler"
cursorShape: Qt.OpenHandCursor
}
TapHandler {
id: utap
objectName: htbutton.name + " TapHandler"
onTapped: ++clickedCount
}
Text {
anchors.centerIn: parent
text: "hover & tap"
}
}
HoverHandler {
id: feedback
objectName: "hover position feedback"
target: Rectangle {
color: "orange"
x: feedback.point.position.x - width / 2
y: feedback.point.position.y - height / 2
width: 10; height: width; radius: width
}
}
Text {
color: "orange"
text: "hover " + feedback.point.position.x.toFixed(1) + ", " + feedback.point.position.y.toFixed(1)
anchors.bottom: parent.bottom
anchors.margins: 3
x: 3
}
Row {
x: 10; y: 10; z: 1
spacing: 10
Column {
spacing: 10
HoverTapButton {
name: "upper"
}
HoverTapButton {
name: "lower"
}
Rectangle {
objectName: "mousearea button"
width: 100; height: 40
color: ma.pressed ? "tomato" : "beige"
radius: 5
border.width: 3
border.color: ma.containsMouse ? "orange" : "black"
antialiasing: true
MouseArea {
id: ma
objectName: "button mousearea"
anchors.fill: parent
hoverEnabled: true
property point lastPressPos: Qt.point(-1, -1)
property point lastReleasePos: Qt.point(-1, -1)
property int clickedCount: 0
onPressed: (mouse) => { lastPressPos = Qt.point(mouse.x, mouse.y) }
onReleased: (mouse) => { lastReleasePos = Qt.point(mouse.x, mouse.y) }
onClicked: ++clickedCount
}
Text {
anchors.centerIn: parent
text: "hover & click"
}
}
TextInput {
text: "Editable Text"
color: "cyan"
focus: true
}
}
Slider {
objectName: "toy slider"
orientation: Qt.Vertical
}
Rectangle {
width: 100; height: 200
color: "#333"
ListView {
model: ListModel {
ListElement {
name: "Apple"
}
ListElement {
name: "Orange"
}
ListElement {
name: "Banana"
}
}
delegate: Text {
required property string name
color: "#ddd"
text: name
}
anchors.fill: parent
}
}
}
}
|
