From bc69d1212b70de74c652f4a0a1828575775d0411 Mon Sep 17 00:00:00 2001 From: Don Gagne Date: Mon, 28 Mar 2016 15:41:46 -0700 Subject: [PATCH] Much better Outdoor palette visuals --- .../APM/APMSensorsComponent.qml | 2 - .../Common/RadioComponent.qml | 5 - src/AutoPilotPlugins/PX4/PowerComponent.qml | 2 +- src/AutoPilotPlugins/PX4/SensorsComponent.qml | 1 - src/FlightDisplay/FlightDisplayView.qml | 15 +- src/MissionEditor/MissionEditor.qml | 19 +- src/MissionEditor/SimpleItemEditor.qml | 15 +- src/QGCPalette.cc | 4 +- src/QmlControls/IndicatorButton.qml | 2 - src/QmlControls/QGCButton.qml | 25 ++- src/QmlControls/QGCComboBox.qml | 20 +- src/QmlControls/QGCToolBarButton.qml | 34 +-- src/VehicleSetup/SetupView.qml | 194 +++++++++--------- src/ui/MainWindowInner.qml | 21 +- src/ui/toolbar/MainToolBar.qml | 32 ++- src/ui/toolbar/MainToolBarIndicators.qml | 9 - 16 files changed, 194 insertions(+), 206 deletions(-) diff --git a/src/AutoPilotPlugins/APM/APMSensorsComponent.qml b/src/AutoPilotPlugins/APM/APMSensorsComponent.qml index 2723d135d..ddc545500 100644 --- a/src/AutoPilotPlugins/APM/APMSensorsComponent.qml +++ b/src/AutoPilotPlugins/APM/APMSensorsComponent.qml @@ -403,7 +403,6 @@ QGCView { QGCButton { id: nextButton - showBorder: true text: "Next" enabled: false onClicked: controller.nextClicked() @@ -411,7 +410,6 @@ QGCView { QGCButton { id: cancelButton - showBorder: true text: "Cancel" enabled: false onClicked: controller.cancelCalibration() diff --git a/src/AutoPilotPlugins/Common/RadioComponent.qml b/src/AutoPilotPlugins/Common/RadioComponent.qml index 3bfc1427b..402f41a01 100644 --- a/src/AutoPilotPlugins/Common/RadioComponent.qml +++ b/src/AutoPilotPlugins/Common/RadioComponent.qml @@ -396,7 +396,6 @@ QGCView { QGCButton { id: skipButton - showBorder: true text: "Skip" onClicked: controller.skipButtonClicked() @@ -404,7 +403,6 @@ QGCView { QGCButton { id: cancelButton - showBorder: true text: "Cancel" onClicked: controller.cancelButtonClicked() @@ -413,7 +411,6 @@ QGCView { QGCButton { id: nextButton primary: true - showBorder: true text: "Calibrate" onClicked: { @@ -457,7 +454,6 @@ QGCView { QGCButton { id: bindButton - showBorder: true text: "Spektrum Bind" onClicked: showDialog(spektrumBindDialogComponent, dialogTitle, qgcView.showDialogDefaultWidth, StandardButton.Ok | StandardButton.Cancel) @@ -465,7 +461,6 @@ QGCView { } QGCButton { - showBorder: true text: "Copy Trims" visible: QGroundControl.multiVehicleManager.activeVehicle.px4Firmware onClicked: showDialog(copyTrimsDialogComponent, dialogTitle, qgcView.showDialogDefaultWidth, StandardButton.Ok | StandardButton.Cancel) diff --git a/src/AutoPilotPlugins/PX4/PowerComponent.qml b/src/AutoPilotPlugins/PX4/PowerComponent.qml index d417930e0..68756e3b4 100644 --- a/src/AutoPilotPlugins/PX4/PowerComponent.qml +++ b/src/AutoPilotPlugins/PX4/PowerComponent.qml @@ -202,7 +202,7 @@ QGCView { height: voltageCol.height fillMode: Image.PreserveAspectFit smooth: true - color: palette.button + color: palette.text cache: false source: getBatteryImage(); } diff --git a/src/AutoPilotPlugins/PX4/SensorsComponent.qml b/src/AutoPilotPlugins/PX4/SensorsComponent.qml index a6d38f25a..d66d46c2e 100644 --- a/src/AutoPilotPlugins/PX4/SensorsComponent.qml +++ b/src/AutoPilotPlugins/PX4/SensorsComponent.qml @@ -355,7 +355,6 @@ QGCView { QGCButton { id: cancelButton - showBorder: true text: "Cancel" enabled: false onClicked: controller.cancelCalibration() diff --git a/src/FlightDisplay/FlightDisplayView.qml b/src/FlightDisplay/FlightDisplayView.qml index 33fab6f09..d07e94a12 100644 --- a/src/FlightDisplay/FlightDisplayView.qml +++ b/src/FlightDisplay/FlightDisplayView.qml @@ -42,11 +42,9 @@ import QGroundControl.FactSystem 1.0 QGCView { id: root viewPanel: _panel - topDialogMargin: height - availableHeight QGCPalette { id: qgcPal; colorGroupEnabled: enabled } - property real availableHeight: parent.height property var _activeVehicle: QGroundControl.multiVehicleManager.activeVehicle @@ -225,14 +223,11 @@ QGCView { //-- Widgets Loader { - id: widgetsLoader - z: _panel.z + 4 - anchors.right: parent.right - anchors.left: parent.left - anchors.bottom: parent.bottom - height: availableHeight - asynchronous: true - visible: status == Loader.Ready + id: widgetsLoader + z: _panel.z + 4 + anchors.fill: parent + asynchronous: true + visible: status == Loader.Ready property bool isBackgroundDark: root.isBackgroundDark property var qgcView: root diff --git a/src/MissionEditor/MissionEditor.qml b/src/MissionEditor/MissionEditor.qml index 3bb0203e3..dbd2f7142 100644 --- a/src/MissionEditor/MissionEditor.qml +++ b/src/MissionEditor/MissionEditor.qml @@ -43,7 +43,6 @@ QGCView { property bool syncNeeded: controller.visualItems.dirty // Unsaved changes, visible to parent container viewPanel: panel - topDialogMargin: height - mainWindow.availableHeight // zOrder comes from the Loader in MainWindow.qml z: QGroundControl.zOrderTopMost @@ -458,7 +457,7 @@ QGCView { // Mission Item Editor Item { id: missionItemEditor - height: mainWindow.availableHeight + anchors.top: parent.top anchors.bottom: parent.bottom anchors.right: parent.right width: _rightPanelWidth @@ -510,19 +509,13 @@ QGCView { } } - Item { - id: toolbarSpacer - height: mainWindow.tbHeight - width: 1 - } - //-- Vertical Tool Buttons Column { - id: toolColumn - anchors.margins: ScreenTools.defaultFontPixelHeight - anchors.left: parent.left - anchors.top: toolbarSpacer.bottom - spacing: ScreenTools.defaultFontPixelHeight + id: toolColumn + anchors.margins: ScreenTools.defaultFontPixelHeight + anchors.left: parent.left + anchors.top: parent.top + spacing: ScreenTools.defaultFontPixelHeight RoundButton { id: addMissionItemsButton diff --git a/src/MissionEditor/SimpleItemEditor.qml b/src/MissionEditor/SimpleItemEditor.qml index 35a2049ae..25d7d68c2 100644 --- a/src/MissionEditor/SimpleItemEditor.qml +++ b/src/MissionEditor/SimpleItemEditor.qml @@ -38,13 +38,14 @@ Rectangle { spacing: _margin QGCLabel { - width: parent.width - wrapMode: Text.WordWrap - text: missionItem.sequenceNumber == 0 ? - "Planned home position." : - (missionItem.rawEdit ? - "Provides advanced access to all commands/parameters. Be very careful!" : - missionItem.commandDescription) + width: parent.width + wrapMode: Text.WordWrap + font.pixelSize: ScreenTools.smallFontPixelHeight + text: missionItem.sequenceNumber == 0 ? + "Planned home position." : + (missionItem.rawEdit ? + "Provides advanced access to all commands/parameters. Be very careful!" : + missionItem.commandDescription) } Repeater { diff --git a/src/QGCPalette.cc b/src/QGCPalette.cc index 4b475c2e0..6372e8183 100644 --- a/src/QGCPalette.cc +++ b/src/QGCPalette.cc @@ -34,7 +34,7 @@ QList QGCPalette::_paletteObjects; QGCPalette::Theme QGCPalette::_theme = QGCPalette::Dark; QColor QGCPalette::_window[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = { - { QColor("#f9f8f4"), QColor("#f9f8f4") }, + { QColor("#ffffff"), QColor("#ffffff") }, { QColor(0x22, 0x22, 0x22), QColor(0x22, 0x22, 0x22) } }; @@ -59,7 +59,7 @@ QColor QGCPalette::_warningText[QGCPalette::_cThemes][QGCPalette::_cColorGroups] }; QColor QGCPalette::_button[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = { - { QColor("#ffffff"), QColor("#91d1e4") }, + { QColor("#ffffff"), QColor("#ffffff") }, { QColor(0x58, 0x58, 0x58), QColor(98, 98, 100) }, }; diff --git a/src/QmlControls/IndicatorButton.qml b/src/QmlControls/IndicatorButton.qml index 8706e56b0..40d8a2ce4 100644 --- a/src/QmlControls/IndicatorButton.qml +++ b/src/QmlControls/IndicatorButton.qml @@ -9,8 +9,6 @@ import QGroundControl.ScreenTools 1.0 // indicator on the right edge. QGCButton { - showBorder: true - property bool indicatorGreen: false Rectangle { diff --git a/src/QmlControls/QGCButton.qml b/src/QmlControls/QGCButton.qml index df1aff5f3..60c678a29 100644 --- a/src/QmlControls/QGCButton.qml +++ b/src/QmlControls/QGCButton.qml @@ -8,12 +8,11 @@ import QGroundControl.ScreenTools 1.0 Button { - property bool primary: false // primary: true - primary button for a group of buttons - property bool showBorder: false ///< true: draw border around button + property bool primary: false ///< primary button for a group of buttons - property var __qgcPal: QGCPalette { colorGroupEnabled: enabled } - - property bool __showHighlight: (pressed | hovered | checked) && !__forceHoverOff + property var _qgcPal: QGCPalette { colorGroupEnabled: enabled } + property bool _showHighlight: (pressed | hovered | checked) && !__forceHoverOff + property bool _showBorder: _qgcPal.globalTheme == QGCPalette.Light // This fixes the issue with button hover where if a Button is near the edge oa QQuickWidget you can // move the mouse fast enough such that the MouseArea does not trigger an onExited. This is turn @@ -69,11 +68,11 @@ Button { Rectangle { anchors.fill: parent - border.width: showBorder ? 1: 0 - border.color: __qgcPal.buttonText - color: __showHighlight ? - control.__qgcPal.buttonHighlight : - (primary ? control.__qgcPal.primaryButton : control.__qgcPal.button) + border.width: _showBorder ? 1: 0 + border.color: _qgcPal.buttonText + color: _showHighlight ? + control._qgcPal.buttonHighlight : + (primary ? control._qgcPal.primaryButton : control._qgcPal.button) } Image { @@ -111,9 +110,9 @@ Button { anchors.verticalCenter: parent.verticalCenter - color: __showHighlight ? - control.__qgcPal.buttonHighlightText : - (primary ? control.__qgcPal.primaryButtonText : control.__qgcPal.buttonText) + color: _showHighlight ? + control._qgcPal.buttonHighlightText : + (primary ? control._qgcPal.primaryButtonText : control._qgcPal.buttonText) } } } diff --git a/src/QmlControls/QGCComboBox.qml b/src/QmlControls/QGCComboBox.qml index f393b8e4f..8107b7c16 100644 --- a/src/QmlControls/QGCComboBox.qml +++ b/src/QmlControls/QGCComboBox.qml @@ -7,29 +7,29 @@ import QGroundControl.Palette 1.0 import QGroundControl.ScreenTools 1.0 ComboBox { - property var __qgcPal: QGCPalette { colorGroupEnabled: enabled } - property bool __showHighlight: pressed | hovered + property var _qgcPal: QGCPalette { colorGroupEnabled: enabled } + property bool _showHighlight: pressed | hovered + property bool _showBorder: _qgcPal.globalTheme == QGCPalette.Light style: ComboBoxStyle { font.pixelSize: ScreenTools.defaultFontPixelSize - textColor: __showHighlight ? - control.__qgcPal.buttonHighlightText : - control.__qgcPal.buttonText + textColor: _showHighlight ? + control._qgcPal.buttonHighlightText : + control._qgcPal.buttonText background: Item { implicitWidth: Math.round(TextSingleton.implicitHeight * 4.5) implicitHeight: ScreenTools.isMobile ? ScreenTools.defaultFontPixelHeight * 3 * 0.75 : Math.max(25, Math.round(TextSingleton.implicitHeight * 1.2)) Rectangle { - anchors.fill: parent - color: __showHighlight ? - control.__qgcPal.buttonHighlight : - control.__qgcPal.button + anchors.fill: parent + color: _showHighlight ? control._qgcPal.buttonHighlight : control._qgcPal.button + border.width: _showBorder ? 1: 0 + border.color: control._qgcPal.buttonText } Image { id: imageItem - visible: control.menu !== null source: "/qmlimages/arrow-down.png" anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right diff --git a/src/QmlControls/QGCToolBarButton.qml b/src/QmlControls/QGCToolBarButton.qml index 6e77ffa06..b40c491e2 100644 --- a/src/QmlControls/QGCToolBarButton.qml +++ b/src/QmlControls/QGCToolBarButton.qml @@ -24,8 +24,9 @@ This file is part of the QGROUNDCONTROL project import QtQuick 2.4 import QtQuick.Controls 1.2 -import QGroundControl.Controls 1.0 -import QGroundControl.Palette 1.0 +import QGroundControl.Controls 1.0 +import QGroundControl.Palette 1.0 +import QGroundControl.ScreenTools 1.0 Item { id: _root @@ -34,6 +35,8 @@ Item { property bool checked: false property ExclusiveGroup exclusiveGroup: null + readonly property real _topBottomMargins: ScreenTools.defaultFontPixelHeight / 2 + signal clicked() QGCPalette { id: qgcPal } @@ -44,22 +47,27 @@ Item { } } + QGCColoredImage { + id: icon + anchors.left: parent.left + anchors.right: parent.right + anchors.topMargin: _topBottomMargins + anchors.bottomMargin: _topBottomMargins + anchors.top: parent.top + anchors.bottom: parent.bottom + fillMode: Image.PreserveAspectFit + color: checked ? qgcPal.buttonHighlight : qgcPal.buttonText + } + Rectangle { - anchors.fill: parent + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: _topBottomMargins / 3 color: qgcPal.buttonHighlight visible: checked } - QGCColoredImage { - id: icon - width: parent.height * 0.9 - height: parent.height * 0.9 - fillMode: Image.PreserveAspectFit - color: checked ? qgcPal.buttonHighlightText : qgcPal.buttonText - anchors.verticalCenter: parent.verticalCenter - anchors.horizontalCenter: parent.horizontalCenter - } - MouseArea { anchors.fill: parent onClicked: { diff --git a/src/VehicleSetup/SetupView.qml b/src/VehicleSetup/SetupView.qml index e39058755..6dfcfaa20 100644 --- a/src/VehicleSetup/SetupView.qml +++ b/src/VehicleSetup/SetupView.qml @@ -36,8 +36,8 @@ import QGroundControl.ScreenTools 1.0 import QGroundControl.MultiVehicleManager 1.0 Rectangle { - color: qgcPal.window - z: QGroundControl.zOrderTopMost + color: qgcPal.window + z: QGroundControl.zOrderTopMost QGCPalette { id: qgcPal; colorGroupEnabled: true } @@ -145,7 +145,7 @@ Rectangle { wrapMode: Text.WordWrap font.pixelSize: ScreenTools.mediumFontPixelSize text: "QGroundControl does not currently support setup of your vehicle type. " + - "If your vehicle is already configured you can still Fly." + "If your vehicle is already configured you can still Fly." onLinkActivated: Qt.openUrlExternally(link) } @@ -166,7 +166,7 @@ Rectangle { wrapMode: Text.WordWrap font.pixelSize: ScreenTools.largeFontPixelSize text: "Connect vehicle to your device and QGroundControl will automatically detect it." + - (ScreenTools.isMobile ? "" : " Click Firmware on the left to upgrade your vehicle.") + (ScreenTools.isMobile ? "" : " Click Firmware on the left to upgrade your vehicle.") onLinkActivated: Qt.openUrlExternally(link) } @@ -209,129 +209,119 @@ Rectangle { } } - Rectangle { - //-- Limit height to available height (below tool bar) - anchors.topMargin: _margin - height: mainWindow.availableHeight + QGCFlickable { + id: buttonScroll + width: buttonColumn.width + anchors.topMargin: _defaultTextHeight / 2 + anchors.top: parent.top anchors.bottom: parent.bottom - anchors.left: parent.left - anchors.right: parent.right - color: qgcPal.window + contentHeight: buttonColumn.height + flickableDirection: Flickable.VerticalFlick - QGCFlickable { - id: buttonScroll - width: buttonColumn.width - anchors.topMargin: _defaultTextHeight / 2 - anchors.top: parent.top - anchors.bottom: parent.bottom - contentHeight: buttonColumn.height - flickableDirection: Flickable.VerticalFlick + Column { + id: buttonColumn + width: _maxButtonWidth + spacing: _defaultTextHeight / 2 - Column { - id: buttonColumn - width: _maxButtonWidth - spacing: _defaultTextHeight / 2 + property real _maxButtonWidth: 0 - property real _maxButtonWidth: 0 + Component.onCompleted: reflowWidths() - Component.onCompleted: reflowWidths() + Connections { + target: componentRepeater - Connections { - target: componentRepeater - - onModelChanged: buttonColumn.reflowWidths() - } + onModelChanged: buttonColumn.reflowWidths() + } - function reflowWidths() { - for (var i=0; i