Skip to content

Q
qgroundcontrol
Commit f5099553 authored by Gus Grubba's avatar Gus Grubba
Browse files
Options

Tweaking toolstrip layout

parent 58227dfd
Hide whitespace changes
Inline Side-by-side
Showing with 74 additions and 101 deletions
src/FlightMap/Images/ZoomMinus.svg
View file @ f5099553
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 23.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-269 361 72 72" style="enable-background:new -269 361 72 72;" xml:space="preserve"> viewBox="0 0 72 72" style="enable-background:new 0 0 72 72;" xml:space="preserve">
<style type="text/css"> <style type="text/css">
.st0{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;} .st0{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
.st1{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;} .st1{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
.st2{fill:none;} .st2{fill:none;}
.st3{fill:none;stroke:#FFFFFF;stroke-width:5;stroke-miterlimit:10;} .st3{fill:none;stroke:#FFFFFF;stroke-width:5;stroke-miterlimit:10;}
</style> </style>
<circle class="st0" cx="-236.2" cy="393.9" r="11.2"/> <circle class="st0" cx="31" cy="31.2" r="17.5"/>
<line class="st1" x1="-218.6" y1="411.3" x2="-228.1" y2="401.8"/> <line class="st1" x1="58.5" y1="58.3" x2="43.6" y2="43.5"/>
<line class="st2" x1="-242.5" y1="393.9" x2="-229.9" y2="393.9"/> <line class="st2" x1="21.2" y1="31.2" x2="40.8" y2="31.2"/>
<line class="st3" x1="-242.5" y1="394" x2="-229.9" y2="393.9"/> <line class="st3" x1="21.2" y1="31.3" x2="40.8" y2="31.2"/>
</svg> </svg>
src/FlightMap/Images/ZoomPlus.svg
View file @ f5099553
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 23.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-269 361 72 72" style="enable-background:new -269 361 72 72;" xml:space="preserve"> viewBox="0 0 72 72" style="enable-background:new 0 0 72 72;" xml:space="preserve">
<style type="text/css"> <style type="text/css">
.st0{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;} .st0{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
.st1{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;} .st1{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
.st2{fill:#FFFFFF;} .st2{fill:#FFFFFF;}
</style> </style>
<circle class="st0" cx="-236.2" cy="393.9" r="11.2"/> <circle class="st0" cx="31" cy="31.2" r="17.5"/>
<line class="st1" x1="-218.6" y1="411.3" x2="-228.1" y2="401.8"/> <line class="st1" x1="58.5" y1="58.3" x2="43.6" y2="43.5"/>
<path class="st2" d="M-237.3,400.2V395h-5.2v-2.2h5.2v-5.2h2.2v5.2h5.2v2.2h-5.2v5.2H-237.3z"/> <path class="st2" d="M29.3,41v-8.1h-8.1v-3.4h8.1v-8.1h3.4v8.1h8.1v3.4h-8.1V41H29.3z"/>
</svg> </svg>
src/QmlControls/QGCHoverButton.qml
View file @ f5099553
...@@ -8,26 +8,25 @@ import QGroundControl.Palette 1.0 ...@@ -8,26 +8,25 @@ import QGroundControl.Palette 1.0
// TODO: use QT palette // TODO: use QT palette
Button { Button {
id: button id: button
width: columnItem.contentWidth + contentLayoutItem.margins * 2 width: contentLayoutItem.contentWidth + (contentMargins * 2)
height: width height: width
flat: true flat: true
property color borderColor: qgcPal.windowShadeDark property color borderColor: qgcPal.windowShadeDark
property alias radius: buttonBkRect.radius property alias radius: buttonBkRect.radius
property alias fontPointSize: innerText.font.pointSize property alias fontPointSize: innerText.font.pointSize
property alias imageSource: innerImage.source property alias imageSource: innerImage.source
property alias contentWidth: innerText.contentWidth property alias contentWidth: innerText.contentWidth
property real imageScale: 0.8 property real imageScale: 0.6
property real borderWidth: 0 property real borderWidth: 0
property real contentMargins: innerText.height * 0.1 property real contentMargins: innerText.height * 0.1
property color _currentColor: qgcPal.button property color _currentColor: qgcPal.button
property color _currentContentColor: qgcPal.buttonText property color _currentContentColor: qgcPal.buttonText
QGCPalette { id: qgcPal }
QGCPalette { id: qgcPalDisabled; colorGroupEnabled: false } QGCPalette { id: qgcPalDisabled; colorGroupEnabled: false }
// Initial state // Initial state
...@@ -35,70 +34,43 @@ Button { ...@@ -35,70 +34,43 @@ Button {
// Update state on status changed // Update state on status changed
onEnabledChanged: state = "Default" onEnabledChanged: state = "Default"
property real _contentVDist: innerImage.height/innerText.contentHeight
// Content Icon + Text // Content Icon + Text
contentItem: Item { contentItem: Item {
id: contentLayoutItem id: contentLayoutItem
anchors.fill: parent anchors.fill: parent
anchors.margins: contentMargins anchors.margins: contentMargins
Column { Column {
id: columnItem anchors.centerIn: parent
anchors.fill: parent spacing: contentMargins * 2
QGCColoredImage {
Item { id: innerImage
width: parent.width height: contentLayoutItem.height * imageScale
height: (contentLayoutItem.height - innerText.height) width: contentLayoutItem.width * imageScale
Image { smooth: true
id: innerImage mipmap: true
color: _currentContentColor
anchors.centerIn: parent fillMode: Image.PreserveAspectFit
antialiasing: true
height: parent.height * imageScale sourceSize.height: height
width: parent.width * imageScale sourceSize.width: width
anchors.horizontalCenter: parent.horizontalCenter
visible: false
smooth: true
antialiasing: true
mipmap: true
fillMode: Image.PreserveAspectFit
sourceSize.height: height
sourceSize.width: width
horizontalAlignment: Image.AlignHCenter
verticalAlignment: Image.AlignVCenter
}
ColorOverlay {
id: imageOverlay
anchors.fill: innerImage
source: innerImage
color: _currentContentColor
}
} }
QGCLabel {
Text { id: innerText
id: innerText text: button.text
text: button.text color: _currentContentColor
color: _currentContentColor anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
font.family: ScreenTools.normalFontFamily
font.pointSize: ScreenTools.defaultFontPointSize
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
} }
} // Column - content }
} // Item - content }
background: Rectangle { background: Rectangle {
id: buttonBkRect id: buttonBkRect
anchors.fill: parent color: _currentColor
color: _currentColor visible: !flat
visible: !flat border.width: borderWidth
border.color: borderColor
border.width: borderWidth anchors.fill: parent
border.color: borderColor
} }
// Change the colors based on button states // Change the colors based on button states
...@@ -142,11 +114,11 @@ Button { ...@@ -142,11 +114,11 @@ Button {
// Process hover events // Process hover events
MouseArea { MouseArea {
enabled: !ScreenTools.isMobile enabled: !ScreenTools.isMobile
hoverEnabled: true hoverEnabled: true
propagateComposedEvents: true propagateComposedEvents: true
preventStealing: true preventStealing: true
anchors.fill: button anchors.fill: button
onEntered: { button.state = 'Hovering'; } onEntered: { button.state = 'Hovering'; }
onExited: { button.state = 'Default'; } onExited: { button.state = 'Default'; }
// Propagate events down // Propagate events down
......
src/QmlControls/ToolStrip.qml
View file @ f5099553
...@@ -47,6 +47,7 @@ Rectangle { ...@@ -47,6 +47,7 @@ Rectangle {
anchors.top: parent.top anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
spacing: ScreenTools.defaultFontPixelWidth * 0.25
Repeater { Repeater {
id: repeater id: repeater
......
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