Sorry for replying to a topic so old, however, I needed to implement this behavior and made some modifications to the code in this forum. To help someone avoid loosing time, I'll post my modifications.
Summary of modifications:
Created separate QML item to implement swipe gesture (only enabled on iOS)
Played with the "mouse.accepted" assignments to get same behavior without drastically affecting full-page Flickable-based items
Instead of filling the whole stack view, we create the object after the rest of the UI items, and anchor it to the left part of the screen.
We set a relatively small width to avoid issues with Flickables, ListViews, GridViews, etc.
First, I created a new QML file named BackGestureDetector.qml, with the following code:
import QtQuick 2.12
MouseArea {
width: 32
hoverEnabled: true
scrollGestureEnabled: false
propagateComposedEvents: true
enabled: Qt.platform.os === "ios"
signal backGestureDetected()
property int xPrev: 0
property int xStart: 0
property real velocity: 0.0
property bool tracing: false
property bool allowedToWork: false
onPressed: {
if (allowedToWork) {
xStart = mouse.x
xPrev = mouse.x
velocity = 0
tracing = true
mouse.accepted = true
}
else
mouse.accepted = false
}
onPositionChanged: {
if (!tracing) {
mouse.accepted = false
return
}
var currVel = (mouse.x - xPrev)
velocity = (velocity + currVel)/2.0
xPrev = mouse.x
mouse.accepted = false
}
onReleased: {
if (!tracing) {
mouse.accepted = false
return
}
tracing = false
if (velocity > 15 && mouse.x > parent.width * 0.2)
backGestureDetected()
mouse.accepted = false
}
}
Finally, I integrate it to the UI as follows:
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
ApplicationWindow {
id: app
//
// Set window geometry
//
width: 800
height: 600
visible: true
title: qsTr("Swipe gestures example")
//
// Page display
//
StackView {
id: stackView
focus: true
initialItem: page1
anchors.fill: parent
Page {
id: page1
visible: false
width: parent.width
height: parent.height
Button {
text: qsTr("Go to page 2")
anchors.centerIn: parent
onClicked: stackView.push(page2)
}
}
Page {
id: page2
visible: false
width: parent.width
height: parent.height
Label {
text: qsTr("Page 2")
anchors.centerIn: parent
}
}
}
//
// Swipe back to navigate
//
BackGestureDetector {
allowedToWork: stackView.depth > 1
onBackGestureDetected: stackView.pop()
anchors {
top: parent.top
left: parent.left
bottom: parent.bottom
}
}
}
Any comments are welcome, hope everyone is safe regarding the pandemic.
