Commit 86978aa1 authored by Valentin Platzgummer's avatar Valentin Platzgummer

ToolStrip.qml working

parent b9bb4442
......@@ -14,6 +14,7 @@ import QtQuick.Layouts 1.11
import QGroundControl.ScreenTools 1.0
import QGroundControl.Palette 1.0
// Tool Strip not tested for mobile devices!
Rectangle {
id: _root
color: qgcPal.window
......@@ -30,7 +31,7 @@ Rectangle {
property var animateImage ///< List of bool values, one for each button in strip - true: animate image, false: static image
property var buttonEnabled ///< List of bool values, one for each button in strip - true: button enabled, false: button disabled
property var buttonVisible ///< List of bool values, one for each button in strip - true: button visible, false: button invisible
property real maxHeight ///< Maximum height for control, determines whether text is hidden to make control shorter
property var maxHeight /// legacy parameter, does not have any impact
property bool horizontal: false /// toolstrip horizontal or vertical ?
property bool enableSwitchButton: false /// enable horizontal vertical button ?
......@@ -42,7 +43,7 @@ Rectangle {
readonly property real _margin: ScreenTools.defaultFontPixelWidth / 2
readonly property real _buttonSpacing: ScreenTools.defaultFontPixelHeight / 4
readonly property real _buttonWidthHeight: ScreenTools.isMobile ? ScreenTools.minTouchPixels : ScreenTools.defaultFontPixelWidth * 8
readonly property real _buttonWidthHeight: ScreenTools.isMobile ? ScreenTools.minTouchPixels : ScreenTools.defaultFontPixelWidth * 6
Component.onCompleted: toolStripGrid.horizontal = _root.horizontal
......@@ -72,16 +73,20 @@ Rectangle {
anchors.left: parent.left
columnSpacing: _buttonSpacing
rowSpacing: _buttonSpacing
rows: toolStripGrid.horizontal ? 1 : model.length
columns: toolStripGrid.horizontal ? model.length : 1
// Lable + Separator + GridLayout + Spearator + Switch Button
property int numItems: enableSwitchButton ? 5 : 3
rows: toolStripGrid.horizontal ? 1 : numItems
columns: toolStripGrid.horizontal ? numItems : 1
horizontalItemAlignment: Grid.AlignHCenter
verticalItemAlignment: Grid.AlignVCenter
property bool horizontal
QGCLabel {
text: title
font.pointSize: ScreenTools.mobile ? ScreenTools.smallFontPointSize : ScreenTools.defaultFontPointSize
Layout.alignment: toolStripGrid.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter
}
......@@ -93,12 +98,14 @@ Rectangle {
}
GridLayout {
id: modelButtonsGrid
rows: toolStripGrid.horizontal ? 1 : model.length
columns: toolStripGrid.horizontal ? model.length : 1
columnSpacing: _buttonSpacing
rowSpacing: _buttonSpacing
Repeater {
id: repeater
......@@ -149,20 +156,22 @@ Rectangle {
Rectangle {
id: buttonRect
anchors.left: parent.left
anchors.top: parent.top
height: _buttonWidthHeight
width: _buttonWidthHeight
color: _showHighlight ? _repeaterPal.buttonHighlight : _repeaterPal.window
clip: true
radius: ScreenTools.defaultFontPixelWidth/2
Column {
anchors.horizontalCenter: parent.horizontalCenter
QGCColoredImage {
id: buttonImage
height: _buttonWidthHeight-buttonLabel.height
width: _buttonWidthHeight-buttonLabel.height
anchors.centerIn: parent
source: _source
anchors.horizontalCenter: parent.horizontalCenter
sourceSize.height: _buttonWidthHeight-buttonLabel.height
sourceSize.width: _buttonWidthHeight-buttonLabel.height
fillMode: Image.PreserveAspectCrop
......@@ -191,14 +200,14 @@ Rectangle {
QGCLabel {
id: buttonLabel
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
font.pointSize: ScreenTools.smallFontPointSize
text: modelData.name
color: _showHighlight ? _repeaterPal.buttonHighlightText : _repeaterPal.text
enabled: _buttonEnabled
}
}
QGCMouseArea {
anchors.fill: parent
......@@ -249,24 +258,26 @@ Rectangle {
// switch button, tool strip horizontal <-> vertical
Rectangle {
id: switchButtonRect
height: _buttonWidthHeight
width: _buttonWidthHeight
height: enableSwitchButton ? _buttonWidthHeight : 0
width: enableSwitchButton ? _buttonWidthHeight : 0
color: _showHighlight ? _switchButtonPal.buttonHighlight : _switchButtonPal.window
visible: enableSwitchButton
radius: ScreenTools.defaultFontPixelWidth/2
clip: true
property bool _hovered: false
property bool _showHighlight: (enableSwitchButton && _hovered)
QGCPalette { id: _switchButtonPal; colorGroupEnabled: enableSwitchButton }
Column {
anchors.horizontalCenter: parent.horizontalCenter
QGCColoredImage {
id: switchButtonImage
height: _buttonWidthHeight-switchButtonLabel.height
width: _buttonWidthHeight-switchButtonLabel.height
anchors.top: parent.top
anchors.centerIn: parent
source: "/res/clockwise-arrow.svg"
anchors.horizontalCenter: parent.horizontalCenter
sourceSize.height: _buttonWidthHeight-switchButtonLabel.height
sourceSize.width: _buttonWidthHeight-switchButtonLabel.height
fillMode: Image.PreserveAspectCrop
......@@ -278,12 +289,12 @@ Rectangle {
QGCLabel {
id: switchButtonLabel
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
font.pointSize: ScreenTools.smallFontPointSize
text: toolStripGrid.horizontal ? "Vert" : "Hor"
color: switchButtonRect._showHighlight ? _switchButtonPal.buttonHighlightText : _switchButtonPal.text
enabled: enableSwitchButton
}
}
QGCMouseArea {
anchors.fill: parent
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment