diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/CommunityPanel.qml b/ground/openpilotgcs/src/plugins/welcome/qml/CommunityPanel.qml
index 60cdfb1ed..245887b62 100644
--- a/ground/openpilotgcs/src/plugins/welcome/qml/CommunityPanel.qml
+++ b/ground/openpilotgcs/src/plugins/welcome/qml/CommunityPanel.qml
@@ -2,7 +2,8 @@
import QtQuick 1.1
Item {
- width: background.sourceSize.width
+ property alias sourceSize: background.sourceSize
+ width: sourceSize.width
height: 300
BorderImage {
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/NewsPanel.qml b/ground/openpilotgcs/src/plugins/welcome/qml/NewsPanel.qml
index a0e33c647..cb95da906 100644
--- a/ground/openpilotgcs/src/plugins/welcome/qml/NewsPanel.qml
+++ b/ground/openpilotgcs/src/plugins/welcome/qml/NewsPanel.qml
@@ -28,6 +28,10 @@ Item {
clip: true
}
+ ScrollDecorator {
+ flickableItem: view
+ }
+
XmlListModel {
id: xmlModel
source: "http://www.openpilot.org/feed/"
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/ScrollDecorator.qml b/ground/openpilotgcs/src/plugins/welcome/qml/ScrollDecorator.qml
new file mode 100644
index 000000000..a393690ae
--- /dev/null
+++ b/ground/openpilotgcs/src/plugins/welcome/qml/ScrollDecorator.qml
@@ -0,0 +1,37 @@
+import QtQuick 1.1
+
+Rectangle {
+ id: scrollDecorator
+
+ property Flickable flickableItem: null
+
+ Loader {
+ sourceComponent: scrollDecorator.flickableItem ? scrollBar : undefined
+ }
+
+ Component {
+ id: scrollBar
+ Rectangle {
+ property Flickable flickable: scrollDecorator.flickableItem
+
+ parent: flickable
+ anchors.right: parent.right
+
+ smooth: true
+ radius: 2
+ color: "gray"
+ border.color: "lightgray"
+ border.width: 1.0
+ opacity: flickable.moving ? 0.8 : 0.4
+
+ Behavior on opacity {
+ NumberAnimation { duration: 500 }
+ }
+
+ width: 4
+ height: flickable.height * (flickable.height / flickable.contentHeight)
+ y: flickable.height * (flickable.contentY / flickable.contentHeight)
+ visible: flickable.height < flickable.contentHeight
+ }
+ }
+}
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/WelcomePageButton.qml b/ground/openpilotgcs/src/plugins/welcome/qml/WelcomePageButton.qml
index a31a252eb..4874022be 100644
--- a/ground/openpilotgcs/src/plugins/welcome/qml/WelcomePageButton.qml
+++ b/ground/openpilotgcs/src/plugins/welcome/qml/WelcomePageButton.qml
@@ -3,8 +3,9 @@ import QtQuick 1.1
Item {
id: welcomeButton
- width: 116
+ width: Math.max(116, icon.width)
height: 116
+ z: 0
property string baseIconName
property alias label : labelText.text
@@ -26,17 +27,21 @@ Item {
Image {
id: labelImage
- source: "images/button-label.png"
+ property bool displayBelowButton: false
+ source: displayBelowButton ? "images/button-label-bottom.png" : "images/button-label.png"
opacity: 0
+ visible: labelText.text.length > 0 //don't show label bg without text
+
anchors.horizontalCenter: parent.horizontalCenter
- anchors.bottom: hoveredIcon.top
- anchors.bottomMargin: -8
+ y: displayBelowButton ? parent.height-8 : -height+8
Text {
id: labelText
- anchors.baseline: parent.verticalCenter
- anchors.baselineOffset: -4
+ anchors.baseline: parent.bottom
+ //text baseline depends on label image orientation,
+ //0.3 and 0.55 constants have to be adjusted when button-label.png is modified
+ anchors.baselineOffset: labelImage.displayBelowButton ? -parent.height*0.3 : -parent.height*0.55
anchors.horizontalCenter: parent.horizontalCenter
font {
@@ -49,8 +54,16 @@ Item {
states: State {
name: "hovered"
+ //update the tooltip position before it's displayed,
+ //since we don't have a property to bind directly
+ StateChangeScript {
+ name: "updateLabelPosition"
+ script: labelImage.displayBelowButton = welcomeButton.mapToItem(null,0,0).y < labelImage.height
+ }
PropertyChanges { target: hoveredIcon; opacity: 1.0 }
PropertyChanges { target: labelImage; opacity: 1.0 }
+ //raise this button, so tooltip is not obscured by the next items in the grid
+ PropertyChanges { target: welcomeButton; z: 1 }
}
transitions: Transition {
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-off.png b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-off.png
new file mode 100644
index 000000000..bb0aab304
Binary files /dev/null and b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-off.png differ
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-on.png b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-on.png
new file mode 100644
index 000000000..98eecd4ef
Binary files /dev/null and b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-txwizard-on.png differ
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-off.png b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-off.png
new file mode 100644
index 000000000..247c0b9a2
Binary files /dev/null and b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-off.png differ
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-on.png b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-on.png
new file mode 100644
index 000000000..720e4348d
Binary files /dev/null and b/ground/openpilotgcs/src/plugins/welcome/qml/images/bttn-vehwizard-on.png differ
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/images/button-label-bottom.png b/ground/openpilotgcs/src/plugins/welcome/qml/images/button-label-bottom.png
new file mode 100644
index 000000000..a6d885658
Binary files /dev/null and b/ground/openpilotgcs/src/plugins/welcome/qml/images/button-label-bottom.png differ
diff --git a/ground/openpilotgcs/src/plugins/welcome/qml/main.qml b/ground/openpilotgcs/src/plugins/welcome/qml/main.qml
index 4db07bd8e..f2f2a302c 100644
--- a/ground/openpilotgcs/src/plugins/welcome/qml/main.qml
+++ b/ground/openpilotgcs/src/plugins/welcome/qml/main.qml
@@ -25,6 +25,29 @@ Rectangle {
}
Column {
+ id: wizarButtonsColumn
+
+ anchors {
+ top: parent.top
+ right: parent.right
+ margins: 8
+ }
+ spacing: 8
+
+ WelcomePageButton {
+ baseIconName: "bttn-vehwizard"
+ onClicked: welcomePlugin.openPage("VehWizard")
+ }
+
+ WelcomePageButton {
+ baseIconName: "bttn-txwizard"
+ onClicked: welcomePlugin.openPage("TxWizard")
+ }
+ }
+
+
+ Column {
+ id: buttonsGrid
anchors.horizontalCenter: parent.horizontalCenter
// distribute a vertical space between the icons blocks an community widget as:
// top - 48% - Icons - 27% - CommunityWidget - 25% - bottom
@@ -33,13 +56,20 @@ Rectangle {
spacing: (parent.height - buttons.height - communityPanel.height) * 0.27
Row {
- anchors.horizontalCenter: parent.horizontalCenter
+ //if the buttons grid overlaps vertically with the wizard buttons,
+ //move it left to use only the space left to wizard buttons
+ property real availableWidth: buttonsGrid.y > wizarButtonsColumn.y+wizarButtonsColumn.height ?
+ container.width : wizarButtonsColumn.x
+ x: (availableWidth-width)/2
spacing: 16
Image {
source: "images/welcome-op-logo.png"
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: -2 //it looks better aligned to icons grid
+
+ //hide the logo on the very small screen to fit the buttons
+ visible: parent.availableWidth > width + parent.spacing + buttons.width
}
Grid {
@@ -89,6 +119,8 @@ Rectangle {
CommunityPanel {
id: communityPanel
anchors.horizontalCenter: parent.horizontalCenter
+ width: Math.min(sourceSize.width, container.width)
+ height: Math.min(300, container.height*0.5)
}
}
}
diff --git a/ground/openpilotgcs/src/plugins/welcome/welcome.qrc b/ground/openpilotgcs/src/plugins/welcome/welcome.qrc
index 0f1903a2b..2fc8bf23c 100644
--- a/ground/openpilotgcs/src/plugins/welcome/welcome.qrc
+++ b/ground/openpilotgcs/src/plugins/welcome/welcome.qrc
@@ -5,9 +5,11 @@
qml/SitesPanel.qml
qml/WelcomePageButton.qml
qml/NewsPanel.qml
+ qml/ScrollDecorator.qml
qml/images/welcome-news-bg.png
qml/images/welcome-op-logo.png
qml/images/button-label.png
+ qml/images/button-label-bottom.png
qml/images/welcome-op-bg.png
qml/images/welcome-bg.png
qml/images/flightdata-on.png
@@ -24,5 +26,9 @@
qml/images/scopes-off.png
qml/images/system-on.png
qml/images/system-off.png
+ qml/images/bttn-txwizard-on.png
+ qml/images/bttn-txwizard-off.png
+ qml/images/bttn-vehwizard-on.png
+ qml/images/bttn-vehwizard-off.png