Problems with Open-Source Downloads read https://www.qt.io/blog/problem-with-open-source-downloads and https://forum.qt.io/post/638946

Handle touch event and flicks simultaneously in Qml



  • I'm trying to write UI on Qml with two capabilities:

    1. handle touch event (to choose some object)

    2. handle flick events (to view some large object)

    It's my code:

    @Rectangle {
    width: 500; height: 500
    Flickable {
    anchors.fill: parent

        onContentXChanged: {
        console.log("x changed")
        //redraw large object
    
    MouseArea {
        anchors.fill: parent
        preventStealing: true
    
        onClicked: {
        console.log("clicked")
        //choose some object
        }
    }
    

    }@

    I have two problems:

    1. On Android clicked events don't appear (even with preventStealing property)

    2. How can I differ short touch (clicked) event from pressing+dragging+releasing? As I understand, MouseArea must send clicked event in both cases.


  • Moderators

    You have missed setting contentHeight and contentWidth in your Flickable. That is probably why the MouseArea does not respond: it's size might be 0x0.



  • With setting content width and height now I get mouse events but miss flicks :) Is there a way of combining MouseArea and Flickable?


  • Moderators

    Yes, make your MouseArea smaller ;) After all, your selectable items will not occupy the whole content area?

    Also, you might consider using this to pass the even to the Flickable:
    @
    MouseArea {
    anchors.fill: parent
    preventStealing: true

        onClicked: {
          console.log("clicked")
          mouse.accepted = false
          // or: event.accepted = false
        }
    }
    

    @



  • I also noticed Qt have problems with detecting touch events from multiple sources


Log in to reply