Skip to content

More work on toolbar transparency #13528

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.

Sign up for GitHub

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

Merged
merged 1 commit into from
Oct 14, 2025
Merged

More work on toolbar transparency #13528

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/QmlControls/BatteryIndicator.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ Item {
QGCLabel {
Layout.alignment: Qt.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
text: getBatteryPercentageText()
font.pointSize: _showBoth ? ScreenTools.defaultFontPointSize : ScreenTools.mediumFontPointSize
visible: _showBoth || _showPercentage
Expand All @@ -187,7 +187,7 @@ Item {
QGCLabel {
Layout.alignment: Qt.AlignHCenter
font.pointSize: _showBoth ? ScreenTools.defaultFontPointSize : ScreenTools.mediumFontPointSize
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
text: getBatteryVoltageText()
visible: _showBoth || _showVoltage
}
Expand Down
29 changes: 14 additions & 15 deletions src/QmlControls/FlightModeIndicator.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,8 @@ import QGroundControl.Controls
import QGroundControl.FactControls

Item {
id: control
width: mainLayout.width
height: mainLayout.height
id: control
Layout.preferredWidth: mainLayout.width

property bool showIndicator: true
property bool waitForParameters: true // UI won't show until parameters are ready
Expand All @@ -35,31 +34,31 @@ Item {
QGCPalette { id: qgcPal }

RowLayout {
id: mainLayout
spacing: ScreenTools.defaultFontPixelWidth / 2
id: mainLayout
anchors.verticalCenter: parent.verticalCenter
spacing: ScreenTools.defaultFontPixelWidth / 2

QGCColoredImage {
id: flightModeIcon
width: ScreenTools.defaultFontPixelWidth * 3
height: ScreenTools.defaultFontPixelHeight
fillMode: Image.PreserveAspectFit
mipmap: true
color: qgcPal.toolbarText
source: "/qmlimages/FlightModesComponentIcon.png"
id: flightModeIcon
Layout.preferredWidth: ScreenTools.defaultFontPixelWidth * 3
Layout.preferredHeight: ScreenTools.defaultFontPixelHeight
fillMode: Image.PreserveAspectFit
mipmap: true
color: qgcPal.windowTransparentText
source: "/qmlimages/FlightModesComponentIcon.png"
}

QGCLabel {
id: flightModeLabel
text: activeVehicle ? activeVehicle.flightMode : qsTr("N/A", "No data to display")
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
font.pointSize: fontPointSize
Layout.alignment: Qt.AlignCenter

}

QGCLabel {
id: vtolModeLabel
Layout.fillHeight: true
Layout.alignment: Qt.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: _vtolInFWDFlight ? qsTr("FW\nVTOL") : qsTr("MR\nVTOL")
font.pointSize: ScreenTools.smallFontPointSize
Expand Down
100 changes: 28 additions & 72 deletions src/QmlControls/FlyViewToolBar.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,15 @@ import QGroundControl
import QGroundControl.Controls

Rectangle {
id: _root
id: control
width: parent.width
height: ScreenTools.toolbarHeight
color: qgcPal.toolbarBackground
color: "transparent"

property var _activeVehicle: QGroundControl.multiVehicleManager.activeVehicle
property bool _communicationLost: _activeVehicle ? _activeVehicle.vehicleLinkManager.communicationLost : false
property color _mainStatusBGColor: qgcPal.brandingPurple
property real _leftRightMargin: ScreenTools.defaultFontPixelWidth * 0.75

function dropMainStatusIndicatorTool() {
mainStatusIndicator.dropMainStatusIndicator();
Expand All @@ -41,27 +42,37 @@ Rectangle {
}

Rectangle {
id: gradientBackground
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
width: leftStatusLayout.width
width: mainStatusLayout.width
opacity: qgcPal.windowTransparent.a

gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0; color: _mainStatusBGColor }
GradientStop { position: qgcButton.x + qgcButton.width; color: _mainStatusBGColor }
GradientStop { position: 1; color: _root.color }
GradientStop { position: 0; color: _mainStatusBGColor }
//GradientStop { position: qgcButton.x + qgcButton.width; color: _mainStatusBGColor }
GradientStop { position: 1; color: qgcPal.window }
}
}

Rectangle {
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: gradientBackground.right
anchors.right: parent.right
color: qgcPal.windowTransparent
}

RowLayout {
id: mainLayout
anchors.bottomMargin: 1
anchors.rightMargin: control._leftRightMargin
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: brandingLogo.visible ? brandingLogo.left : parent.right
anchors.rightMargin: brandingLogo.anchors.margins
anchors.right: parent.right
spacing: ScreenTools.defaultFontPixelWidth

RowLayout {
Expand All @@ -73,7 +84,7 @@ Rectangle {
RowLayout {
id: mainStatusLayout
Layout.fillHeight: true
spacing: ScreenTools.defaultFontPixelWidth / 2
spacing: 0

QGCToolBarButton {
id: qgcButton
Expand All @@ -87,18 +98,18 @@ Rectangle {
id: mainStatusIndicator
Layout.fillHeight: true
}
}

QGCButton {
id: disconnectButton
text: qsTr("Disconnect")
textColor: qgcPal.toolbarText
onClicked: _activeVehicle.closeVehicle()
visible: _activeVehicle && _communicationLost
}
QGCButton {
id: disconnectButton
text: qsTr("Disconnect")
onClicked: _activeVehicle.closeVehicle()
visible: _activeVehicle && _communicationLost
}

FlightModeIndicator {
visible: _activeVehicle
Layout.fillHeight: true
visible: _activeVehicle
}
}

Expand All @@ -116,61 +127,6 @@ Rectangle {
}
}

Image {
id: brandingLogo
anchors.margins: ScreenTools.defaultFontPixelHeight * 0.66
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.right: parent.right
fillMode: Image.PreserveAspectFit
source: _outdoorPalette ? _brandImageOutdoor : _brandImageIndoor
mipmap: true
visible: _showBranding

property bool _showBranding: leftStatusLayout.width + indicatorsFlickable.contentWidth + width + (anchors.margins * 3) < _root.width

property bool _outdoorPalette: qgcPal.globalTheme === QGCPalette.Light
property bool _corePluginBranding: QGroundControl.corePlugin.brandImageIndoor.length != 0
property string _userBrandImageIndoor: QGroundControl.settingsManager.brandImageSettings.userBrandImageIndoor.value
property string _userBrandImageOutdoor: QGroundControl.settingsManager.brandImageSettings.userBrandImageOutdoor.value
property bool _userBrandingIndoor: QGroundControl.settingsManager.brandImageSettings.visible && _userBrandImageIndoor.length != 0
property bool _userBrandingOutdoor: QGroundControl.settingsManager.brandImageSettings.visible && _userBrandImageOutdoor.length != 0
property string _brandImageIndoor: brandImageIndoor()
property string _brandImageOutdoor: brandImageOutdoor()

function brandImageIndoor() {
if (_userBrandingIndoor) {
return _userBrandImageIndoor
} else {
if (_userBrandingOutdoor) {
return _userBrandImageOutdoor
} else {
if (_corePluginBranding) {
return QGroundControl.corePlugin.brandImageIndoor
} else {
return _activeVehicle ? _activeVehicle.brandImageIndoor : ""
}
}
}
}

function brandImageOutdoor() {
if (_userBrandingOutdoor) {
return _userBrandImageOutdoor
} else {
if (_userBrandingIndoor) {
return _userBrandImageIndoor
} else {
if (_corePluginBranding) {
return QGroundControl.corePlugin.brandImageOutdoor
} else {
return _activeVehicle ? _activeVehicle.brandImageOutdoor : ""
}
}
}
}
}

ParameterDownloadProgress {
anchors.fill: parent
}
Expand Down
5 changes: 1 addition & 4 deletions src/QmlControls/FlyViewToolBarIndicators.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,10 @@ import QGroundControl
import QGroundControl.Controls
import QGroundControl.Toolbar

Rectangle {
Item {
anchors.top: parent.top
anchors.bottom: parent.bottom
width: mainLayout.width + _widthMargin
color: QGroundControl.globalPalette.widgetTransparentColor
radius: ScreenTools.defaultFontPixelHeight / 2
visible: width > _widthMargin

property var _activeVehicle: QGroundControl.multiVehicleManager.activeVehicle
property real _toolIndicatorMargins: ScreenTools.defaultFontPixelHeight * 0.66
Expand Down
8 changes: 4 additions & 4 deletions src/QmlControls/GPSIndicator.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ Item {
id: gpsLabel
rotation: 90
text: qsTr("RTK")
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
anchors.verticalCenter: parent.verticalCenter
visible: _rtkConnected
}
Expand All @@ -55,7 +55,7 @@ Item {
fillMode: Image.PreserveAspectFit
sourceSize.height: height
opacity: (_activeVehicle && _activeVehicle.gps.count.value >= 0) ? 1 : 0.5
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
}
}

Expand All @@ -67,13 +67,13 @@ Item {

QGCLabel {
anchors.horizontalCenter: hdopValue.horizontalCenter
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
text: _activeVehicle ? _activeVehicle.gps.count.valueString : ""
}

QGCLabel {
id: hdopValue
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
text: _activeVehicle ? _activeVehicle.gps.hdop.value.toFixed(1) : ""
}
}
Expand Down
8 changes: 5 additions & 3 deletions src/QmlControls/MainStatusIndicator.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ RowLayout {
property bool _allowForceArm: false
property bool _healthAndArmingChecksSupported: _activeVehicle ? _activeVehicle.healthAndArmingCheckReport.supported : false
property bool _vehicleFlies: _activeVehicle ? _activeVehicle.airShip || _activeVehicle.fixedWing || _activeVehicle.vtol || _activeVehicle.multiRotor : false
property var _vehicleInAir: _activeVehicle ? _activeVehicle.flying || _activeVehicle.landing : false
property bool _vtolInFWDFlight: _activeVehicle ? _activeVehicle.vtolInFwdFlight : false

function dropMainStatusIndicator() {
let overallStatusComponent = _activeVehicle ? overallStatusIndicatorPage : overallStatusOfflineIndicatorPage
Expand All @@ -38,7 +40,7 @@ RowLayout {
Layout.preferredWidth: contentWidth + (vehicleMessagesIcon.visible ? vehicleMessagesIcon.width + control.spacing : 0)
verticalAlignment: Text.AlignVCenter
text: mainStatusText()
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
font.pointSize: ScreenTools.largeFontPointSize

property string _commLostText: qsTr("Comms Lost")
Expand Down Expand Up @@ -127,7 +129,7 @@ RowLayout {
visible: _activeVehicle && _activeVehicle.messageCount > 0

function getIconColor() {
let iconColor = qgcPal.text
let iconColor = qgcPal.windowTransparentText
if (_activeVehicle) {
if (_activeVehicle.messageTypeWarning) {
iconColor = qgcPal.colorOrange
Expand All @@ -150,7 +152,7 @@ RowLayout {
Layout.fillHeight: true
verticalAlignment: Text.AlignVCenter
text: _vtolInFWDFlight ? qsTr("FW(vtol)") : qsTr("MR(vtol)")
color: qgcPal.toolbarText
color: qgcPal.windowTransparentText
font.pointSize: _vehicleInAir ? ScreenTools.largeFontPointSize : ScreenTools.defaultFontPointSize
visible: _activeVehicle && _activeVehicle.vtol

Expand Down
4 changes: 2 additions & 2 deletions src/QmlControls/QGCPalette.cc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,10 +49,12 @@ void QGCPalette::_buildMap()
// Light Dark
// Disabled Enabled Disabled Enabled
DECLARE_QGC_COLOR(window, "#ffffff", "#ffffff", "#222222", "#222222")
DECLARE_QGC_COLOR(windowTransparent, "#ccffffff", "#ccffffff", "#cc222222", "#cc222222")
DECLARE_QGC_COLOR(windowShadeLight, "#909090", "#828282", "#707070", "#626262")
DECLARE_QGC_COLOR(windowShade, "#d9d9d9", "#d9d9d9", "#333333", "#333333")
DECLARE_QGC_COLOR(windowShadeDark, "#bdbdbd", "#bdbdbd", "#282828", "#282828")
DECLARE_QGC_COLOR(text, "#9d9d9d", "#000000", "#707070", "#ffffff")
DECLARE_QGC_COLOR(windowTransparentText,"#9d9d9d", "#000000", "#707070", "#ffffff")
DECLARE_QGC_COLOR(warningText, "#cc0808", "#cc0808", "#f85761", "#f85761")
DECLARE_QGC_COLOR(button, "#ffffff", "#ffffff", "#707070", "#626270")
DECLARE_QGC_COLOR(buttonBorder, "#ffffff", "#d9d9d9", "#707070", "#adadb8")
Expand Down Expand Up @@ -84,7 +86,6 @@ void QGCPalette::_buildMap()
DECLARE_QGC_COLOR(statusPendingText, "#9d9d9d", "#000000", "#707070", "#ffffff")
DECLARE_QGC_COLOR(toolbarBackground, "#00ffffff", "#00ffffff", "#00222222", "#00222222")
DECLARE_QGC_COLOR(toolbarDivider, "#00000000", "#00000000", "#00000000", "#00000000")
DECLARE_QGC_COLOR(toolbarText, "#707070", "#ffffff", "#707070", "#ffffff")
DECLARE_QGC_COLOR(groupBorder, "#bbbbbb", "#bbbbbb", "#707070", "#707070")

// Colors not affecting by theming
Expand All @@ -99,7 +100,6 @@ void QGCPalette::_buildMap()
DECLARE_QGC_SINGLE_COLOR(mapMissionTrajectory, "#be781c")
DECLARE_QGC_SINGLE_COLOR(surveyPolygonInterior, "green")
DECLARE_QGC_SINGLE_COLOR(surveyPolygonTerrainCollision, "red")
DECLARE_QGC_SINGLE_COLOR(widgetTransparentColor, "#7F000000")

// Colors for UTM Adapter
#ifdef QGC_UTM_ADAPTER
Expand Down
4 changes: 2 additions & 2 deletions src/QmlControls/QGCPalette.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -114,10 +114,12 @@ class QGCPalette : public QObject
Q_PROPERTY(QStringList colors READ colors CONSTANT)

DEFINE_QGC_COLOR(window, setWindow)
DEFINE_QGC_COLOR(windowTransparent, setWindowTransparent)
DEFINE_QGC_COLOR(windowShadeLight, setWindowShadeLight)
DEFINE_QGC_COLOR(windowShade, setWindowShade)
DEFINE_QGC_COLOR(windowShadeDark, setWindowShadeDark)
DEFINE_QGC_COLOR(text, setText)
DEFINE_QGC_COLOR(windowTransparentText, setWindowTransparentText)
DEFINE_QGC_COLOR(warningText, setWarningText)
DEFINE_QGC_COLOR(button, setButton)
DEFINE_QGC_COLOR(buttonBorder, setButtonBorder)
Expand Down Expand Up @@ -155,11 +157,9 @@ class QGCPalette : public QObject
DEFINE_QGC_COLOR(surveyPolygonTerrainCollision, setSurveyPolygonTerrainCollision)
DEFINE_QGC_COLOR(toolbarBackground, setToolbarBackground)
DEFINE_QGC_COLOR(toolbarDivider, setToolbarDivider)
DEFINE_QGC_COLOR(toolbarText, setToolbarText)
DEFINE_QGC_COLOR(toolStripFGColor, setToolStripFGColor)
DEFINE_QGC_COLOR(toolStripHoverColor, setToolStripHoverColor)
DEFINE_QGC_COLOR(groupBorder, setGroupBorder)
DEFINE_QGC_COLOR(widgetTransparentColor, setWidgetTransparentColor)

#ifdef QGC_UTM_ADAPTER
DEFINE_QGC_COLOR(switchUTMSP, setSwitchUTMSP)
Expand Down
Loading
Loading