Merge pull request #1204 from DonLakeFlyer/QmlControls

Qml controls

qgroundcontrol.pro

@@ -208,8 +208,6 @@ ReleaseBuild {
     }
 }
 
-QML_IMPORT_PATH = $$BASEDIR/qml
-
 # qextserialport should not be used by general QGroundControl code. Use QSerialPort instead. This is only
 # here to support special case Firmware Upgrade code.
 include(libs/qextserialport/src/qextserialport.pri)
@@ -681,7 +679,8 @@ HEADERS += \
     src/qgcunittest/MavlinkLogTest.h \
     src/FactSystem/FactSystemTestBase.h \
     src/FactSystem/FactSystemTestPX4.h \
-    src/FactSystem/FactSystemTestGeneric.h
+    src/FactSystem/FactSystemTestGeneric.h \
+    src/QmlControls/QmlTestWidget.h \
 
 SOURCES += \
     src/qgcunittest/UnitTest.cc \
@@ -705,7 +704,9 @@ SOURCES += \
     src/qgcunittest/MavlinkLogTest.cc \
     src/FactSystem/FactSystemTestBase.cc \
     src/FactSystem/FactSystemTestPX4.cc \
-    src/FactSystem/FactSystemTestGeneric.cc
+    src/FactSystem/FactSystemTestGeneric.cc \
+    src/QmlControls/QmlTestWidget.cc \
+
 }
 
 #

qgroundcontrol.qrc

@@ -239,20 +239,26 @@
     <qresource prefix="/qml">
 
         <file alias="test.qml">src/test.qml</file>
+        <file alias="QmlTest.qml">src/QmlControls/QmlTest.qml</file>
 
-        <file alias="QGroundControl/FactControls/qmldir">qml/QGroundControl/FactControls/qmldir</file>
+        <file alias="QGroundControl/FactControls/qmldir">src/FactSystem/FactControls/qmldir</file>
-        <file alias="QGroundControl/FactControls/FactLabel.qml">qml/QGroundControl/FactControls/FactLabel.qml</file>
+        <file alias="QGroundControl/FactControls/FactLabel.qml">src/FactSystem/FactControls/FactLabel.qml</file>
-        <file alias="QGroundControl/FactControls/FactTextField.qml">qml/QGroundControl/FactControls/FactTextField.qml</file>
+        <file alias="QGroundControl/FactControls/FactTextField.qml">src/FactSystem/FactControls/FactTextField.qml</file>
-        <file alias="QGroundControl/FactControls/FactCheckBox.qml">qml/QGroundControl/FactControls/FactCheckBox.qml</file>
+        <file alias="QGroundControl/FactControls/FactCheckBox.qml">src/FactSystem/FactControls/FactCheckBox.qml</file>
 
-        <file alias="QGroundControl/Controls/qmldir">qml/QGroundControl/Controls/qmldir</file>
+        <file alias="QGroundControl/Controls/qmldir">src/QmlControls/qmldir</file>
-        <file alias="QGroundControl/Controls/SetupButton.qml">qml/QGroundControl/Controls/SetupButton.qml</file>
+        <file alias="QGroundControl/Controls/SetupButton.qml">src/QmlControls/SetupButton.qml</file>
+        <file alias="QGroundControl/Controls/QGCButton.qml">src/QmlControls/QGCButton.qml</file>
+        <file alias="QGroundControl/Controls/QGCRadioButton.qml">src/QmlControls/QGCRadioButton.qml</file>
+        <file alias="QGroundControl/Controls/QGCCheckBox.qml">src/QmlControls/QGCCheckBox.qml</file>
+        <file alias="QGroundControl/Controls/QGCLabel.qml">src/QmlControls/QGCLabel.qml</file>
 
         <file alias="octo_x.png">files/images/px4/airframes/octo_x.png</file>
         <file alias="px4fmu_2.x.png">files/images/px4/boards/px4fmu_2.x.png</file>
 
         <file alias="SetupViewButtons.qml">src/VehicleSetup/SetupViewButtons.qml</file>
         <file alias="VehicleSummary.qml">src/VehicleSetup/VehicleSummary.qml</file>
