Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Simultaneous mousearea drag event
Forum Updated to NodeBB v4.3 + New Features

Simultaneous mousearea drag event

Scheduled Pinned Locked Moved Solved QML and Qt Quick
dragmouseareaqmlmultipointtouchqtquick
2 Posts 1 Posters 572 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • D Offline
    D Offline
    DeltaSim
    wrote on 2 Oct 2019, 07:09 last edited by DeltaSim 10 Feb 2019, 08:46
    #1

    Hi,

    My problem is: how can I manage two simultaneaous mousearea drag events in QtQuick QML?

    I would like to drag two images in the same time (like 2 joysticks).
    I did the following with images in mouseareas :
    alt text

    But it works only for one mousearea at a time.

    I had a look at multipletoucharea but I didn't manage to bind it to MouseArea to keep drag events.

    Thanks ,

    1 Reply Last reply
    0
    • D Offline
      D Offline
      DeltaSim
      wrote on 2 Oct 2019, 15:55 last edited by
      #2

      I finally succeed to create this using 2 MultiPointTouchArea but I had to write drag function on touchUpdated event.

      Here is my code for one drag area:

      import QtQuick 2.0
      
      Item{
         id: joystick
         width: 100
         height: 500
      
         Rectangle{
            id: joystickPad
            height: 50
            width: 100
      
            MultiPointTouchArea{
               property var offset: null
      
               anchors.fill:parent
      
               minimumTouchPoints: 1
               maximumTouchPoints: 1
      
               function dragMove(point) {
                  if (point) {
                     var position = joystick.mapFromItem(joystickPad, point.x, point.y);
                        /* Change y axis */
                        if((position.y - offset.y) < 0)
                        {
                           /* Do not go on top of drag area */
                           joystickPad.y = 0;
                        }
                        else
                        {
                           if((position.y - offset.y) > (joystick.height-joystickPad.height))
                           {
                              /* Do not go below of drag area */
                              joystickPad.y = (joystick.height-joystickPad.height);
                           }
                           else
                           {
                              joystickPad.y = position.y - offset.y;
                           }
                        }
                  }
               }
      
               onPressed: {
                  var point = touchPoints[0];
                  offset = Qt.point(point.x, point.y);
               }
      
               onTouchUpdated: {
                  var point = touchPoints[0];
                  dragMove(point);
               }
      
               onReleased: {
                  //Reset position
                  joystickPad.x = (joystick.width/2 - joystickPad.width/2)
                  joystickPad.y = (joystick.height/2 - joystickPad.height/2)
               }
            }
         }
      }
      
      1 Reply Last reply
      1

      1/2

      2 Oct 2019, 07:09

      • Login

      • Login or register to search.
      1 out of 2
      • First post
        1/2
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved