[Felgo User]

Hi,

 

CameraVPlay does not work  (it only zooms , but does not drag ) , when a child item has a MouseArea defined, but when I remove the MouseArea from the child item it drags and zooms properly.

 

In the next example the last red rectangle ( at the center ), it does not drag the view , but if you remove the MouseArea it allows it.

Is this an intended feature?

 

 

import Felgo 3.0
 import QtQuick 2.0

 GameWindow {

   activeScene: gameScene

   EntityManager {
     id: entityManager

     entityContainer: gameScene.container
   }

   Scene {
     id: gameScene

     // set scene alignment
     sceneAlignmentX: "left"
     sceneAlignmentY: "top"

     CameraVPlay {
       id: camera

       // set the gameWindowSize and entityContainer required for the camera
       gameWindowSize: Qt.point(gameScene.gameWindowAnchorItem.width, gameScene.gameWindowAnchorItem.height)
       entityContainer: container

       // if you don't set the focusedObject property, or set it to null, the camera is freely movable
       focusedObject: null

       // set the camera's limits
       limitLeft: 0
       limitRight: 600
       limitTop: 0
       limitBottom: 400
     }

     Item {
       id: container

       // 5 green rectangles to make the player's movement visible
       Rectangle {
         x: 0; y: 0
         width: 32; height: 32
         color: "green"

       }
       Rectangle {
         x: 568; y: 368
         width: 32; height: 32
         color: "green"
       }
       Rectangle {
         x: 568; y: 0
         width: 32; height: 32
         color: "green"
       }
       Rectangle {
         x: 0; y: 368
         width: 32; height: 32
         color: "green"
       }
       Rectangle {
         x: 284; y: 184
         width: 32; height: 32

         color: "red"
         MouseArea{
             anchors.fill: parent
         }
       }
     }
   }
 }

 

[GüntherFelgo Team]

Hi Tahar!

The CameraVPlay internally also uses a MouseArea to handle touch input. If you also add a MouseArea to the Rectangle, this MouseArea consumes the mouse-events before the camera (only one MouseArea can consume the event).

If you want to be able to e.g. click the item but still move the camera if you start a drag, you would need to add that logic manually. The following code snippet implements a threshold for the Rectangle’s MouseArea to decide whether to recognize a click or a drag:

Rectangle {
        x: 284; y: 184
        width: 32; height: 32

        color: "red"
        MouseArea{
          anchors.fill: parent

          // required properties to add dragging feature to mouse-area
          property point prevPos
          property real threshold: 500
          property bool drag: false

          onPressed: prevPos = Qt.point(mouse.x, mouse.y) // memorize mouse position
          // when the position changes, and we moved more than the defined threshold we move the camera
          onPositionChanged: {
            var diff = Qt.point(prevPos.x - mouse.x, prevPos.y - mouse.y) 
            if(drag || diff.x * diff.x + diff.y * diff.y > threshold) {
              drag = true
              camera.moveFreeCamera(diff.x, diff.y)
            }
          }
          // on release, we either end a camera-drag or handle the click
          onReleased: {
            if(drag) {
              drag = false
              camera.applyVelocity() // enables flicking on release
            }
            else {
              console.log("CLICK")
            }
          }
        }
      }

 

Hope this helps!

Best,
Günther

 

[Felgo User]

Hi, thanks Günther , it works fine now, I really appreciate it.