+        <file alias="FirmwareUpgrade.qml">src/VehicleSetup/FirmwareUpgrade.qml</file>
 
         <file alias="SafetyComponent.qml">src/AutoPilotPlugins/PX4/SafetyComponent.qml</file>
 

qml/QGroundControl/Controls/qmldir

@@ -1,2 +0,0 @@
-Module QGroundControl.Controls
-SetupButton 1.0 SetupButton.qml

src/AutoPilotPlugins/PX4/SafetyComponent.qml

@@ -1,8 +1,10 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactSystem 1.0
 import QGroundControl.FactControls 1.0
+import QGroundControl.Palette 1.0
 
 Rectangle {
     QGCPalette { id: palette; colorGroup: QGCPalette.Active }

src/FactSystem/FactControls/FactCheckBox.qml

@@ -1,7 +1,9 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactSystem 1.0
+import QGroundControl.Palette 1.0
 
 CheckBox {
     property Fact fact: Fact { value: 0 }

src/FactSystem/FactControls/FactLabel.qml

@@ -1,7 +1,9 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactSystem 1.0
+import QGroundControl.Palette 1.0
 
 Label {
     property Fact fact: Fact { value: "FactLabel" }

src/FactSystem/FactControls/FactTextField.qml

@@ -1,7 +1,9 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactSystem 1.0
+import QGroundControl.Palette 1.0
 
 TextField {
     property Fact fact: Fact { value: 0 }

src/FactSystem/FactSystem.cc

@@ -28,7 +28,6 @@
 #include "UASManager.h"
 #include "QGCApplication.h"
 #include "VehicleComponent.h"
-#include "QGCPalette.h"
 
 #include <QtQml>
 
@@ -44,7 +43,6 @@ FactSystem::FactSystem(QObject* parent) :
     
     // FIXME: Where should these go?
     qmlRegisterUncreatableType<VehicleComponent>(_factSystemQmlUri, 1, 0, "VehicleComponent", "Can only reference VehicleComponent");
-    qmlRegisterType<QGCPalette>(_factSystemQmlUri, 1, 0, "QGCPalette");
 }
 
 FactSystem::~FactSystem()

src/QGCApplication.cc

@@ -247,6 +247,9 @@ void QGCApplication::_initCommon(void)
     // Avoid Using setFont(). In the Qt docu you can read the following:
     //     "Warning: Do not use this function in conjunction with Qt Style Sheets."
     // setFont(fontDatabase.font(fontFamilyName, "Roman", 12));
+    
+    // Register our Qml palette before anyone tries to use it
+    qmlRegisterType<QGCPalette>("QGroundControl.Palette", 1, 0, "QGCPalette");
 }
 
 bool QGCApplication::_initForNormalAppBoot(void)

src/QGCPalette.cc

@@ -49,13 +49,13 @@ QColor QGCPalette::_button[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
 };
 
 QColor QGCPalette::_buttonText[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
-    { QColor(0, 0, 0), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) },
+    { QColor(0x2c, 0x2c, 0x2c), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) },
-    { QColor(0, 0, 0), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) },
+    { QColor(0x2c, 0x2c, 0x2c), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) },
 };
 
 QColor QGCPalette::_text[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
-    { QColor(0, 0, 0), QColor(0, 0, 0), QColor(0, 0, 0) },
+    { QColor(0x58, 0x58, 0x58), QColor(0, 0, 0), QColor(0, 0, 0) },
-    { QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) }
+    { QColor(0x58, 0x58, 0x58), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) }
 };
 
 QColor QGCPalette::_window[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
@@ -64,8 +64,13 @@ QColor QGCPalette::_window[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
 };
 
 QColor QGCPalette::_windowText[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
-    { QColor(0, 0, 0), QColor(0, 0, 0), QColor(0, 0, 0) },
+    { QColor(0x58, 0x58, 0x58), QColor(0, 0, 0), QColor(0, 0, 0) },
-    { QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) }
+    { QColor(0x58, 0x58, 0x58), QColor(0xFF, 0xFF, 0xFF), QColor(0xFF, 0xFF, 0xFF) }
+};
+
+QColor QGCPalette::_buttonHighlight[QGCPalette::_cThemes][QGCPalette::_cColorGroups] = {
+    { QColor(0x58, 0x58, 0x58), QColor(0xee, 0xe3, 0x33), QColor(0xee, 0xe3, 0x33) },
+    { QColor(0x58, 0x58, 0x58), QColor(0xee, 0xe3, 0x33), QColor(0xee, 0xe3, 0x33) },
 };
 
 QGCPalette::QGCPalette(QObject* parent) :

