qiurui
/
qtdeclarative
mirror of https://github.com/qt/qtdeclarative.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Example: Update the shared UI controls to use input handlers 

Change-Id: I077754d9d9d713d01c7711175eb1b5da5e1f6869
Reviewed-by: Liang Qi <liang.qi@qt.io>
Reviewed-by: Shawn Rutledge <shawn.rutledge@qt.io>
This commit is contained in:
Venugopal Shivashankar 2018-10-03 11:19:27 +02:00 committed by Shawn Rutledge
parent 818d7340e7
commit f6bb3c220b
6 changed files with 58 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
examples/quick/shared/Button.qml
View File

@ -48,7 +48,7 @@
**
****************************************************************************/
import QtQuick 2.1
import QtQuick 2.12
import QtQuick.Window 2.1
Item {
@ -57,8 +57,8 @@ Item {
property alias text: buttonLabel.text
property alias label: buttonLabel
signal clicked
property alias containsMouse: mouseArea.containsMouse
property alias pressed: mouseArea.pressed
property alias containsMouse: hoverHandler.hovered
property alias pressed: tapHandler.pressed
implicitHeight: Math.max(Screen.pixelDensity * 7, buttonLabel.implicitHeight * 1.2)
implicitWidth: Math.max(Screen.pixelDensity * 11, buttonLabel.implicitWidth * 1.3)
height: implicitHeight
@ -71,7 +71,7 @@ Item {
anchors.fill: parent
color: palette.button
gradient: Gradient {
GradientStop { position: 0.0; color: mouseArea.pressed ? Qt.darker(palette.button, 1.3) : palette.button }
GradientStop { position: 0.0; color: tapHandler.pressed ? Qt.darker(palette.button, 1.3) : palette.button }
GradientStop { position: 1.0; color: Qt.darker(palette.button, 1.3) }
}
antialiasing: true
@ -80,11 +80,12 @@ Item {
border.width: 1
}
MouseArea {
id: mouseArea
anchors.fill: parent
onClicked: container.clicked()
hoverEnabled: true
TapHandler {
id: tapHandler
onTapped: container.clicked();
}
HoverHandler {
id: hoverHandler
}
Text {

13
examples/quick/shared/CheckBox.qml
View File

@ -48,7 +48,7 @@
**
****************************************************************************/
import QtQuick 2.0
import QtQuick 2.12
Item {
id: root
@ -58,7 +58,7 @@ Item {
height: implicitHeight
property alias text: label.text
property bool checked
property alias pressed: mouseArea.pressed
property alias pressed: tapHandler.pressed
property alias row: row
signal clicked
@ -71,7 +71,7 @@ Item {
Rectangle {
id: frame
gradient: Gradient {
GradientStop { position: 0.0; color: mouseArea.pressed ? Qt.darker(palette.button, 1.3) : palette.button }
GradientStop { position: 0.0; color: tapHandler.pressed ? Qt.darker(palette.button, 1.3) : palette.button }
GradientStop { position: 1.0; color: Qt.darker(palette.button, 1.3) }
}
height: label.implicitHeight * 1.5
@ -96,10 +96,9 @@ Item {
anchors.verticalCenter: frame.verticalCenter
}
}
MouseArea {
id: mouseArea
anchors.fill: parent
onClicked: {
TapHandler {
id: tapHandler
onTapped: {
parent.checked = !parent.checked
parent.clicked()
}

41
examples/quick/shared/LauncherList.qml
View File

@ -48,7 +48,7 @@
** $QT_END_LICENSE$
**
****************************************************************************/
import QtQuick 2.0
import QtQuick 2.12
Rectangle {
property int activePageCount: 0
@ -96,9 +96,8 @@ Rectangle {
width: parent.width
height: parent.height - bar.height
color: "white"
MouseArea{
TapHandler {
//Eats mouse events
anchors.fill: parent
}
Loader{
focus: true
@ -221,29 +220,27 @@ Rectangle {
anchors.left: parent.left
anchors.leftMargin: 16
MouseArea {
id: mouse
hoverEnabled: true
anchors.centerIn: parent
TapHandler {
id: tapHandler
enabled: activePageCount > 0
onTapped: {
pageContainer.children[pageContainer.children.length - 1].exit()
}
}
Rectangle {
anchors.centerIn: back
width: 38
height: 31
anchors.verticalCenterOffset: -1
enabled: activePageCount > 0
onClicked: {
pageContainer.children[pageContainer.children.length - 1].exit()
}
Rectangle {
anchors.fill: parent
opacity: mouse.pressed ? 1 : 0
Behavior on opacity { NumberAnimation{ duration: 100 }}
gradient: Gradient {
GradientStop { position: 0 ; color: "#22000000" }
GradientStop { position: 0.2 ; color: "#11000000" }
}
border.color: "darkgray"
antialiasing: true
radius: 4
opacity: tapHandler.pressed ? 1 : 0
Behavior on opacity { NumberAnimation{ duration: 100 }}
gradient: Gradient {
GradientStop { position: 0 ; color: "#22000000" }
GradientStop { position: 0.2 ; color: "#11000000" }
}
border.color: "darkgray"
antialiasing: true
radius: 4
}
}
}

14
examples/quick/shared/SimpleLauncherDelegate.qml
View File

@ -47,7 +47,7 @@
** $QT_END_LICENSE$
**
****************************************************************************/
import QtQuick 2.0
import QtQuick 2.12
Rectangle {
id: container
@ -89,12 +89,14 @@ Rectangle {
implicitHeight: col.height
height: implicitHeight
width: buttonLabel.width + 20
property alias containsMouse: hoverHandler.hovered
MouseArea {
id: mouseArea
anchors.fill: parent
onClicked: container.clicked()
hoverEnabled: true
TapHandler {
id: tapHandler
onTapped: container.clicked()
}
HoverHandler {
id: hoverHandler
}
Column {

26
examples/quick/shared/Slider.qml
View File

@ -48,7 +48,7 @@
**
****************************************************************************/
import QtQuick 2.0
import QtQuick 2.12
Item {
id: slider
@ -57,18 +57,26 @@ Item {
property real min: 0
property real max: 1
property real value: min + (max - min) * mousearea.value
property real value: min + (max - min) * dragHandler.value
property real init: min+(max-min)/2
property string name: "Slider"
property color color: "#0066cc"
property real minLabelWidth: 44
DragHandler {
id: dragHandler
target: handle
xAxis.minimum: Math.round(-handle.width / 2 + 3)
xAxis.maximum: Math.round(foo.width - handle.width/2 - 3)
property real value: (handle.x - xAxis.minimum) / (xAxis.maximum - xAxis.minimum)
}
Component.onCompleted: setValue(init)
function setValue(v) {
if (min < max)
handle.x = Math.round( v / (max - min) *
(mousearea.drag.maximumX - mousearea.drag.minimumX)
+ mousearea.drag.minimumX);
(dragHandler.xAxis.maximum - dragHandler.xAxis.minimum)
+ dragHandler.xAxis.minimum);
}
Rectangle {
id:sliderName
@ -112,16 +120,6 @@ Item {
id: handle
source: "images/slider_handle.png"
anchors.verticalCenter: parent.verticalCenter
MouseArea {
id: mousearea
anchors.fill: parent
anchors.margins: -4
drag.target: parent
drag.axis: Drag.XAxis
drag.minimumX: Math.round(-handle.width / 2 + 3)
drag.maximumX: Math.round(foo.width - handle.width/2 - 3)
property real value: (handle.x - drag.minimumX) / (drag.maximumX - drag.minimumX)
}
}
}
}

7
examples/quick/shared/TabSet.qml
View File

@ -48,7 +48,7 @@
**
****************************************************************************/
import QtQuick 2.0
import QtQuick 2.12
import QtQuick.Window 2.1
Item {
@ -100,9 +100,8 @@ Item {
elide: Text.ElideRight
font.bold: tabWidget.current == index
}
MouseArea {
anchors.fill: parent
onClicked: tabWidget.current = index
TapHandler {
onTapped: tabWidget.current = index
}
}
}