diff --git a/plugins/LayerView/LayerSlider.qml b/plugins/LayerView/LayerSlider.qml index eee8ebe5c3..bad4216d23 100644 --- a/plugins/LayerView/LayerSlider.qml +++ b/plugins/LayerView/LayerSlider.qml @@ -19,6 +19,7 @@ Item { property color upperHandleColor: "black" property color lowerHandleColor: "black" property color rangeHandleColor: "black" + property real handleLabelWidth: width // track properties property real trackThickness: 4 // width of the slider track @@ -42,7 +43,6 @@ Item { } function setUpperValue (value) { - console.log("setUpperValue", value) upperHandle.setValue(value) updateRangeHandle() } @@ -52,7 +52,6 @@ Item { } function setLowerValue (value) { - console.log("setLowerValue", value) lowerHandle.setValue(value) updateRangeHandle() } @@ -135,15 +134,13 @@ Item { function onHandleDragged () { - console.log("upperhandle dragged") - // don't allow the lower handle to be heigher than the upper handle if (lowerHandle.y - (y + height) < sliderRoot.minimumRangeHandleSize) { lowerHandle.y = y + height + sliderRoot.minimumRangeHandleSize } // update the rangle handle - rangeHandle.height = lowerHandle.y - (y + height) + sliderRoot.updateRangeHandle() // TODO: improve this? UM.LayerView.setCurrentLayer(getValue()) @@ -159,10 +156,15 @@ Item { // set the slider position based on the upper value function setValue (value) { - console.log("setValue", value) var diff = (value - sliderRoot.maximumValue) / (sliderRoot.minimumValue - sliderRoot.maximumValue) var newUpperYPosition = Math.round(diff * (sliderRoot.height - (2 * sliderRoot.handleSize + sliderRoot.minimumRangeHandleSize))) y = newUpperYPosition + + // update the rangle handle + sliderRoot.updateRangeHandle() + + // TODO: improve this? + UM.LayerView.setCurrentLayer(getValue()) } // dragging @@ -179,39 +181,22 @@ Item { onPositionChanged: parent.onHandleDragged() } -// UM.PointingRectangle { -// -// x: sliderRoot.width - UM.Theme.getSize("slider_layerview_background").width / 2 - width; -// y: Math.floor(((parent.y + parent.height) / 2) - (height / 2)); -// -// target: Qt.point(parent.width, (parent.y + parent.height) / 2) -// arrowSize: UM.Theme.getSize("default_arrow").width -// -// height: UM.Theme.getSize("slider_handle").height + UM.Theme.getSize("default_margin").height -// width: valueLabel.width + UM.Theme.getSize("default_margin").width -// Behavior on height { NumberAnimation { duration: 50; } } -// -// color: UM.Theme.getColor("tool_panel_background") -// borderColor: UM.Theme.getColor("lining") -// borderWidth: UM.Theme.getSize("default_lining").width -// visible: sliderRoot.layersVisible -// -// // Catch all mouse events (so 3D scene doesn't handle them) -// MouseArea { -// anchors.fill: parent -// } -// -// TextField { -// id: upperValueLabel -// -// property string maximumValue: sliderRoot.maximumValue + 1 -// -// text: sliderRoot.getUpperValue() + 1 -// horizontalAlignment: TextInput.AlignRight -// -// -// } -// } + LayerSliderLabel { + id: upperHandleLabel + + height: sliderRoot.handleSize + UM.Theme.getSize("default_margin").height + // width is calculated automatically from the input field width + x: (sliderRoot.width / 2 - (parent.width / 2)) - width + y: Math.floor(parent.y + parent.height / 2 - height / 2) + target: Qt.point(sliderRoot.width, parent.y + parent.height / 2) + visible: sliderRoot.layersVisible + + // custom properties + maximumValue: sliderRoot.maximumValue + value: sliderRoot.getUpperValue() + busy: UM.LayerView.busy + setValue: sliderRoot.setUpperValue // connect callback functions + } } // Lower handle @@ -238,7 +223,7 @@ Item { rangeHandle.height = y - (upperHandle.y + upperHandle.height) // TODO: improve this? - UM.LayerView.setMinimumLayer(getValue()); + UM.LayerView.setMinimumLayer(getValue()) } // get the lower value from the current slider position @@ -254,6 +239,12 @@ Item { var diff = (value - sliderRoot.maximumValue) / (sliderRoot.minimumValue - sliderRoot.maximumValue) var newLowerYPosition = Math.round((sliderRoot.handleSize + sliderRoot.minimumRangeHandleSize) + diff * (sliderRoot.height - (2 * sliderRoot.handleSize + sliderRoot.minimumRangeHandleSize))) y = newLowerYPosition + + // update the rangle handle + sliderRoot.updateRangeHandle() + + // TODO: improve this? + UM.LayerView.setMinimumLayer(getValue()) } // dragging @@ -269,5 +260,22 @@ Item { onPositionChanged: parent.onHandleDragged() } + + LayerSliderLabel { + id: lowerHandleLabel + + height: sliderRoot.handleSize + UM.Theme.getSize("default_margin").height + // width is calculated automatically from the input field width + x: (parent.x + (parent.width / 2)) - width - 100 + y: Math.floor(parent.y + height / 2) + target: Qt.point(sliderRoot.width, parent.y + parent.height / 2) + visible: sliderRoot.layersVisible + + // custom properties + maximumValue: sliderRoot.maximumValue + value: sliderRoot.getLowerValue() + busy: UM.LayerView.busy + setValue: sliderRoot.setLowerValue // connect callback functions + } } } diff --git a/plugins/LayerView/LayerSliderLabel.qml b/plugins/LayerView/LayerSliderLabel.qml new file mode 100644 index 0000000000..616af7e5be --- /dev/null +++ b/plugins/LayerView/LayerSliderLabel.qml @@ -0,0 +1,110 @@ +// Copyright (c) 2017 Ultimaker B.V. +// Cura is released under the terms of the LGPLv3 or higher. + +import QtQuick 2.2 +import QtQuick.Controls 1.2 +import QtQuick.Layouts 1.1 +import QtQuick.Controls.Styles 1.1 + +import UM 1.0 as UM +import Cura 1.0 as Cura + +Item { + id: sliderLabelRoot + + // custom properties + property var target // Qt.point + property real maximumValue: 100 + property real value: 0 + property var setValue // Function + property bool busy: false + + x: parent.x + y: parent.y + height: parent.height + visible: true + + UM.PointingRectangle { + x: sliderLabelRoot.x + y: sliderLabelRoot.y + target: sliderLabelRoot.target + arrowSize: UM.Theme.getSize("default_arrow").width + height: sliderLabelRoot.height + width: valueLabel.width + UM.Theme.getSize("default_margin").width + + color: UM.Theme.getColor("tool_panel_background") + borderColor: UM.Theme.getColor("lining") + borderWidth: UM.Theme.getSize("default_lining").width + + visible: sliderLabelRoot.visible + + Behavior on height { + NumberAnimation { + duration: 50 + } + } + + // catch all mouse events so they're not handled by underlying 3D scene + MouseArea { + anchors.fill: parent + } + + TextField { + id: valueLabel + + anchors { + left: parent.left + leftMargin: UM.Theme.getSize("default_margin").width / 2 + verticalCenter: parent.verticalCenter + } + + width: Math.max(UM.Theme.getSize("line").width * sliderLabelRoot.maximumValue.length + 2 * screenScaleFactor, 20 * screenScaleFactor) + + text: sliderLabelRoot.value + 1 // the current handle value, add 1 because layers is an array + horizontalAlignment: TextInput.AlignRight + + style: TextFieldStyle { + textColor: UM.Theme.getColor("setting_control_text") + font: UM.Theme.getFont("default") + background: Item { } + } + + onEditingFinished: { + + // Ensure that the cursor is at the first position. On some systems the text isn't fully visible + // Seems to have to do something with different dpi densities that QML doesn't quite handle. + // Another option would be to increase the size even further, but that gives pretty ugly results. + cursorPosition = 0 + + if (valueLabel.text != "") { + // -1 because we need to convert back to an array structure + sliderLabelRoot.setValue(parseInt(valueLabel.text) - 1) + } + } + + validator: IntValidator { + bottom: 1 + top: sliderLabelRoot.maximumValue + 1 // +1 because actual layers is an array + } + + Keys.onUpPressed: sliderLabelRoot.setValue(sliderLabelRoot.value + ((event.modifiers & Qt.ShiftModifier) ? 10 : 1)) + Keys.onDownPressed: sliderLabelRoot.setValue(sliderLabelRoot.value - ((event.modifiers & Qt.ShiftModifier) ? 10 : 1)) + } + + BusyIndicator { + id: busyIndicator + + anchors { + left: parent.right + leftMargin: UM.Theme.getSize("default_margin").width / 2 + verticalCenter: parent.verticalCenter + } + + width: sliderLabelRoot.height + height: width + + visible: sliderLabelRoot.busy + running: sliderLabelRoot.busy + } + } +} diff --git a/plugins/LayerView/LayerView.qml b/plugins/LayerView/LayerView.qml index 6bc7a23033..2a97bf8762 100755 --- a/plugins/LayerView/LayerView.qml +++ b/plugins/LayerView/LayerView.qml @@ -9,8 +9,6 @@ import QtQuick.Controls.Styles 1.1 import UM 1.0 as UM import Cura 1.0 as Cura -//import LayerSlider 1.0 - Item { id: base @@ -364,6 +362,7 @@ Item upperHandleColor: UM.Theme.getColor("slider_handle") lowerHandleColor: UM.Theme.getColor("slider_handle") rangeHandleColor: UM.Theme.getColor("slider_groove_fill") + handleLabelWidth: UM.Theme.getSize("slider_layerview_background").width layersVisible: UM.LayerView.layerActivity && CuraApplication.platformActivity ? true : false // update values when layer data changes @@ -379,82 +378,5 @@ Item slider.setUpperValue(UM.LayerView.currentLayer) } } - -// Item -// { - -// UM.PointingRectangle -// { -// x: parent.width - UM.Theme.getSize("slider_layerview_background").width / 2 - width; -// y: Math.floor(slider.activeHandle.y + slider.activeHandle.height / 2 - height / 2); -// -// target: Qt.point(parent.width, slider.activeHandle.y + slider.activeHandle.height / 2) -// arrowSize: UM.Theme.getSize("default_arrow").width -// -// height: UM.Theme.getSize("slider_handle").height + UM.Theme.getSize("default_margin").height -// width: valueLabel.width + UM.Theme.getSize("default_margin").width -// Behavior on height { NumberAnimation { duration: 50; } } -// -// color: UM.Theme.getColor("tool_panel_background") -// borderColor: UM.Theme.getColor("lining") -// borderWidth: UM.Theme.getSize("default_lining").width -// -// visible: slider.layersVisible -// -// MouseArea //Catch all mouse events (so scene doesnt handle them) -// { -// anchors.fill: parent -// } -// -// TextField -// { -// id: valueLabel -// property string maxValue: slider.maximumValue + 1 -// text: slider.activeHandle.value + 1 -// horizontalAlignment: TextInput.AlignRight; -// onEditingFinished: -// { -// // Ensure that the cursor is at the first position. On some systems the text isn't fully visible -// // Seems to have to do something with different dpi densities that QML doesn't quite handle. -// // Another option would be to increase the size even further, but that gives pretty ugly results. -// cursorPosition = 0; -// if(valueLabel.text != '') -// { -// slider.activeHandle.setValue(valueLabel.text - 1); -// } -// } -// validator: IntValidator { bottom: 1; top: slider.maximumValue + 1; } -// -// anchors.left: parent.left; -// anchors.leftMargin: UM.Theme.getSize("default_margin").width / 2; -// anchors.verticalCenter: parent.verticalCenter; -// -// width: Math.max(UM.Theme.getSize("line").width * maxValue.length + 2 * screenScaleFactor, 20 * screenScaleFactor); -// style: TextFieldStyle -// { -// textColor: UM.Theme.getColor("setting_control_text"); -// font: UM.Theme.getFont("default"); -// background: Item { } -// } -// -// Keys.onUpPressed: slider.activeHandle.setValue(slider.activeHandle.value + ((event.modifiers & Qt.ShiftModifier) ? 10 : 1)) -// Keys.onDownPressed: slider.activeHandle.setValue(slider.activeHandle.value - ((event.modifiers & Qt.ShiftModifier) ? 10 : 1)) -// } -// -// BusyIndicator -// { -// id: busyIndicator; -// anchors.left: parent.right; -// anchors.leftMargin: UM.Theme.getSize("default_margin").width / 2; -// anchors.verticalCenter: parent.verticalCenter; -// -// width: UM.Theme.getSize("slider_handle").height; -// height: width; -// -// running: UM.LayerView.busy; -// visible: UM.LayerView.busy; -// } -// } -// } } }