src/QGCPalette.h

@@ -51,6 +51,9 @@ class QGCPalette : public QObject
     Q_PROPERTY(QColor window READ window NOTIFY paletteChanged)
     Q_PROPERTY(QColor windowText READ windowText NOTIFY paletteChanged)
     
+    /// The buttonHighlight color identifies the button background color when hovered or selected.
+    Q_PROPERTY(QColor buttonHighlight READ buttonHighlight NOTIFY paletteChanged)
+
 public:
     enum ColorGroup {
         Disabled = 0,
@@ -76,6 +79,7 @@ public:
     QColor text(void) const { return _text[_theme][_colorGroup]; }
     QColor window(void) const { return _window[_theme][_colorGroup]; }
     QColor windowText(void) const { return _windowText[_theme][_colorGroup]; }
+    QColor buttonHighlight(void) const { return _buttonHighlight[_theme][_colorGroup]; }
     
     static Theme globalTheme(void) { return _theme; }
     static void setGlobalTheme(Theme newTheme);
@@ -97,6 +101,7 @@ private:
     static QColor _text[_cThemes][_cColorGroups];
     static QColor _window[_cThemes][_cColorGroups];
     static QColor _windowText[_cThemes][_cColorGroups];
+    static QColor _buttonHighlight[_cThemes][_cColorGroups];
     
     void _themeChanged(void);
     

src/QmlControls/QGCButton.qml

@@ -0,0 +1,28 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Palette 1.0
+
+Button {
+    property var __qgcPal: QGCPalette { colorGroup: enabled ? QGCPalette.Active : QGCPalette.Disabled }
+
+    style: ButtonStyle {
+            background: Rectangle {
+                implicitWidth: 100
+                implicitHeight: 25
+                color: control.hovered ? control.__qgcPal.buttonHighlight : control.__qgcPal.button
+            }
+
+            label: Text {
+                width: parent.width
+                height: parent.height
+
+                verticalAlignment: TextEdit.AlignVCenter
+                horizontalAlignment: TextEdit.AlignHCenter
+
+                text: control.text
+                color: control.__qgcPal.buttonText
+            }
+        }
+}

src/QmlControls/QGCCheckBox.qml

@@ -0,0 +1,35 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Palette 1.0
+
+CheckBox {
+    property var __qgcPal: QGCPalette { colorGroup: enabled ? QGCPalette.Active : QGCPalette.Disabled }
+
+    style: CheckBoxStyle {
+        label: Item {
+            implicitWidth: text.implicitWidth + 2
+            implicitHeight: text.implicitHeight
+            baselineOffset: text.baselineOffset
+            Rectangle {
+                anchors.fill: text
+                anchors.margins: -1
+                anchors.leftMargin: -3
+                anchors.rightMargin: -3
+                visible: control.activeFocus
+                height: 6
+                radius: 3
+                color: "#224f9fef"
+                border.color: "#47b"
+                opacity: 0.6
+            }
+            Text {
+                id: text
+                text: control.text
+                anchors.centerIn: parent
+                color: control.__qgcPal.windowText
+            }
+        }
+    }
+}

src/QmlControls/QGCLabel.qml

@@ -0,0 +1,12 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Palette 1.0
+
+Text {
+    property var __palette: QGCPalette { colorGroup: enabled ? QGCPalette.Active : QGCPalette.Disabled }
+    property bool enabled: true
+
+    color: __palette.windowText
+}

src/QmlControls/QGCRadioButton.qml

@@ -0,0 +1,35 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Palette 1.0
+
+RadioButton {
+    property var __qgcPal: QGCPalette { colorGroup: enabled ? QGCPalette.Active : QGCPalette.Disabled }
+
+    style: RadioButtonStyle {
+        label: Item {
+            implicitWidth: text.implicitWidth + 2
+            implicitHeight: text.implicitHeight
+            baselineOffset: text.y + text.baselineOffset
+            Rectangle {
+                anchors.fill: text
+                anchors.margins: -1
+                anchors.leftMargin: -3
+                anchors.rightMargin: -3
+                visible: control.activeFocus
+                height: 6
+                radius: 3
+                color: "#224f9fef"
+                border.color: "#47b"
+                opacity: 0.6
+            }
+            Text {
+                id: text
+                text: control.text
+                anchors.centerIn: parent
+                color: control.__qgcPal.windowText
+            }
+        }
+    }
+}

src/QmlControls/QmlTest.qml

@@ -0,0 +1,344 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Palette 1.0
+import QGroundControl.Controls 1.0
+
+Rectangle {
+
+    property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+    color: palette.window
+
+    Column {
+        spacing: 10
+
+        Grid {
+            columns: 4
+            spacing: 5
+
+            Component {
+                id: colorSquare
+
+                Rectangle {
+                    width: 80
+                    height: 20
+                    border.width: 1
+                    border.color: "white"
+                    color: parent.color
+                }
+            }
+
+            Component {
+                id: rowHeader
+
+                Text {
+                    width: 120
+                    height: 20
+                    horizontalAlignment: Text.AlignRight
+                    verticalAlignment: Text.AlignVCenter
+                    color: palette.windowText
+                    text: parent.text
+                }
+            }
+
+
+            // Header row
+            Loader {
+                sourceComponent: rowHeader
+                property var text: ""
+            }
+            Text {
+                width: 80
+                height: 20
+                color: palette.windowText
+                horizontalAlignment: Text.AlignHCenter
+                text: "Disabled"
+            }
+            Text {
+                width: 80
+                height: 20
+                color: palette.windowText
+                horizontalAlignment: Text.AlignHCenter
+                text: "Active"
+            }
+            Text {
+                width: 80
+                height: 20
+                color: palette.windowText
+                horizontalAlignment: Text.AlignHCenter
+                text: "Inactive"
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "alternateBase"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.alternateBase
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.alternateBase
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.alternateBase
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "base"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.base
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.base
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.base
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "button"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.button
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.button
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.button
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "buttonHighlight"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.buttonHighlight
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.buttonHighlight
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.buttonHighlight
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "buttonText"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.buttonText
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.buttonText
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.buttonText
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "text"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.text
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.text
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.text
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "window"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.window
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.window
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.window
+                sourceComponent: colorSquare
+            }
+
+            Loader {
+                sourceComponent: rowHeader
+                property var text: "windowText"
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Disabled }
+                property var color: palette.windowText
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Active }
+                property var color: palette.windowText
+                sourceComponent: colorSquare
+            }
+            Loader {
+                property var palette: QGCPalette { colorGroup: QGCPalette.Inactive }
+                property var color: palette.windowText
+                sourceComponent: colorSquare
+            }
+
+        }
+
+        Item {
+            width: parent.width
+            height: 30
+        }
+
+        Grid {
+            columns: 3
+            spacing: 5
+
+            Component {
+                id: ctlRowHeader
+
+                Text {
+                    width: 120
+                    height: 20
+                    horizontalAlignment: Text.AlignRight
+                    verticalAlignment: Text.AlignVCenter
+                    color: palette.windowText
+                    text: parent.text
+                }
+            }
+
+
+            // Header row
+            Loader {
+                sourceComponent: ctlRowHeader
+                property var text: ""
+            }
+            Text {
+                width: 100
+                height: 20
+                color: palette.windowText
+                horizontalAlignment: Text.AlignHCenter
+                text: "Enabled"
+            }
+            Text {
+                width: 100
+                height: 20
+                color: palette.windowText
+                horizontalAlignment: Text.AlignHCenter
+                text: "Disabled"
+            }
+
+            Loader {
+                sourceComponent: ctlRowHeader
+                property var text: "QGCLabel"
+            }
+            QGCLabel {
+                width: 100
+                height: 20
+                text: "Label"
+            }
+            QGCLabel {
+                width: 100
+                height: 20
+                text: "Label"
+                enabled: false
+            }
+
+            Loader {
+                sourceComponent: ctlRowHeader
+                property var text: "QGCButton"
+            }
+            QGCButton {
+                width: 100
+                height: 20
+                text: "Button"
+            }
+            QGCButton {
+                width: 100
+                height: 20
+                text: "Button"
+                enabled: false
+            }
+
+            Loader {
+                sourceComponent: ctlRowHeader
+                property var text: "QGCRadioButton"
+            }
+            QGCRadioButton {
+                width: 100
+                height: 20
+                text: "Radio"
+            }
+            QGCRadioButton {
+                width: 100
+                height: 20
+                text: "Radio"
+                enabled: false
+            }
+
+            Loader {
+                sourceComponent: ctlRowHeader
+                property var text: "QGCCheckBox"
+            }
+            QGCCheckBox {
+                width: 100
+                height: 20
+                text: "Check Box"
+            }
+            QGCCheckBox {
+                width: 100
+                height: 20
+                text: "Check Box"
+                enabled: false
+            }
+
+        }
+    }
+}

