Forums

OverviewV-Play 2 Support (Qt 5)JoystickControllerHUD issue › Reply To: JoystickControllerHUD issue

OverviewV-Play 2 Support (Qt 5)JoystickControllerHUD issue › Reply To: JoystickControllerHUD issue
#12129

Günther
V-Play Team

Hi Prashant!

The main problem is, that the MouseArea steals the mouse events from the joystick. But even if you solved that, theres yet another problem: The joystick only reacts to mouse events that are started by a press within the joystick area. So what you essentially need is to have the additional MouseArea handle all the events (event the ones that the joystick itself wouldn’t listen to).

I created a code sample that does exactly that. It uses a normally hidden internal function that allows to manually set the joystick position:

Scene {
    id: mainScreen

    // mouse area handles all mouse events
    MouseArea {
      anchors.fill: parent

      // on press -> set initial position and show joystick
      onPressed: {
        updateJoystickPosition()
        joystickleft.opacity = 1
      }

      // on mouse position change -> update joystick position
      onPositionChanged: updateJoystickPosition()

      // hide joystick again on release
      onReleased: joystickleft.opacity = 0

      // helper function - sets joystick position based on current mouse position
      function updateJoystickPosition() {
        // convert mouse area coordinates to joystick coordinates
        var joystickX = mouseX - joystickleft.x
        var joystickY = mouseY - joystickleft.y

        // manually set joystick position
        joystickleft.setJoystickPosition(joystickX, joystickY)
      }

      // joystick controller hud, only used for visuals (events are handled by parent mouse area)
      JoystickControllerHUD {
        id: joystickleft
        anchors.centerIn: parent
        joystickRadius: parent.width/4
        thumbRadius : joystickRadius/3

        opacity: 0 // initially hidden
        enabled: false // always use parent mouse area to handle events

        // fade in/out animation when opacity changes
        Behavior on opacity {
          PropertyAnimation { duration: 150 }
        }

        onControllerXPositionChanged: console.debug("xPos: "+controllerXPosition)
        onControllerYPositionChanged:  console.debug("yPos: "+controllerYPosition)
      }
    }
  }

Best, Günther

 

 

  • This reply was modified 2 years, 7 months ago by  GT.
  • This reply was modified 2 years, 7 months ago by  GT.

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support