From b9bb4442834eb4a441b97ce0298f6856475a6003 Mon Sep 17 00:00:00 2001 From: Valentin Platzgummer Date: Thu, 27 Feb 2020 11:00:21 +0100 Subject: [PATCH] Toolstrip.qml edited, almost finised --- src/FlightDisplay/FlightDisplayView.qml | 2 +- src/QmlControls/ToolStrip.qml | 193 ++++++++++++------------ 2 files changed, 97 insertions(+), 98 deletions(-) diff --git a/src/FlightDisplay/FlightDisplayView.qml b/src/FlightDisplay/FlightDisplayView.qml index a2a58958e..98e48f2ce 100644 --- a/src/FlightDisplay/FlightDisplayView.qml +++ b/src/FlightDisplay/FlightDisplayView.qml @@ -679,7 +679,7 @@ QGCView { maxHeight: (_flightVideo.visible ? _flightVideo.y : parent.height) - toolStrip.y buttonVisible: [ _useChecklist, _guidedController.showTakeoff || !_guidedController.showLand, _guidedController.showLand && !_guidedController.showTakeoff, true, true, true ] buttonEnabled: [ _useChecklist && _activeVehicle, _guidedController.showTakeoff, _guidedController.showLand, _guidedController.showRTL, _guidedController.showPause, _anyActionAvailable ] - horizontal: true + horizontal: false enableSwitchButton: true property bool _anyActionAvailable: _guidedController.showStartMission || _guidedController.showResumeMission || _guidedController.showChangeAlt || _guidedController.showLandAbort diff --git a/src/QmlControls/ToolStrip.qml b/src/QmlControls/ToolStrip.qml index cf7ae912c..42e42602b 100644 --- a/src/QmlControls/ToolStrip.qml +++ b/src/QmlControls/ToolStrip.qml @@ -1,4 +1,4 @@ -/**************************************************************************** +/**************************************************************************** * * (c) 2009-2016 QGROUNDCONTROL PROJECT * @@ -35,7 +35,6 @@ Rectangle { property bool enableSwitchButton: false /// enable horizontal vertical button ? - property real _horizontal: horizontal signal clicked(int index, bool checked) @@ -43,7 +42,11 @@ Rectangle { readonly property real _margin: ScreenTools.defaultFontPixelWidth / 2 readonly property real _buttonSpacing: ScreenTools.defaultFontPixelHeight / 4 - readonly property real _imageWidthHeight: ScreenTools.isMobile ? ScreenTools.minTouchPixels : ScreenTools.defaultFontPixelWidth * 5 + readonly property real _buttonWidthHeight: ScreenTools.isMobile ? ScreenTools.minTouchPixels : ScreenTools.defaultFontPixelWidth * 8 + + Component.onCompleted: toolStripGrid.horizontal = _root.horizontal + + onHorizontalChanged: toolStripGrid.horizontal = _root.horizontal QGCPalette { id: qgcPal } ExclusiveGroup { id: dropButtonsExclusiveGroup } @@ -62,37 +65,40 @@ Rectangle { anchors.fill: parent } - GridLayout { + Grid { id: toolStripGrid anchors.margins: ScreenTools.defaultFontPixelWidth / 2 anchors.top: parent.top anchors.left: parent.left columnSpacing: _buttonSpacing rowSpacing: _buttonSpacing - rows: _horizontal ? 1 : model.length - columns: _horizontal ? model.length : 1 + rows: toolStripGrid.horizontal ? 1 : model.length + columns: toolStripGrid.horizontal ? model.length : 1 + + property bool horizontal QGCLabel { text: title font.pointSize: ScreenTools.mobile ? ScreenTools.smallFontPointSize : ScreenTools.defaultFontPointSize - Layout.alignment: _horizontal ? Qt.AlignVCenter : Qt.AlignHCenter + Layout.alignment: toolStripGrid.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter + } + // separator Rectangle { - height: _horizontal ? undefined : 1 - width: _horizontal ? 1 : undefined - Layout.fillWidth: _horizontal ? false : true - Layout.fillHeight: _horizontal ? true : false + height: toolStripGrid.horizontal ? _buttonWidthHeight : 1 + width: toolStripGrid.horizontal ? 1 : _buttonWidthHeight color: qgcPal.text } GridLayout { - rows: _horizontal ? 1 : model.length - columns: _horizontal ? model.length : 1 + rows: toolStripGrid.horizontal ? 1 : model.length + columns: toolStripGrid.horizontal ? model.length : 1 columnSpacing: _buttonSpacing rowSpacing: _buttonSpacing + Repeater { id: repeater @@ -101,7 +107,7 @@ Rectangle { width: buttonRect.width height: buttonRect.height visible: _root.buttonVisible ? _root.buttonVisible[index] : true - Layout.alignment: _horizontal ? Qt.AlignVCenter : Qt.AlignHCenter + Layout.alignment: toolStripGrid.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter property bool checked: false property ExclusiveGroup exclusiveGroup: dropButtonsExclusiveGroup @@ -145,56 +151,54 @@ Rectangle { id: buttonRect anchors.left: parent.left anchors.top: parent.top - height: buttonColumn.height - width: buttonColumn.width + height: _buttonWidthHeight + width: _buttonWidthHeight color: _showHighlight ? _repeaterPal.buttonHighlight : _repeaterPal.window - - Column { - id: buttonColumn - anchors.top: parent.top - anchors.left: parent.left - spacing: _buttonSpacing - - QGCColoredImage { - id: buttonImage - height: _imageWidthHeight - width: _imageWidthHeight - //anchors.centerIn: parent - source: _source - sourceSize.height: height - fillMode: Image.PreserveAspectFit - mipmap: true - smooth: true - color: _showHighlight ? _repeaterPal.buttonHighlightText : _repeaterPal.text - - RotationAnimation on rotation { - id: imageRotation - loops: Animation.Infinite - from: 0 - to: 360 - duration: 500 - running: false - } - - NumberAnimation on opacity { - id: opacityAnimation - running: false - from: 0 - to: 1.0 - loops: Animation.Infinite - duration: 2000 - } + clip: true + radius: ScreenTools.defaultFontPixelWidth/2 + + QGCColoredImage { + id: buttonImage + height: _buttonWidthHeight-buttonLabel.height + width: _buttonWidthHeight-buttonLabel.height + anchors.centerIn: parent + source: _source + sourceSize.height: _buttonWidthHeight-buttonLabel.height + sourceSize.width: _buttonWidthHeight-buttonLabel.height + fillMode: Image.PreserveAspectCrop + mipmap: true + smooth: true + color: _showHighlight ? _repeaterPal.buttonHighlightText : _repeaterPal.text + + RotationAnimation on rotation { + id: imageRotation + loops: Animation.Infinite + from: 0 + to: 360 + duration: 500 + running: false } - QGCLabel { - id: buttonLabel - anchors.horizontalCenter: parent.horizontalCenter - font.pointSize: ScreenTools.smallFontPointSize - text: modelData.name - color: _showHighlight ? _repeaterPal.buttonHighlightText : _repeaterPal.text - enabled: _buttonEnabled + NumberAnimation on opacity { + id: opacityAnimation + running: false + from: 0 + to: 1.0 + loops: Animation.Infinite + duration: 2000 } - } // Column + } + + 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 @@ -236,10 +240,8 @@ Rectangle { // separator Rectangle { - height: _horizontal ? undefined : 1 - width: _horizontal ? 1 : undefined - Layout.fillWidth: _horizontal ? false : true - Layout.fillHeight: _horizontal ? true : false + height: toolStripGrid.horizontal ? _buttonWidthHeight : 1 + width: toolStripGrid.horizontal ? 1 : _buttonWidthHeight color: qgcPal.text visible: enableSwitchButton } @@ -247,44 +249,41 @@ Rectangle { // switch button, tool strip horizontal <-> vertical Rectangle { id: switchButtonRect - height: switchButtonColumn.height - width: switchButtonColumn.width + height: _buttonWidthHeight + width: _buttonWidthHeight color: _showHighlight ? _switchButtonPal.buttonHighlight : _switchButtonPal.window - visible: enableSwitchButton + visible: enableSwitchButton + radius: ScreenTools.defaultFontPixelWidth/2 property bool _hovered: false property bool _showHighlight: (enableSwitchButton && _hovered) QGCPalette { id: _switchButtonPal; colorGroupEnabled: enableSwitchButton } - Column { - id: switchButtonColumn - anchors.top: parent.top - anchors.left: parent.left - spacing: _buttonSpacing - - QGCColoredImage { - id: switchButtonImage - height: _imageWidthHeight - width: _imageWidthHeight - //anchors.centerIn: parent - source: "/res/clockwise-arrow.svg" - sourceSize.height: height - fillMode: Image.PreserveAspectFit - mipmap: true - smooth: true - color: switchButtonRect._showHighlight ? _switchButtonPal.buttonHighlightText : _switchButtonPal.text - } + QGCColoredImage { + id: switchButtonImage + height: _buttonWidthHeight-switchButtonLabel.height + width: _buttonWidthHeight-switchButtonLabel.height + anchors.top: parent.top + anchors.centerIn: parent + source: "/res/clockwise-arrow.svg" + sourceSize.height: _buttonWidthHeight-switchButtonLabel.height + sourceSize.width: _buttonWidthHeight-switchButtonLabel.height + fillMode: Image.PreserveAspectCrop + mipmap: true + smooth: true + color: switchButtonRect._showHighlight ? _switchButtonPal.buttonHighlightText : _switchButtonPal.text + } - QGCLabel { - id: switchButtonLabel - anchors.horizontalCenter: parent.horizontalCenter - font.pointSize: ScreenTools.smallFontPointSize - text: _horizontal ? "Vert" : "Hor" - color: switchButtonRect._showHighlight ? _switchButtonPal.buttonHighlightText : _switchButtonPal.text - enabled: enableSwitchButton - } - } // Column + 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 @@ -297,10 +296,10 @@ Rectangle { onClicked: { dropPanel.hide() // hide affects checked, so this needs to be duplicated inside not outside if - if (_root._horizontal === true) { - _root._horizontal = false + if (toolStripGrid.horizontal === true) { + toolStripGrid.horizontal = false } else { - _root._horizontal = true + toolStripGrid.horizontal = true } } } -- 2.22.0