Unsolved One finger page navigation (Flickable,StackView,MouseArea)
-
Hi
I'm struggling with one finger page navigation. Example below shows settings MouseArea inside Flickable.
It almost works. However when app is loaded, Flickable element does not work, as if MouseArea was consuming all events. After first "click" on Flickable it begins to work and I have events from MouseArea, tested on Linux and Android Qt 5.9.1I have seen this post Yashpal SwipeView page change without animation, I have tried to put MouseArea as a child or sibling of StackView - it doesn't work - either MouseArea or StackView get mouse events depending on "z" value. So if anyone have working example, please share.
I have put a MouseArea inside Flickable element, it almost works, as I mentioned first click is always "discarded" by Flickable. Maybe I need to set something? or simulate "flick" in Flickable Component.onCompleted ?
import QtQuick 2.9 Rectangle { id: testPage Flickable { id: flickable anchors.fill: parent flickableDirection: Flickable.VerticalFlick contentHeight: testPage.height contentWidth: testPage.width clip: true focus: true Rectangle { id: rectangle anchors.fill:parent anchors.margins: 40 color: "black" } MouseArea { id: mouse anchors.fill: parent propagateComposedEvents: true property real velocity: 0.0 property int xStart: 0 property int xPrev: 0 property int yPrev: 0 property bool tracing: false property bool swiping: false signal swipeLeft() signal swipeRight() onPressed: { xStart = mouse.x xPrev = mouse.x velocity = 0 tracing = true swiping = false console.log("main mouse pressed"); } onPositionChanged: { if ( !tracing ) return var currVel = (mouse.x-xPrev) velocity = (velocity + currVel)/2.0 xPrev = mouse.x console.log("main vel:"+velocity) if ( velocity < -5 ) { tracing = false swiping=true console.log("main left swipe"); swipeLeft() } if ( velocity > 5 ) { tracing = false swiping=true swipeRight() console.log("main right swipe") } } onReleased: { tracing = false } } } }
Best Regards
Marek