src/QmlControls/QmlTestWidget.cc

@@ -0,0 +1,35 @@
+/*=====================================================================
+ 
+ QGroundControl Open Source Ground Control Station
+ 
+ (c) 2009 - 2014 QGROUNDCONTROL PROJECT <http://www.qgroundcontrol.org>
+ 
+ This file is part of the QGROUNDCONTROL project
+ 
+ QGROUNDCONTROL is free software: you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+ 
+ QGROUNDCONTROL is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU General Public License for more details.
+ 
+ You should have received a copy of the GNU General Public License
+ along with QGROUNDCONTROL. If not, see <http://www.gnu.org/licenses/>.
+ 
+ ======================================================================*/
+
+/// @file
+///     @author Don Gagne <don@thegagnes.com>
+
+#include "QmlTestWidget.h"
+
+QmlTestWidget::QmlTestWidget(void)
+{
+    setAttribute(Qt::WA_DeleteOnClose);
+    resize(500, 500);
+    setVisible(true);
+    setSource(QUrl::fromUserInput("qrc:qml/QmlTest.qml"));
+}

src/QmlControls/QmlTestWidget.h

@@ -0,0 +1,42 @@
+/*=====================================================================
+ 
+ QGroundControl Open Source Ground Control Station
+ 
+ (c) 2009 - 2014 QGROUNDCONTROL PROJECT <http://www.qgroundcontrol.org>
+ 
+ This file is part of the QGROUNDCONTROL project
+ 
+ QGROUNDCONTROL is free software: you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+ 
+ QGROUNDCONTROL is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU General Public License for more details.
+ 
+ You should have received a copy of the GNU General Public License
+ along with QGROUNDCONTROL. If not, see <http://www.gnu.org/licenses/>.
+ 
+ ======================================================================*/
+
+#ifndef QmlTestWidget_h
+#define QmlTestWidget_h
+
+/// @file
+///     @author Don Gagne <don@thegagnes.com>
+
+#include "QGCQmlWidgetHolder.h"
+
+/// This is used to create widgets which are implemented in QML.
+
+class QmlTestWidget : public QGCQmlWidgetHolder
+{
+    Q_OBJECT
+
+public:
+    QmlTestWidget(void);
+};
+
+#endif

