diff options
5 files changed, 60 insertions, 50 deletions
diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/Divider.qml b/examples/video/qmlvideofx/qml/qmlvideofx/Divider.qml index 7303797c9..92c1518fd 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/Divider.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/Divider.qml @@ -45,50 +45,29 @@ Rectangle { id: root anchors.fill: parent color: "transparent" - property alias value: grip.value + property alias value: slider.value property alias lineWidth: line.width - property alias gripSize: grip.width - - Rectangle { - id: grip - property real value: 0.5 - x: (value * parent.width) - width/2 - anchors.top: parent.top - width: 20 - height: width - radius: width/2 - color: "red" - - MouseArea { - anchors.fill: parent - - drag { - target: grip - axis: Drag.XAxis - minimumX: -parent.width/2 - maximumX: root.width - parent.width/2 - } - - onPositionChanged: { - if (drag.active) - updatePosition() - } - - onReleased: { - updatePosition() - } - - function updatePosition() { - value = (grip.x + grip.width/2) / grip.parent.width - } - } - } + property alias gripSize: slider.gripSize Rectangle { id: line anchors { top: parent.top; bottom: parent.bottom } - x: value * parent.width - (width / 2) + x: parent.value * parent.width - (width / 2) width: 2 color: "red" } + + Slider { + id: slider + increment: 0.0 + lineColor: "transparent" + fillColor: "transparent" + gripColor: "red" + anchors { + top: parent.top + topMargin: gripSize / 2 + left: parent.left + right: parent.right + } + } } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml b/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml index b58a73152..2571b6e65 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml @@ -92,6 +92,7 @@ Rectangle { right: parent.right rightMargin: 20 } + gripSize: root.gripSize value: model.value onValueChanged: view.model.setProperty(index, "value", value) } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml b/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml index b1f301c55..93c976c65 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml @@ -48,13 +48,16 @@ Rectangle { property alias value: grip.value property color fillColor: "white" property color lineColor: "black" - property alias gripSize: grip.width - property alias enabled: mouseArea.enabled + property color gripColor: "white" + property real gripSize: 20 + property real gripTolerance: 3.0 + property real increment: 0.1 + property bool enabled: true Rectangle { anchors { left: parent.left; right: parent.right; verticalCenter: parent.verticalCenter } height: 3 - color: displayedColor() + color: displayedColor(root.lineColor) Rectangle { anchors { fill: parent; margins: 1 } @@ -62,18 +65,35 @@ Rectangle { } } + MouseArea { + anchors.fill: parent + enabled: root.enabled + onClicked: { + if (parent.width) { + var newValue = mouse.x / parent.width + if (Math.abs(newValue - parent.value) > parent.increment) { + if (newValue > parent.value) + parent.value = Math.min(1.0, parent.value + parent.increment) + else + parent.value = Math.max(0.0, parent.value - parent.increment) + } + } + } + } + Rectangle { id: grip property real value: 0.5 x: (value * parent.width) - width/2 anchors.verticalCenter: parent.verticalCenter - width: 20 + width: root.gripTolerance * root.gripSize height: width radius: width/2 - color: displayedColor() + color: "transparent" MouseArea { id: mouseArea + enabled: root.enabled anchors.fill: parent drag { target: grip @@ -94,14 +114,16 @@ Rectangle { } Rectangle { - anchors { fill: parent; margins: 1 } + anchors.centerIn: parent + width: root.gripSize + height: width radius: width/2 - color: root.fillColor + color: root.gripColor } } - function displayedColor() { - var tint = Qt.rgba(fillColor.r, fillColor.g, fillColor.b, 0.25) - return enabled ? lineColor : Qt.tint(fillColor, tint) + function displayedColor(c) { + var tint = Qt.rgba(c.r, c.g, c.b, 0.25) + return enabled ? c : Qt.tint(c, tint) } } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml b/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml index 83a8dbe00..010ceba03 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml @@ -51,6 +51,11 @@ Rectangle { property bool perfMonitorsLogging: false property bool perfMonitorsVisible: false + QtObject { + id: d + property real gripSize: 20 + } + Rectangle { id: inner anchors.fill: parent @@ -65,6 +70,7 @@ Rectangle { right: effectSelectionPanel.left margins: 5 } + gripSize: d.gripSize width: 600 height: 600 } @@ -95,6 +101,7 @@ Rectangle { right: effectSelectionPanel.left margins: 20 } + gripSize: d.gripSize } EffectSelectionPanel { diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml b/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml index 91bdefe73..d7f2ccfc4 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml @@ -57,6 +57,7 @@ Rectangle { effectSelectionPanel.state == "shown" || videoFileBrowser.shown || imageFileBrowser.shown) + property real gripSize: 40 } // Create ScreenSaver element via Loader, so this app will still run if the @@ -100,7 +101,7 @@ Rectangle { Content { id: content anchors.fill: parent - gripSize: 40 + gripSize: d.gripSize onVideoFramePainted: performanceLoader.item.videoFramePainted() } @@ -112,7 +113,7 @@ Rectangle { margins: 10 } y: parent.height - gripSize: 40 + gripSize: d.gripSize states: [ State { |