JoystickThumbPad.qml 4.28 KB
Newer Older
Don Gagne's avatar
Don Gagne committed
1 2 3 4 5 6
import QtQuick                  2.5
import QtQuick.Controls         1.2

import QGroundControl.Palette       1.0
import QGroundControl.ScreenTools   1.0

dogmaphobic's avatar
dogmaphobic committed
7
Item {
8
    id:             _joyRoot
Don Gagne's avatar
Don Gagne committed
9

Don Gagne's avatar
Don Gagne committed
10 11 12 13 14
    property alias  lightColors:    mapPal.lightColors  ///< true: use light colors from QGCMapPalette for drawing
    property real   xAxis:          0                   ///< Value range [-1,1], negative values left stick, positive values right stick
    property real   yAxis:          0                   ///< Value range [-1,1], negative values up stick, positive values down stick
    property bool   yAxisThrottle:  false               ///< true: yAxis used for throttle, range [1,0], positive value are stick up
    property real   xPositionDelta: 0                   ///< Amount to move the control on x axis
15
    property real   yPositionDelta: 0                   ///< Amount to move the control on y axis
Don Gagne's avatar
Don Gagne committed
16

Don Gagne's avatar
Don Gagne committed
17 18 19 20
    property real   _centerXY:              width / 2
    property bool   _processTouchPoints:    false
    property bool   _stickCenteredOnce:     false
    property real   stickPositionX:         _centerXY
21
    property real   stickPositionY:         yAxisThrottle ? height : _centerXY
Don Gagne's avatar
Don Gagne committed
22 23 24

    QGCMapPalette { id: mapPal }

Don Gagne's avatar
Don Gagne committed
25 26
    onStickPositionXChanged: {
        var xAxisTemp = stickPositionX / width
Don Gagne's avatar
Don Gagne committed
27 28 29
        xAxisTemp *= 2.0
        xAxisTemp -= 1.0
        xAxis = xAxisTemp
Don Gagne's avatar
Don Gagne committed
30
    }
Don Gagne's avatar
Don Gagne committed
31

Don Gagne's avatar
Don Gagne committed
32
    onStickPositionYChanged: {
33
        var yAxisTemp = stickPositionY / height
Don Gagne's avatar
Don Gagne committed
34 35 36 37 38 39 40 41 42 43
        yAxisTemp *= 2.0
        yAxisTemp -= 1.0
        if (yAxisThrottle) {
            yAxisTemp = ((yAxisTemp * -1.0) / 2.0) + 0.5
        }
        yAxis = yAxisTemp
    }

    function reCenter()
    {
Don Gagne's avatar
Don Gagne committed
44
        _processTouchPoints = false
45

Don Gagne's avatar
Don Gagne committed
46 47 48
        // Move control back to original position
        xPositionDelta = 0
        yPositionDelta = 0
49

Don Gagne's avatar
Don Gagne committed
50 51
        // Center sticks
        stickPositionX = _centerXY
52 53 54
        if (!yAxisThrottle) {
            stickPositionY = _centerXY
        }
Don Gagne's avatar
Don Gagne committed
55 56 57 58
    }

    function thumbDown(touchPoints)
    {
59
        // Position the control around the initial thumb position
Don Gagne's avatar
Don Gagne committed
60
        xPositionDelta = touchPoints[0].x - _centerXY
61 62 63 64 65 66
        if (yAxisThrottle) {
            yPositionDelta = touchPoints[0].y - stickPositionY
        } else {
            yPositionDelta = touchPoints[0].y - _centerXY
        }

Don Gagne's avatar
Don Gagne committed
67 68
        // We need to wait until we move the control to the right position before we process touch points
        _processTouchPoints = true
Don Gagne's avatar
Don Gagne committed
69 70
    }

Don Gagne's avatar
Don Gagne committed
71
    /*
Don Gagne's avatar
Don Gagne committed
72
    // Keep in for debugging
Don Gagne's avatar
Don Gagne committed
73 74 75 76
    Column {
        QGCLabel { text: xAxis }
        QGCLabel { text: yAxis }
    }
Don Gagne's avatar
Don Gagne committed
77
    */
Don Gagne's avatar
Don Gagne committed
78

dogmaphobic's avatar
dogmaphobic committed
79 80 81 82 83
    Image {
        anchors.fill:       parent
        source:             lightColors ? "/res/JoystickBezel.png" : "/res/JoystickBezelLight.png"
        mipmap:             true
        smooth:             true
Don Gagne's avatar
Don Gagne committed
84 85 86 87 88 89 90 91 92 93 94
    }

    Rectangle {
        anchors.margins:    parent.width / 4
        anchors.fill:       parent
        radius:             width / 2
        border.color:       mapPal.thumbJoystick
        border.width:       2
        color:              "transparent"
    }

95 96 97 98 99 100 101 102
    Rectangle {
        anchors.fill:       parent
        radius:             width / 2
        border.color:       mapPal.thumbJoystick
        border.width:       2
        color:              "transparent"
    }

Don Gagne's avatar
Don Gagne committed
103 104 105 106 107
    Rectangle {
        width:  hatWidth
        height: hatWidth
        radius: hatWidthHalf
        color:  mapPal.thumbJoystick
Don Gagne's avatar
Don Gagne committed
108 109
        x:      stickPositionX - hatWidthHalf
        y:      stickPositionY - hatWidthHalf
Don Gagne's avatar
Don Gagne committed
110 111 112 113

        readonly property real hatWidth:        ScreenTools.defaultFontPixelHeight
        readonly property real hatWidthHalf:    ScreenTools.defaultFontPixelHeight / 2
    }
Don Gagne's avatar
Don Gagne committed
114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138

    Connections {
        target: touchPoint

        onXChanged: {
            if (_processTouchPoints) {
                _joyRoot.stickPositionX = Math.max(Math.min(touchPoint.x, _joyRoot.width), 0)
            }
        }
        onYChanged: {
            if (_processTouchPoints) {
                _joyRoot.stickPositionY = Math.max(Math.min(touchPoint.y, _joyRoot.height), 0)
            }
        }
    }

    MultiPointTouchArea {
        anchors.fill:       parent
        minimumTouchPoints: 1
        maximumTouchPoints: 1
        touchPoints:        [ TouchPoint { id: touchPoint } ]

        onPressed:  _joyRoot.thumbDown(touchPoints)
        onReleased: _joyRoot.reCenter()
    }
Don Gagne's avatar
Don Gagne committed
139
}