src/QmlControls/SetupButton.qml

@@ -2,7 +2,8 @@ import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import QtGraphicalEffects 1.0
-import QGroundControl.FactSystem 1.0
+
+import QGroundControl.Palette 1.0
 
 Button {
     checkable: true

src/QmlControls/qmldir

@@ -0,0 +1,6 @@
+Module QGroundControl.Controls
+SetupButton 1.0 SetupButton.qml
+QGCLabel 1.0 QGCLabel.qml
+QGCButton 1.0 QGCButton.qml
+QGCRadioButton 1.0 QGCRadioButton.qml
+QGCCheckBox 1.0 QGCCheckBox.qml

src/VehicleSetup/FirmwareUpgrade.qml

@@ -0,0 +1,37 @@
+import QtQuick 2.2
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+
+import QGroundControl.Controls 1.0
+import QGroundControl.FactControls 1.0
+import QGroundControl.Palette 1.0
+
+Rectangle {
+    width: 600
+    height: 400
+
+    property var qgcPal: QGCPalette { colorGroup: QGCPalette.Active }
+
+    color: qgcPal.window
+
+    Text {
+        text: "FIRMWARE UPDATE"
+        color: qgcPal.windowText
+        font.pointSize: 20
+    }
+
+    Column {
+        QGCRadioButton {
+            text: qsTr("Standard Version (stable)")
+        }
+        QGCRadioButton {
+            text: qsTr("Beta Testing (beta)")
+        }
+        QGCRadioButton {
+            text: qsTr("Developer Build (master)")
+        }
+        QGCRadioButton {
+            text: qsTr("Custom firmware file...")
+        }
+    }
+}

src/VehicleSetup/SetupView.cc

@@ -133,7 +133,16 @@ void SetupView::_firmwareButtonClicked(void)
         return;
     }
 
