Hey,
The main window of my app has tiled elements taking up the whole screen.
Each tile element has a MultiPointTouchArea that looks like this.
View.qml:
MultiPointTouchArea {
enabled: parent.interactive
anchors.fill: parent
minimumTouchPoints: 2
maximumTouchPoints: 2
touchPoints: [
TouchPoint { id: p1 },
TouchPoint { id: p2 }
]
onTouchUpdated: {
//Pinch to zoom.
}
MouseArea {
anchors.fill: parent
enabled: parent.enabled
onDoubleClicked: {
//Double click to zoom.
}
onPressed: {
//Do something.
}
onReleased: {
//Do something.
}
onPositionChanged: {
//Drag object around view on position changed.
}
}
}
Now, on the MainWindow where these tiles are created, there is another MultiPointTouchArea.
MainWindow.qml:
Item {
id: theMainWindow
property bool interactive
MultiPointTouchArea {
id: theViewsTouchArea
anchors.fill: parent
minimumTouchPoints: 3
maximumTouchPoints: 3
touchPoints: [
TouchPoint { id: p1 },
TouchPoint { id: p2 },
TouchPoint { id: p3 }
]
onPressed: {
parent.interactive = false
theView.focus = false
theViewsTouchArea.focus = true
}
onTouchUpdated: {
//Move all the views left and right.
}
onCanceled: {
theMainWindow.interactive = true
}
onReleased: {
theMainWindow.interactive = true
}
Item {
id: theViews
Repeater {
id: viewList
model: viewManagementModel
delegate:
View {
id: theView
interactive: theMainWindow.interactive
}
}
}
So I need these views to still have control over 1 finger and 2 finger motions and be interactive when I’m using 1 or 2 fingers. The problem is I need to use three finger swipe to move through these views (the contentWidth of the views is much larger than the screen width). When I put three fingers on the main window, it disables View.qml’s multitoucharea correctly; but there is a slight delay before this happens. This results in a onTouchUpdated zoom event from the MultiPointTouchArea or a onPositionChanged drag event from the MouseArea.
Is there a better way to do this? Would re-implementing a MouseEvent class myself give me what I want?
↧