Skip to content

Commit

Permalink
Rework app settings and vehicle config buttons
Browse files Browse the repository at this point in the history
These now have consistent visuals
  • Loading branch information
DonLakeFlyer committed Feb 13, 2025
1 parent b7d88ff commit 3d82c8a
Show file tree
Hide file tree
Showing 9 changed files with 106 additions and 72 deletions.
2 changes: 2 additions & 0 deletions qgroundcontrol.qrc
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@
<file alias="QGroundControl/Controls/CameraCalcGrid.qml">src/PlanView/CameraCalcGrid.qml</file>
<file alias="QGroundControl/Controls/CameraSection.qml">src/PlanView/CameraSection.qml</file>
<file alias="QGroundControl/Controls/ClickableColor.qml">src/QmlControls/ClickableColor.qml</file>
<file alias="QGroundControl/Controls/ConfigButton.qml">src/QmlControls/ConfigButton.qml</file>
<file alias="QGroundControl/Controls/CorridorScanMapVisual.qml">src/PlanView/CorridorScanMapVisual.qml</file>
<file alias="QGroundControl/Controls/DeadMouseArea.qml">src/QmlControls/DeadMouseArea.qml</file>
<file alias="QGroundControl/Controls/DropButton.qml">src/QmlControls/DropButton.qml</file>
Expand Down Expand Up @@ -185,6 +186,7 @@
<file alias="QGroundControl/Controls/QGCRoundButton.qml">src/QmlControls/QGCRoundButton.qml</file>
<file alias="QGroundControl/Controls/SectionHeader.qml">src/QmlControls/SectionHeader.qml</file>
<file alias="QGroundControl/Controls/SelectableControl.qml">src/QmlControls/SelectableControl.qml</file>
<file alias="QGroundControl/Controls/SettingsButton.qml">src/QmlControls/SettingsButton.qml</file>
<file alias="QGroundControl/Controls/SetupPage.qml">src/AutoPilotPlugins/Common/SetupPage.qml</file>
<file alias="QGroundControl/Controls/SignalStrength.qml">src/UI/toolbar/SignalStrength.qml</file>
<file alias="QGroundControl/Controls/SimpleItemMapVisual.qml">src/PlanView/SimpleItemMapVisual.qml</file>
Expand Down
1 change: 0 additions & 1 deletion src/AnalyzeView/AnalyzeView.qml
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,6 @@ Rectangle {
SubMenuButton {
id: subMenu
imageResource: modelData.icon
setupIndicator: false
autoExclusive: true
text: modelData.title

Expand Down
2 changes: 1 addition & 1 deletion src/AutoPilotPlugins/Common/SetupPage.qml
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ Item {
property bool _disableDueToFlying: vehicleComponent ? (!_vehicleIsRover && !vehicleComponent.allowSetupWhileFlying && _vehicleFlying) : false
property string _disableReason: _disableDueToArmed ? qsTr("armed") : qsTr("flying")
property real _margins: ScreenTools.defaultFontPixelHeight * 0.5
property string _pageTitle: qsTr("%1 Setup").arg(pageName)
property string _pageTitle: qsTr("%1 Config").arg(pageName)

Component.onCompleted: {
if(pageLoader.item && pageLoader.item.setupPageCompleted) {
Expand Down
16 changes: 16 additions & 0 deletions src/QmlControls/ConfigButton.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
/****************************************************************************
*
* (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 QGroundControl.Controls

SettingsButton {
icon.color: setupComplete ? textColor : "red"

property bool setupComplete: true
}
2 changes: 2 additions & 0 deletions src/QmlControls/QGroundControl/Controls/qmldir
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ CameraCalcCamera 1.0 CameraCalcCamera.qml
CameraCalcGrid 1.0 CameraCalcGrid.qml
CameraSection 1.0 CameraSection.qml
ClickableColor 1.0 ClickableColor.qml
ConfigButton 1.0 ConfigButton.qml
DeadMouseArea 1.0 DeadMouseArea.qml
DropButton 1.0 DropButton.qml
DropPanel 1.0 DropPanel.qml
Expand Down Expand Up @@ -107,6 +108,7 @@ RCToParamDialog 1.0 RCToParamDialog.qml
RemoteIDIndicatorPage 1.0 RemoteIDIndicatorPage.qml
SectionHeader 1.0 SectionHeader.qml
SelectableControl 1.0 SelectableControl.qml
SettingsButton 1.0 SettingsButton.qml
SettingsGroupLayout 1.0 SettingsGroupLayout.qml
SetupPage 1.0 SetupPage.qml
SignalStrength 1.0 SignalStrength.qml
Expand Down
57 changes: 57 additions & 0 deletions src/QmlControls/SettingsButton.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
/****************************************************************************
*
* (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.Controls
import QtQuick.Layouts

import QGroundControl
import QGroundControl.Controls
import QGroundControl.Palette
import QGroundControl.ScreenTools

Button {
id: control
padding: ScreenTools.defaultFontPixelWidth * 0.75
hoverEnabled: !ScreenTools.isMobile
autoExclusive: true
icon.color: textColor

property color textColor: checked || pressed ? qgcPal.buttonHighlightText : qgcPal.buttonText

QGCPalette {
id: qgcPal
colorGroupEnabled: control.enabled
}

background: Rectangle {
color: qgcPal.buttonHighlight
opacity: checked || pressed ? 1 : enabled && hovered ? .2 : 0
radius: ScreenTools.defaultFontPixelWidth / 2
}

contentItem: RowLayout {
spacing: ScreenTools.defaultFontPixelWidth

QGCColoredImage {
source: control.icon.source
color: control.icon.color
width: ScreenTools.defaultFontPixelHeight
height: ScreenTools.defaultFontPixelHeight
}

QGCLabel {
id: displayText
Layout.fillWidth: true
text: control.text
color: control.textColor
horizontalAlignment: QGCLabel.AlignLeft
}
}
}
18 changes: 8 additions & 10 deletions src/QmlControls/SubMenuButton.qml
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,18 @@ import QGroundControl.ScreenTools

Button {
id: control
text: "Button"
focusPolicy: Qt.ClickFocus
hoverEnabled: !ScreenTools.isMobile
implicitHeight: ScreenTools.defaultFontPixelHeight * 2.5

property bool setupComplete: true ///< true: setup complete indicator shows as completed
property bool setupIndicator: true ///< true: show setup complete indicator
property var imageColor: undefined
property string imageResource: "/qmlimages/subMenuButtonImage.png" ///< Button image
property size sourceSize: Qt.size(ScreenTools.defaultFontPixelHeight * 2, ScreenTools.defaultFontPixelHeight * 2)
property bool largeSize: false
property bool showHighlight: control.pressed | control.checked

text: "Button" ///< Pass in your own button text
focusPolicy: Qt.ClickFocus
hoverEnabled: !ScreenTools.isMobile

implicitHeight: ScreenTools.isTinyScreen ? ScreenTools.defaultFontPixelHeight * 3.5 : ScreenTools.defaultFontPixelHeight * 2.5
//implicitWidth: __panel.implicitWidth
property size sourceSize: Qt.size(ScreenTools.defaultFontPixelHeight * 2, ScreenTools.defaultFontPixelHeight * 2)

property ButtonGroup buttonGroup: null
onButtonGroupChanged: {
Expand All @@ -36,8 +36,6 @@ Button {
colorGroupEnabled: control.enabled
}

property bool showHighlight: control.pressed | control.checked

background: Rectangle {
id: innerRect
color: qgcPal.windowShade
Expand Down
30 changes: 1 addition & 29 deletions src/UI/AppSettings.qml
Original file line number Diff line number Diff line change
Expand Up @@ -79,40 +79,12 @@ Rectangle {
id: buttonRepeater
model: settingsPagesModel

Button {
SettingsButton {
Layout.fillWidth: true
text: name
padding: ScreenTools.defaultFontPixelWidth / 2
hoverEnabled: !ScreenTools.isMobile
autoExclusive: true
icon.source: iconUrl
visible: pageVisible()

background: Rectangle {
color: qgcPal.buttonHighlight
opacity: checked || pressed ? 1 : enabled && hovered ? .2 : 0
radius: ScreenTools.defaultFontPixelWidth / 2
}

contentItem: RowLayout {
spacing: ScreenTools.defaultFontPixelWidth

QGCColoredImage {
source: iconUrl
color: displayText.color
width: ScreenTools.defaultFontPixelHeight
height: ScreenTools.defaultFontPixelHeight
}

QGCLabel {
id: displayText
Layout.fillWidth: true
text: name
color: checked || pressed ? qgcPal.buttonHighlightText : qgcPal.buttonText
horizontalAlignment: QGCLabel.AlignLeft
}
}

onClicked: {
if (mainWindow.allowViewSwitch()) {
if (rightPanel.source !== url) {
Expand Down
50 changes: 19 additions & 31 deletions src/VehicleSetup/SetupView.qml
Original file line number Diff line number Diff line change
Expand Up @@ -216,47 +216,29 @@ Rectangle {

ColumnLayout {
id: buttonColumn
spacing: _defaultTextHeight / 2
spacing: ScreenTools.defaultFontPixelHeight / 4

SubMenuButton {
ConfigButton {
id: summaryButton
imageResource: "/qmlimages/VehicleSummaryIcon.png"
setupIndicator: false
icon.source: "/qmlimages/VehicleSummaryIcon.png"
checked: true
buttonGroup: setupButtonGroup
text: qsTr("Summary")
Layout.fillWidth: true

onClicked: showSummaryPanel()
}

SubMenuButton {
id: firmwareButton
imageResource: "/qmlimages/FirmwareUpgradeIcon.png"
setupIndicator: false
buttonGroup: setupButtonGroup
visible: !ScreenTools.isMobile && _corePlugin.options.showFirmwareUpgrade
text: qsTr("Firmware")
Layout.fillWidth: true

onClicked: showPanel(this, "FirmwareUpgrade.qml")
}

SubMenuButton {
buttonGroup: setupButtonGroup
ConfigButton {
visible: QGroundControl.multiVehicleManager.activeVehicle ? QGroundControl.multiVehicleManager.activeVehicle.flowImageIndex > 0 : false
setupIndicator: false
text: qsTr("Optical Flow")
Layout.fillWidth: true
onClicked: showPanel(this, "OpticalFlowSensor.qml")
}

SubMenuButton {
ConfigButton {
id: joystickButton
imageResource: "/qmlimages/Joystick.png"
setupIndicator: true
icon.source: "/qmlimages/Joystick.png"
setupComplete: _activeJoystick ? _activeJoystick.calibrated || _buttonsOnly : false
buttonGroup: setupButtonGroup
visible: _fullParameterVehicleAvailable && joystickManager.joysticks.length !== 0
text: _forcedToButtonsOnly ? qsTr("Buttons") : qsTr("Joystick")
Layout.fillWidth: true
Expand All @@ -271,11 +253,9 @@ Rectangle {
id: componentRepeater
model: _fullParameterVehicleAvailable ? QGroundControl.multiVehicleManager.activeVehicle.autopilot.vehicleComponents : 0

SubMenuButton {
imageResource: modelData.iconResource
setupIndicator: modelData.requiresSetup
ConfigButton {
icon.source: modelData.iconResource
setupComplete: modelData.setupComplete
buttonGroup: setupButtonGroup
text: modelData.name
visible: modelData.setupSource.toString() !== ""
Layout.fillWidth: true
Expand All @@ -285,18 +265,26 @@ Rectangle {
}
}

SubMenuButton {
ConfigButton {
id: parametersButton
setupIndicator: false
buttonGroup: setupButtonGroup
visible: QGroundControl.multiVehicleManager.parameterReadyVehicleAvailable &&
!QGroundControl.multiVehicleManager.activeVehicle.usingHighLatencyLink &&
_corePlugin.showAdvancedUI
text: qsTr("Parameters")
Layout.fillWidth: true
icon.source: "/qmlimages/subMenuButtonImage.png"
onClicked: showPanel(this, "SetupParameterEditor.qml")
}

ConfigButton {
id: firmwareButton
icon.source: "/qmlimages/FirmwareUpgradeIcon.png"
visible: !ScreenTools.isMobile && _corePlugin.options.showFirmwareUpgrade
text: qsTr("Firmware")
Layout.fillWidth: true

onClicked: showPanel(this, "FirmwareUpgrade.qml")
}
}
}

Expand Down

0 comments on commit 3d82c8a

Please sign in to comment.