+#if 1
     PX4FirmwareUpgrade* setup = new PX4FirmwareUpgrade(this);
+#else
+    // NYI
+    QGCQmlWidgetHolder* setup = new QGCQmlWidgetHolder;
+    Q_CHECK_PTR(setup);
+    
+    //setup->setAutoPilot(_autoPilotPlugin);
+    setup->setSource(QUrl::fromUserInput("qrc:/qml/FirmwareUpgrade.qml"));
+#endif
     _changeSetupWidget(setup);
 }
 

src/VehicleSetup/SetupViewButtons.qml

@@ -2,6 +2,9 @@ import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import QGroundControl.FactSystem 1.0
+import QtGraphicalEffects 1.0
+
+import QGroundControl.Palette 1.0
 import QGroundControl.Controls 1.0
 
 Rectangle {

src/VehicleSetup/VehicleSummary.qml

@@ -1,7 +1,9 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactSystem 1.0
+import QGroundControl.Palette 1.0
 
 Rectangle {
     width: 600

src/test.qml

@@ -1,7 +1,9 @@
 import QtQuick 2.2
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
+
 import QGroundControl.FactControls 1.0
+import QGroundControl.Palette 1.0
 
 
 Rectangle {

src/ui/MainWindow.cc

@@ -71,6 +71,10 @@ This file is part of the QGROUNDCONTROL project
 #include "QGCMessageBox.h"
 #include "QGCDockWidget.h"
 
+#ifdef UNITTEST_BUILD
+#include "QmlControls/QmlTestWidget.h"
+#endif
+
 #ifdef QGC_OSG_ENABLED
 #include "Q3DWidgetFactory.h"
 #endif
@@ -187,6 +191,12 @@ MainWindow::MainWindow(QSplashScreen* splashScreen) :
     menuBar()->setNativeMenuBar(false);
 #endif
     
+#ifdef UNITTEST_BUILD
+    QAction* qmlTestAction = new QAction("Test QML palette and controls", NULL);
+    connect(qmlTestAction, &QAction::triggered, this, &MainWindow::_showQmlTestWidget);
+    ui.menuTools->addAction(qmlTestAction);
+#endif
+
     // Setup UI state machines
     centerStackActionGroup->setExclusive(true);
 
@@ -1519,3 +1529,11 @@ bool MainWindow::x11Event(XEvent *event)
     return false;
 }
 #endif // QGC_MOUSE_ENABLED_LINUX
+
+#ifdef UNITTEST_BUILD
+void MainWindow::_showQmlTestWidget(void)
+{
+    new QmlTestWidget();
+}
+#endif
+

src/ui/MainWindow.h

@@ -294,6 +294,9 @@ private slots:
     void _showDockWidgetAction(bool show);
     void _loadCustomWidgetFromFile(void);
     void _createNewCustomWidget(void);
+#ifdef UNITTEST_BUILD
+    void _showQmlTestWidget(void);
+#endif
     
 private:
     /// Constructor is private since all creation should be through MainWindow::_create