15.10 restyling of the layerview slider

Adds a textfield to the handle for per layer selection and removes the display of the min- and maxvalue

Contributes to: issue CURA-60
This commit is contained in:
Tamara Hogenhout 2015-08-25 12:20:13 +02:00
parent 96c63ef6e9
commit 534c277b00
4 changed files with 44 additions and 51 deletions

View file

@ -19,7 +19,7 @@ Item
width: 10
height: 250
anchors.right : parent.right
anchors.rightMargin: UM.Theme.sizes.slider_layerview_margin.width
anchors.rightMargin: UM.Theme.sizes.slider_layerview_margin.width/2
orientation: Qt.Vertical
minimumValue: 0;
maximumValue: UM.LayerView.numLayers;
@ -38,14 +38,16 @@ Item
height: UM.Theme.sizes.slider_layerview_background_extension.height
color: UM.Theme.colors.slider_text_background
}
UM.AngledCornerRectangle {
Rectangle {
anchors.right : parent.right
anchors.verticalCenter: parent.verticalCenter
z: slider.z - 1
cornerSize: UM.Theme.sizes.default_margin.width;
width: UM.Theme.sizes.slider_layerview_background.width
height: slider.height + UM.Theme.sizes.default_margin.height * 2
color: UM.Theme.colors.slider_text_background
color: UM.Theme.colors.tool_panel_background;
border.width: UM.Theme.sizes.default_lining.width
border.color: UM.Theme.colors.lining
MouseArea {
id: sliderMouseArea
property double manualStepSize: slider.maximumValue / 11

View file

@ -51,7 +51,7 @@ Item {
z: parent.z - 1
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
color: UM.Theme.colors.button_lining
color: UM.Theme.colors.lining
}
Rectangle {
@ -68,7 +68,7 @@ Item {
color: UM.Theme.colors.tool_panel_background;
border.width: UM.Theme.sizes.default_lining.width
border.color: UM.Theme.colors.button_lining
border.color: UM.Theme.colors.lining
Loader {
id: panel

View file

@ -67,10 +67,10 @@ QtObject {
Rectangle {
id: tool_button_background
anchors.top: parent.verticalCenter;
anchors.top: parent.bottom
width: parent.width;
height: control.hovered ? parent.height / 2 + label.height : 0;
width: label.width > parent.width ? label.width : parent.width
height: control.hovered ? label.height : 0;
Behavior on height { NumberAnimation { duration: 100; } }
opacity: control.hovered ? 1.0 : 0.0;
@ -416,26 +416,6 @@ QtObject {
color: UM.Theme.colors.slider_groove_fill;
width: (control.value / (control.maximumValue - control.minimumValue)) * parent.width;
}
Label {
id: maxValueLabel
visible: UM.LayerView.getLayerActivity && Printer.getPlatformActivity ? true : false
text: control.maximumValue + 1
font: control.maximumValue > 998 ? UM.Theme.fonts.small : UM.Theme.fonts.default
transformOrigin: Item.BottomLeft
rotation: 90
x: parent.x + parent.width - maxValueLabel.height
y: control.maximumValue > 998 ? parent.y + UM.Theme.sizes.slider_layerview_smalltext_margin.width : parent.y
}
Label {
id: minValueLabel
visible: UM.LayerView.getLayerActivity && Printer.getPlatformActivity ? true : false
text: '1'
font: control.maximumValue > 998 ? UM.Theme.fonts.small : UM.Theme.fonts.default
transformOrigin: Item.BottomLeft
rotation: 90
x: parent.x
y: control.maximumValue > 998 ? parent.y + UM.Theme.sizes.slider_layerview_smalltext_margin.width : parent.y
}
}
handle: Rectangle {
id: layerSliderControl
@ -443,26 +423,37 @@ QtObject {
height: UM.Theme.sizes.slider_handle.height;
color: control.hovered ? UM.Theme.colors.slider_handle_hover : UM.Theme.colors.slider_handle;
Behavior on color { ColorAnimation { duration: 50; } }
Label {
TextField {
id: valueLabel
property int unremovableSpacing: 5
property string maxValue: control.maximumValue + 1
placeholderText: control.value + 1
onEditingFinished: {
if (valueLabel.text != ''){
control.value = valueLabel.text - 1
valueLabel.text = ''
valueLabel.focus = false
}
}
validator: IntValidator {bottom: 1; top: control.maximumValue + 1;}
visible: UM.LayerView.getLayerActivity && Printer.getPlatformActivity ? true : false
text: control.value + 1
anchors.bottom: layerSliderControl.bottom
anchors.right: layerSliderControl.left
anchors.bottomMargin: parent.width + UM.Theme.sizes.default_margin.width
font: UM.Theme.fonts.default
anchors.rightMargin: valueLabel.unremovableSpacing / 2
anchors.bottomMargin: parent.width + (UM.Theme.sizes.default_margin.width / 2)
transformOrigin: Item.BottomRight
rotation: 90
Rectangle {
width: (parent.width + UM.Theme.sizes.tooltip_margins.width) < 35 ? 35 : parent.width + UM.Theme.sizes.tooltip_margins.width
height: parent.height + (UM.Theme.sizes.tooltip_margins.height / 2)
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
z: parent.z - 1
color: UM.Theme.colors.slider_text_background
border.width: 1
border.color: UM.Theme.colors.slider_groove_fill;
style: TextFieldStyle{
textColor: UM.Theme.colors.setting_control_text;
font: UM.Theme.fonts.default;
background: Rectangle {
radius: 0
implicitWidth: control.maxValue.length * valueLabel.font.pixelSize
implicitHeight: UM.Theme.sizes.slider_handle.height + valueLabel.unremovableSpacing
border.width: 1;
border.color: UM.Theme.colors.slider_groove_border;
}
}
}
}

View file

@ -54,6 +54,7 @@
"colors": {
"sidebar": [255, 255, 255, 255],
"lining": [208, 210, 211, 255],
"primary": [12, 169, 227, 255],
"primary_hover": [34, 150, 190, 255],
@ -67,10 +68,9 @@
"text_pressed": [12, 169, 227, 255],
"button": [139, 143, 153, 255],
"button_hover": [116, 120, 127, 255],
"button_active": [12, 169, 227, 255],
"button_hover": [77, 184, 226, 255],
"button_active": [32, 166, 219, 255],
"button_active_hover": [77, 184, 226, 255],
"button_lining": [208, 210, 211, 255],
"button_text": [255, 255, 255, 255],
"button_disabled": [245, 245, 245, 255],
"button_tooltip_text": [35, 35, 35, 255],
@ -107,10 +107,10 @@
"progressbar_control": [12, 169, 227, 255],
"slider_groove": [245, 245, 245, 255],
"slider_groove_border": [160, 163, 171, 255],
"slider_groove_fill": [160, 163, 171, 255],
"slider_handle": [12, 169, 227, 255],
"slider_handle_hover": [34, 150, 190, 255],
"slider_groove_border": [139, 143, 153, 255],
"slider_groove_fill": [139, 143, 153, 255],
"slider_handle": [32, 166, 219, 255],
"slider_handle_hover": [77, 182, 226, 255],
"slider_text_background": [255, 255, 255, 255],
"checkbox": [255, 255, 255, 255],
@ -174,7 +174,7 @@
"slider_groove": [0.5, 0.5],
"slider_handle": [1.5, 1.5],
"slider_layerview_background": [6.0, 0.0],
"slider_layerview_background": [4.0, 0.0],
"slider_layerview_smalltext_margin": [0.3, 0.00],
"slider_layerview_background_extension": [0.0, 2.2],
"slider_layerview_margin": [3.0, 3.0],