Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multi Vehicle Panel Overhaul #11970

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
Open
4 changes: 4 additions & 0 deletions qgroundcontrol.qrc
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,7 @@
<file alias="QGroundControl/Controls/MissionItemStatus.qml">src/PlanView/MissionItemStatus.qml</file>
<file alias="QGroundControl/Controls/ModeSwitchDisplay.qml">src/QmlControls/ModeSwitchDisplay.qml</file>
<file alias="QGroundControl/Controls/MultiRotorMotorDisplay.qml">src/QmlControls/MultiRotorMotorDisplay.qml</file>
<file alias="QGroundControl/Controls/MvPanelPage.qml">src/QmlControls/MvPanelPage.qml</file>
<file alias="QGroundControl/Controls/OfflineMapButton.qml">src/QmlControls/OfflineMapButton.qml</file>
<file alias="QGroundControl/Controls/OfflineMapEditor.qml">src/QtLocationPlugin/QMLControl/OfflineMapEditor.qml</file>
<file alias="QGroundControl/Controls/OfflineMapInfo.qml">src/UI/preferences/OfflineMapInfo.qml</file>
Expand Down Expand Up @@ -168,12 +169,14 @@
<file alias="QGroundControl/Controls/QGCMenuSeparator.qml">src/QmlControls/QGCMenuSeparator.qml</file>
<file alias="QGroundControl/Controls/QGCMouseArea.qml">src/QmlControls/QGCMouseArea.qml</file>
<file alias="QGroundControl/Controls/QGCMovableItem.qml">src/QmlControls/QGCMovableItem.qml</file>
<file alias="QGroundControl/Controls/QGCPageIndicator.qml">src/QmlControls/QGCPageIndicator.qml</file>
<file alias="QGroundControl/Controls/QGCPopupDialog.qml">src/QmlControls/QGCPopupDialog.qml</file>
<file alias="QGroundControl/Controls/PipView.qml">src/QmlControls/PipView.qml</file>
<file alias="QGroundControl/Controls/PipState.qml">src/QmlControls/PipState.qml</file>
<file alias="QGroundControl/Controls/QGCRadioButton.qml">src/QmlControls/QGCRadioButton.qml</file>
<file alias="QGroundControl/Controls/QGCSimpleMessageDialog.qml">src/QmlControls/QGCSimpleMessageDialog.qml</file>
<file alias="QGroundControl/Controls/QGCSlider.qml">src/QmlControls/QGCSlider.qml</file>
<file alias="QGroundControl/Controls/QGCSwipeView.qml">src/QmlControls/QGCSwipeView.qml</file>
<file alias="QGroundControl/Controls/QGCSwitch.qml">src/QmlControls/QGCSwitch.qml</file>
<file alias="QGroundControl/Controls/QGCTabBar.qml">src/QmlControls/QGCTabBar.qml</file>
<file alias="QGroundControl/Controls/QGCTabButton.qml">src/QmlControls/QGCTabButton.qml</file>
Expand Down Expand Up @@ -351,6 +354,7 @@
<file alias="Viewer3D/Models3D/Line3D.qml">src/Viewer3D/Viewer3DQml/Models3D/Line3D.qml</file>
<file alias="Viewer3D/Models3D/Viewer3DVehicleItems.qml">src/Viewer3D/Viewer3DQml/Models3D/Viewer3DVehicleItems.qml</file>
<file alias="Viewer3D/Viewer3DProgressBar.qml">src/Viewer3D/Viewer3DQml/Viewer3DProgressBar.qml</file>
<file alias="QGroundControl/FlightDisplay/FlyViewTopRightPanel.qml">src/FlightDisplay/FlyViewTopRightPanel.qml</file>
</qresource>
<qresource prefix="/FirstRunPromptDialogs">
<file alias="UnitsFirstRunPrompt.qml">src/FirstRunPromptDialogs/UnitsFirstRunPrompt.qml</file>
Expand Down
31 changes: 2 additions & 29 deletions src/FlightDisplay/FlyViewTopRightColumnLayout.qml
Original file line number Diff line number Diff line change
Expand Up @@ -20,28 +20,7 @@ import QGroundControl.ScreenTools
ColumnLayout {
width: _rightPanelWidth

RowLayout {
id: multiVehiclePanelSelector
Layout.alignment: Qt.AlignTop
spacing: ScreenTools.defaultFontPixelWidth
visible: QGroundControl.multiVehicleManager.vehicles.count > 1 && QGroundControl.corePlugin.options.flyView.showMultiVehicleList

QGCMapPalette { id: mapPal; lightColors: true }

QGCRadioButton {
id: singleVehicleRadio
text: qsTr("Single")
checked: _showSingleVehicleUI
onClicked: _showSingleVehicleUI = true
textColor: mapPal.text
}

QGCRadioButton {
text: qsTr("Multi-Vehicle")
textColor: mapPal.text
onClicked: _showSingleVehicleUI = false
}
}
property bool mvPanelVisible: false

TerrainProgress {
Layout.alignment: Qt.AlignTop
Expand All @@ -54,7 +33,7 @@ ColumnLayout {
Loader {
id: photoVideoControlLoader
Layout.alignment: Qt.AlignTop | Qt.AlignRight
sourceComponent: globals.activeVehicle && _showSingleVehicleUI ? photoVideoControlComponent : undefined
sourceComponent: globals.activeVehicle && !mvPanelVisible ? photoVideoControlComponent : undefined

property real rightEdgeCenterInset: visible ? parent.width - x : 0

Expand All @@ -65,10 +44,4 @@ ColumnLayout {
}
}
}

MultiVehicleList {
Layout.preferredWidth: _rightPanelWidth
Layout.fillHeight: true
visible: !_showSingleVehicleUI
}
}
213 changes: 213 additions & 0 deletions src/FlightDisplay/FlyViewTopRightPanel.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,213 @@
/****************************************************************************
*
* (c) 2009-2020 QGROUNDCONTROL PROJECT <http://www.qgroundcontrol.org>
*
* QGroundControl is licensed according to the terms in the file
* COPYING.md in the root of the source code directory.
*
****************************************************************************/

import QtQuick
import QtQuick.Layouts

import QGroundControl
import QGroundControl.Controls
import QGroundControl.FlightDisplay
import QGroundControl.FlightMap
import QGroundControl.Palette
import QGroundControl.ScreenTools


Item {

property bool panelVisible: togglePanelBtn.checked
property alias toggleBtn: togglePanelBtn

Rectangle {
id: topRightPanel
anchors.fill: parent
color: qgcPal.toolbarBackground
visible: !QGroundControl.videoManager.fullScreen && togglePanelBtn.checked
clip: true

QGCPalette { id: qgcPal }

MultiVehicleList {
id: multiVehicleList
anchors.top: parent.top
anchors.bottom: parent.verticalCenter
anchors.right: parent.right
anchors.left: parent.left
anchors.margins: ScreenTools.defaultFontPixelHeight / 2

Rectangle {
anchors.fill: parent

gradient: Gradient {
orientation: Gradient.Vertical

GradientStop { position: 0.95; color: "transparent" }
GradientStop { position: 1.0; color: topRightPanel.color }
}

Rectangle {
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: 1
color: QGroundControl.globalPalette.groupBorder
}
}

}

QGCSwipeView {
id: swipePages
anchors.top: parent.verticalCenter
anchors.bottom: parent.bottom
anchors.right: parent.right
anchors.left: parent.left

MvPanelPage {
id: buttonsPage

ColumnLayout {
anchors.right: parent.right
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
anchors.bottomMargin: ScreenTools.defaultFontPixelHeight * 3
spacing: ScreenTools.defaultFontPixelHeight / 2

QGCLabel {
text: qsTr("Multi Vehicle Selection")
Layout.alignment: Qt.AlignHCenter
}

RowLayout {
id: selectionRowLayout
Layout.alignment: Qt.AlignHCenter

QGCButton {
text: qsTr("Select All")
enabled: multiVehicleList.selectedVehicles && multiVehicleList.selectedVehicles.count !== QGroundControl.multiVehicleManager.vehicles.count
onClicked: multiVehicleList.selectAll()
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 5
}

QGCButton {
text: qsTr("Deselect All")
enabled: multiVehicleList.selectedVehicles && multiVehicleList.selectedVehicles.count > 0
onClicked: multiVehicleList.deselectAll()
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 5

}
}


QGCLabel {
text: qsTr("Multi Vehicle Actions")
Layout.alignment: Qt.AlignHCenter
}

RowLayout {
id: actionRowLayout
Layout.alignment: Qt.AlignHCenter

QGCButton {
text: qsTr("Arm")
enabled: multiVehicleList.armAvailable()
onClicked: _guidedController.confirmAction(_guidedController.actionMVArm)
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 2.75
leftPadding: 0
rightPadding: 0
}

QGCButton {
text: qsTr("Disarm")
enabled: multiVehicleList.disarmAvailable()
onClicked: _guidedController.confirmAction(_guidedController.actionMVDisarm)
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 2.75
leftPadding: 0
rightPadding: 0
}

QGCButton {
text: qsTr("Start")
enabled: multiVehicleList.startAvailable()
onClicked: _guidedController.confirmAction(_guidedController.actionMVStartMission)
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 2.75
leftPadding: 0
rightPadding: 0
}

QGCButton {
text: qsTr("Pause")
enabled: multiVehicleList.pauseAvailable()
onClicked: _guidedController.confirmAction(_guidedController.actionMVPause)
Layout.preferredWidth: ScreenTools.defaultFontPixelHeight * 2.75
leftPadding: 0
rightPadding: 0
}
}
}
} // Page 1

MvPanelPage {

// We use a Loader to load the photoVideoControlComponent only when the active vehicle is not null
// This make it easier to implement PhotoVideoControl without having to check for the mavlink camera
// to be null all over the place

Loader {
id: photoVideoControlLoader
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottomMargin: ScreenTools.defaultFontPixel
sourceComponent: globals.activeVehicle && togglePanelBtn.checked ? photoVideoControlComponent : undefined

property real rightEdgeCenterInset: visible ? parent.width - x : 0

Component {
id: photoVideoControlComponent

PhotoVideoControl {
}
}
}
} // Page 2
}

QGCPageIndicator {
id: pageIndicator
count: swipePages.count
currentIndex: swipePages.currentIndex
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
anchors.bottomMargin: togglePanelBtn.height

delegate: Rectangle {
height: ScreenTools.defaultFontPixelHeight / 2
width: height
radius: width / 2
color: model.index === pageIndicator.currentIndex ? qgcPal.text : qgcPal.button
opacity: model.index === pageIndicator.currentIndex ? 0.9 : 0.3
}
}
}

QGCButton {
id: togglePanelBtn
anchors.top: parent.top
anchors.horizontalCenter: parent.horizontalCenter
anchors.topMargin: topRightPanel.visible ? parent.height : 0
width: _rightPanelWidth / 5
height: _rightPanelWidth / 18
checkable: true

background: Rectangle {
radius: parent.height / 2
color: qgcPal.toolbarBackground
border.color: parent.checked ? QGroundControl.globalPalette.groupBorder : qgcPal.text
border.width: 1
}
}
}
25 changes: 20 additions & 5 deletions src/FlightDisplay/FlyViewWidgetLayer.qml
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ Item {
property real _margins: ScreenTools.defaultFontPixelWidth / 2
property real _toolsMargin: ScreenTools.defaultFontPixelWidth * 0.75
property rect _centerViewport: Qt.rect(0, 0, width, height)
property real _rightPanelWidth: ScreenTools.defaultFontPixelWidth * 30
property real _rightPanelWidth: ScreenTools.defaultFontPixelWidth * 40
property alias _gripperMenu: gripperOptions
property real _layoutMargin: ScreenTools.defaultFontPixelWidth * 0.75
property bool _layoutSpacing: ScreenTools.defaultFontPixelWidth
Expand All @@ -59,24 +59,39 @@ Item {
leftEdgeTopInset: toolStrip.leftEdgeTopInset
leftEdgeCenterInset: toolStrip.leftEdgeCenterInset
leftEdgeBottomInset: virtualJoystickMultiTouch.visible ? virtualJoystickMultiTouch.leftEdgeBottomInset : parentToolInsets.leftEdgeBottomInset
rightEdgeTopInset: topRightColumnLayout.rightEdgeTopInset
rightEdgeCenterInset: topRightColumnLayout.rightEdgeCenterInset
rightEdgeTopInset: topRightPanel.rightEdgeTopInset
rightEdgeCenterInset: topRightPanel.rightEdgeCenterInset
rightEdgeBottomInset: bottomRightRowLayout.rightEdgeBottomInset
topEdgeLeftInset: toolStrip.topEdgeLeftInset
topEdgeCenterInset: mapScale.topEdgeCenterInset
topEdgeRightInset: topRightColumnLayout.topEdgeRightInset
topEdgeRightInset: topRightPanel.topEdgeRightInset
bottomEdgeLeftInset: virtualJoystickMultiTouch.visible ? virtualJoystickMultiTouch.bottomEdgeLeftInset : parentToolInsets.bottomEdgeLeftInset
bottomEdgeCenterInset: bottomRightRowLayout.bottomEdgeCenterInset
bottomEdgeRightInset: virtualJoystickMultiTouch.visible ? virtualJoystickMultiTouch.bottomEdgeRightInset : bottomRightRowLayout.bottomEdgeRightInset
}

FlyViewTopRightPanel {
id: topRightPanel
anchors.top: parent.top
anchors.right: parent.right
anchors.rightMargin: _layoutMargin
width: _rightPanelWidth
height: _rightPanelWidth * 1.75

property real topEdgeRightInset: height + _layoutMargin
property real rightEdgeTopInset: width + _layoutMargin
property real rightEdgeCenterInset: rightEdgeTopInset
}

FlyViewTopRightColumnLayout {
id: topRightColumnLayout
anchors.margins: _layoutMargin
anchors.top: parent.top
anchors.top: topRightPanel.top
anchors.bottom: bottomRightRowLayout.top
anchors.right: parent.right
anchors.topMargin: topRightPanel.toggleBtn.height + _toolsMargin
spacing: _layoutSpacing
mvPanelVisible: topRightPanel.panelVisible

property real topEdgeRightInset: childrenRect.height + _layoutMargin
property real rightEdgeTopInset: width + _layoutMargin
Expand Down
Loading
Loading