zhaohuwei
/
QG4
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

ThumbStick improvements 

- Positions are bounded to rectangle
- No longer re-centers if thumbs go outside bounds
- ThumbPad moves to meet first thumb position, this prevents
inadvertent movement as you put your thumb down
QGC4.4
Don Gagne 9 years ago
parent
08921496ff
commit
b946e88944
2 changed files with 84 additions and 116 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 121
      src/FlightDisplay/FlightDisplayView.qml
  2. 79
      src/QmlControls/JoystickThumbPad.qml

121
src/FlightDisplay/FlightDisplayView.qml
Unescape View File

@ -208,95 +208,18 @@ Item { @@ -208,95 +208,18 @@ Item {
//-- Virtual Joystick
Item {
id: multiTouchItem
width: parent.width - (pip.width / 2)
height: thumbAreaHeight
visible: QGroundControl.virtualTabletJoystick
anchors.bottom: pip.top
anchors.bottomMargin: ScreenTools.defaultFontPixelHeight * 2
anchors.horizontalCenter: parent.horizontalCenter
id: multiTouchItem
width: parent.width - (pip.width / 2)
height: thumbAreaHeight
visible: QGroundControl.virtualTabletJoystick
anchors.bottom: pip.top
anchors.bottomMargin: ScreenTools.defaultFontPixelHeight * 2
anchors.horizontalCenter: parent.horizontalCenter
readonly property real thumbAreaHeight: Math.min(parent.height * 0.25, ScreenTools.defaultFontPixelWidth * 16)
QGCMapPalette { id: mapPal; lightColors: !isBackgroundDark }
MultiPointTouchArea {
anchors.fill: parent
touchPoints: [
TouchPoint { id: point1 },
TouchPoint { id: point2 }
]
property var leftRect: Qt.rect(0, 0, parent.thumbAreaHeight, parent.thumbAreaHeight)
property var rightRect: Qt.rect(parent.width - parent.thumbAreaHeight, 0, parent.thumbAreaHeight, parent.thumbAreaHeight)
function pointInRect(rect, point) {
return point.x >= rect.x &&
point.y >= rect.y &&
point.x <= rect.x + rect.width &&
point.y <= rect.y + rect.height
}
function newTouchPoints(touchPoints)
{
var point1Location = 0
var point2Location = 0
var point1
if (touchPoints.length > 0) {
point1 = touchPoints[0]
if (pointInRect(leftRect, point1)) {
point1Location = -1
} else if (pointInRect(rightRect, point1)) {
point1Location = 1
}
}
var point2
if (touchPoints.length == 2) {
point2 = touchPoints[1]
if (pointInRect(leftRect, point2)) {
point2Location = -1
} else if (pointInRect(rightRect, point2)) {
point2Location = 1
}
}
var leftStickSet = false
var rightStickSet = false
// Make sure points are not both in the same rect
if (point1Location != point2Location) {
if (point1Location != 0) {
if (point1Location == -1) {
leftStick.stickPosition = point1
leftStickSet = true
} else {
rightStick.stickPosition = Qt.point(point1.x - (multiTouchItem.width - multiTouchItem.thumbAreaHeight), point1.y)
rightStickSet = true
}
}
if (point2Location != 0) {
if (point2Location == -1) {
leftStick.stickPosition = point2
leftStickSet = true
} else {
rightStick.stickPosition = Qt.point(point2.x - (multiTouchItem.width - multiTouchItem.thumbAreaHeight), point2.y)
rightStickSet = true
}
}
}
if (!leftStickSet) {
leftStick.reCenter()
}
if (!rightStickSet) {
rightStick.reCenter()
}
}
onTouchUpdated: newTouchPoints(touchPoints)
}
Timer {
interval: 40 // 25Hz, same as real joystick rate
running: QGroundControl.virtualTabletJoystick && _activeVehicle
@ -309,22 +232,26 @@ Item { @@ -309,22 +232,26 @@ Item {
}
JoystickThumbPad {
id: leftStick
anchors.left: parent.left
anchors.bottom: parent.bottom
width: parent.thumbAreaHeight
height: parent.thumbAreaHeight
yAxisThrottle: true
lightColors: !isBackgroundDark
id: leftStick
anchors.leftMargin: xPositionDelta
anchors.bottomMargin: -yPositionDelta
anchors.left: parent.left
anchors.bottom: parent.bottom
width: parent.thumbAreaHeight
height: parent.thumbAreaHeight
yAxisThrottle: true
lightColors: !isBackgroundDark
}
JoystickThumbPad {
id: rightStick
anchors.right: parent.right
anchors.bottom: parent.bottom
width: parent.thumbAreaHeight
height: parent.thumbAreaHeight
lightColors: !isBackgroundDark
id: rightStick
anchors.rightMargin: -xPositionDelta
anchors.bottomMargin: -yPositionDelta
anchors.right: parent.right
anchors.bottom: parent.bottom
width: parent.thumbAreaHeight
height: parent.thumbAreaHeight
lightColors: !isBackgroundDark
}
}
}

79
src/QmlControls/JoystickThumbPad.qml
Unescape View File

@ -7,29 +7,30 @@ import QGroundControl.ScreenTools 1.0 @@ -7,29 +7,30 @@ import QGroundControl.ScreenTools 1.0
Item {
id: _joyRoot
property alias lightColors: mapPal.lightColors /// true: use light colors from QGCMapPalette for drawing
property var stickPosition: Qt.point(0, 0)
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 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
property real yPositionDelta: 0 ///< Anount to move the control on y axis
property bool _stickCenteredOnce: false
property real _centerXY: width / 2
property bool _processTouchPoints: false
property bool _stickCenteredOnce: false
property real stickPositionX: _centerXY
property real stickPositionY: _centerXY
QGCMapPalette { id: mapPal }
onWidthChanged: {
if (!_stickCenteredOnce && width != 0) {
reCenter()
}
}
onStickPositionChanged: {
var xAxisTemp = stickPosition.x / width
onStickPositionXChanged: {
var xAxisTemp = stickPositionX / width
xAxisTemp *= 2.0
xAxisTemp -= 1.0
xAxis = xAxisTemp
}
var yAxisTemp = stickPosition.y / width
onStickPositionYChanged: {
var yAxisTemp = stickPositionY / width
yAxisTemp *= 2.0
yAxisTemp -= 1.0
if (yAxisThrottle) {
@ -40,11 +41,26 @@ Item { @@ -40,11 +41,26 @@ Item {
function reCenter()
{
stickPosition = Qt.point(width / 2, width / 2)
_processTouchPoints = false
// Move control back to original position
xPositionDelta = 0
yPositionDelta = 0
// Center sticks
stickPositionX = _centerXY
stickPositionY = _centerXY
}
function thumbDown(touchPoints)
{
// Center the control around the initial thumb position
xPositionDelta = touchPoints[0].x - _centerXY
yPositionDelta = touchPoints[0].y - _centerXY
// We need to wait until we move the control to the right position before we process touch points
_processTouchPoints = true
}
/*
Keep in for debugging
// Keep in for debugging
Column {
QGCLabel { text: xAxis }
QGCLabel { text: yAxis }
@ -72,10 +88,35 @@ Item { @@ -72,10 +88,35 @@ Item {
height: hatWidth
radius: hatWidthHalf
color: mapPal.thumbJoystick
x: stickPosition.x - hatWidthHalf
y: stickPosition.y - hatWidthHalf
x: stickPositionX - hatWidthHalf
y: stickPositionY - hatWidthHalf
readonly property real hatWidth: ScreenTools.defaultFontPixelHeight
readonly property real hatWidthHalf: ScreenTools.defaultFontPixelHeight / 2
}
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()
}
}

Write Preview
Loading…
Cancel
Save