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