mifr/subsurface
1
0
Fork 0
mirror of https://github.com/subsurface/subsurface.git synced 2024-11-30 22:20:21 +00:00
Code Issues Projects Releases Packages Wiki Activity

mobile-widgets: update design of TemplateSpinBox

Browse source 
The standard SpinBox uses far too much real estate.

The new SpinBox have a smaller footprint, and more visual effect.

Changing the TemplateSpinBox, automatically changes all spinboxes
in the system, converted to the new layout.

The styling would be better in a style/theme class, but
subsurfaceTheme is in main.qml and not in a C++ class, so for now
use primitive styling.

Signed-off-by: jan Iversen <jan@casacondor.com>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
jan Iversen 2020-01-11 09:03:48 +01:00 committed by Dirk Hohndel
parent c1bbab6eaa
commit a97a6d607c
1 changed files with 61 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
mobile-widgets/qml/TemplateSpinBox.qml
View file

@ -4,5 +4,65 @@ import QtQuick.Controls 2.4
import QtQuick.Layouts 1.11
SpinBox {
font.pointSize: subsurfaceTheme.regularPointSize;
id: control
editable: true
font.pointSize: subsurfaceTheme.regularPointSize
contentItem: TextInput {
z: 2
text: control.textFromValue(control.value, control.locale)
font: control.font
color: control.enabled ? "black" : "lightgrey"
horizontalAlignment: Qt.AlignHCenter
verticalAlignment: Qt.AlignVCenter
readOnly: !control.editable
validator: control.validator
inputMethodHints: Qt.ImhFormattedNumbersOnly
}
up.indicator: Rectangle {
x: control.mirrored ? 0 : parent.width - width
height: control.height
implicitWidth: 30
implicitHeight: 30
color: control.enabled ? "grey" : "lightgrey"
border.color: control.enabled ? "grey" : "lightgrey"
Text {
text: "+"
font.pixelSize: control.font.pixelSize * 2
color: control.enabled ? "black" : "lightgrey"
anchors.fill: parent
fontSizeMode: Text.Fit
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
down.indicator: Rectangle {
x: control.mirrored ? parent.width - width : 0
height: control.height
implicitWidth: 30
implicitHeight: 30
color: control.enabled ? "grey" : "lightgrey"
border.color: control.enabled ? "grey" : "lightgrey"
Text {
text: "-"
font.pixelSize: control.font.pixelSize * 2
color: control.enabled ? "black" : "lightgrey"
anchors.fill: parent
fontSizeMode: Text.Fit
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
background: Rectangle {
implicitWidth: 140
color: subsurfaceTheme.backgroundColor
border.color: subsurfaceTheme.backgroundColor
}
}