diff options
author | Gareth Stockwell <gareth.stockwell@accenture.com> | 2011-12-20 13:51:34 +0000 |
---|---|---|
committer | Qt by Nokia <qt-info@nokia.com> | 2011-12-22 02:29:18 +0100 |
commit | 9092b1ae46d999fb8b971386905d64eba4f9b60d (patch) | |
tree | 4a7eac0c1bd5023f32475d90a3c2b242ce9225fa /examples/video/qmlvideofx/qml/qmlvideofx | |
parent | febe3984003dcd9313ae451ee2cc23ac15630977 (diff) |
Express qmlvideofx effect parameters declaratively
Each effect item now exposes a ListModel property which describes the
set of user-controllable parameters. This model is used by the
ParameterPanel component to generate a ListView whose delegate displays
the parameter name and a slider.
Change-Id: Ib26877fe434d8b746ef621e0b4adbcbe1ed9aaa8
Reviewed-by: Michael Goddard <michael.goddard@nokia.com>
Diffstat (limited to 'examples/video/qmlvideofx/qml/qmlvideofx')
28 files changed, 223 insertions, 220 deletions
diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/Content.qml b/examples/video/qmlvideofx/qml/qmlvideofx/Content.qml index 7e1a69f90..04f6b5881 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/Content.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/Content.qml @@ -90,7 +90,7 @@ Rectangle { effectLoader.item.targetHeight = root.height updateSource() effectLoader.item.source = theSource - divider.visible = effectLoader.item.supportsDivider + divider.visible = effectLoader.item.divider updateDivider() } @@ -101,7 +101,7 @@ Rectangle { } function updateDivider() { - if (effectLoader.item && effectLoader.item.supportsDivider) + if (effectLoader.item && effectLoader.item.divider) effectLoader.item.dividerValue = divider.value } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/Effect.qml b/examples/video/qmlvideofx/qml/qmlvideofx/Effect.qml index 9a9f598a7..3cc217512 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/Effect.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/Effect.qml @@ -43,8 +43,9 @@ import QtQuick 2.0 ShaderEffect { property variant source - property int numParameters: 0 - property bool supportsDivider: false + property ListModel parameters: ListModel { } + property bool divider: true + property real dividerValue: 0.5 property real targetWidth: 0 property real targetHeight: 0 property string fragmentShaderFilename diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectBillboard.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectBillboard.qml index d0583206b..e10b65944 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectBillboard.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectBillboard.qml @@ -42,13 +42,15 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "grid spacing" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - property real grid: 10.0 * param1Value + // Transform slider values, and bind result to shader uniforms + property real grid: parameters.get(0).value * 10 property real step_x: 0.0015625 property real step_y: targetHeight ? (step_x * targetWidth / targetHeight) : 0.0 diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectBlackAndWhite.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectBlackAndWhite.qml index 7009cb4e2..6eb0fcc41 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectBlackAndWhite.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectBlackAndWhite.qml @@ -42,12 +42,15 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "threshold" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 + // Transform slider values, and bind result to shader uniforms + property real threshold: parameters.get(0).value fragmentShaderFilename: "shaders/blackandwhite.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectEmboss.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectEmboss.qml index 3426d78d9..0785774ae 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectEmboss.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectEmboss.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/emboss.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectGaussianBlur.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectGaussianBlur.qml index 5610365a7..2e76de3eb 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectGaussianBlur.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectGaussianBlur.qml @@ -44,23 +44,25 @@ import QtQuick 2.0 Item { -id: root + id: root + property bool divider: true + property real dividerValue: 0.5 + property ListModel parameters: ListModel { + ListElement { + name: "radius" + value: 0.5 + } + } + property alias targetWidth: verticalShader.targetWidth property alias targetHeight: verticalShader.targetHeight property alias source: verticalShader.source - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true - - property real param1Value: 0.5 - property real dividerValue: 0.5 - Effect { id: verticalShader anchors.fill: parent property real dividerValue: parent.dividerValue - property real blurSize: 4.0 * parent.param1Value / targetHeight + property real blurSize: 4.0 * parent.parameters.get(0).value / targetHeight fragmentShaderFilename: "shaders/gaussianblur_v.fsh" } @@ -68,7 +70,7 @@ id: root id: horizontalShader anchors.fill: parent property real dividerValue: parent.dividerValue - property real blurSize: 4.0 * parent.param1Value / targetWidth + property real blurSize: 4.0 * parent.parameters.get(0).value / targetWidth fragmentShaderFilename: "shaders/gaussianblur_h.fsh" source: horizontalShaderSource diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectGlow.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectGlow.qml index bb7321619..c3be692fe 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectGlow.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectGlow.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/glow.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectIsolate.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectIsolate.qml index d51287752..8bc4d9f69 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectIsolate.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectIsolate.qml @@ -42,16 +42,20 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 2 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "hue" + value: 0.5 + } + ListElement { + name: "width" + value: 0.5 + } + } - property real param1Value: 0.5 - property real param2Value: 0.5 - property real dividerValue: 0.5 - - property real targetHue: 360.0 * param1Value - property real windowWidth: 60.0 * param2Value + // Transform slider values, and bind result to shader uniforms + property real targetHue: parameters.get(0).value * 360 + property real windowWidth: parameters.get(1).value * 60 fragmentShaderFilename: "shaders/isolate.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectMagnify.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectMagnify.qml index a5ad4b73a..27d0af55c 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectMagnify.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectMagnify.qml @@ -43,20 +43,25 @@ import QtQuick 2.0 Effect { id: root - - // Constant properties which must be supported by every effect - property int numParameters: 2 - property bool supportsDivider: false - - property real param1Value: 0.5 - property real radius: 200 * param1Value - - property real param2Value: 0.5 - property real diffractionIndex: param2Value + divider: false + parameters: ListModel { + ListElement { + name: "radius" + value: 0.5 + } + ListElement { + name: "diffraction" + value: 0.5 + } + } property real posX: -1 property real posY: -1 + // Transform slider values, and bind result to shader uniforms + property real radius: parameters.get(0).value * 100 + property real diffractionIndex: parameters.get(1).value + onTargetWidthChanged: if (posX == -1) posX = targetWidth / 2 onTargetHeightChanged: if (posY == -1) posY = targetHeight / 2 diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPageCurl.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPageCurl.qml index 9a7335faf..ace4b36e1 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPageCurl.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPageCurl.qml @@ -42,14 +42,16 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: false + divider: false + parameters: ListModel { + ListElement { + name: "extent" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real curlExtent: 1.0 - param1Value + // Transform slider values, and bind result to shader uniforms + property real curlExtent: 1.0 - parameters.get(0).value fragmentShaderFilename: "shaders/pagecurl.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPassThrough.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPassThrough.qml index c9a081a7e..b45a5556b 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPassThrough.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPassThrough.qml @@ -42,5 +42,5 @@ import QtQuick 2.0 Effect { - + divider: false } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPixelate.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPixelate.qml index 1890ee052..62085a141 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPixelate.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPixelate.qml @@ -42,14 +42,15 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "granularity" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real granularity: param1Value * 20 + // Transform slider values, and bind result to shader uniforms + property real granularity: parameters.get(0).value * 20 fragmentShaderFilename: "shaders/pixelate.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPosterize.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPosterize.qml index 358369237..cb97c8ce3 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectPosterize.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectPosterize.qml @@ -42,14 +42,16 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "gamma" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 + // Transform slider values, and bind result to shader uniforms + property real gamma: parameters.get(0).value - property real gamma: param1Value property real numColors: 8.0 fragmentShaderFilename: "shaders/posterize.fsh" diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectRipple.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectRipple.qml index 12ed139fd..2122a27a2 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectRipple.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectRipple.qml @@ -42,20 +42,23 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 2 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "amplitude" + value: 0.5 + } + ListElement { + name: "frequency" + value: 0.5 + } + } - property real param1Value: 0.5 - property real param2Value: 0.5 - property real dividerValue: 0.5 + // Transform slider values, and bind result to shader uniforms + property real amplitude: parameters.get(0).value * 0.03 + property real n: parameters.get(1).value * 7 property real time: 0 - NumberAnimation on time { loops: Animation.Infinite; from: 0; to: Math.PI * 2; duration: 600 } - property real amplitude: param1Value * 0.03 - property real n: param2Value * 7 - fragmentShaderFilename: "shaders/ripple.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSepia.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSepia.qml index 13958940f..9394fb7d2 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSepia.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSepia.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/sepia.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSharpen.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSharpen.qml index c5a8659a0..642db47c4 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSharpen.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSharpen.qml @@ -42,14 +42,15 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "sharpness" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real amount: 18.0 * param1Value + // Transform slider values, and bind result to shader uniforms + property real amount: parameters.get(0).value * 18 fragmentShaderFilename: "shaders/sharpen.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectShockwave.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectShockwave.qml index ac12cb9b6..4d1092f15 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectShockwave.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectShockwave.qml @@ -43,15 +43,16 @@ import QtQuick 2.0 Effect { id: root + parameters: ListModel { + ListElement { + name: "amplitude" + value: 0.5 + } + } - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true - - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real granularity: param1Value * 20 + // Transform slider values, and bind result to shader uniforms + property real granularity: parameters.get(0).value * 20 + property real weight: parameters.get(0).value property real centerX property real centerY @@ -75,7 +76,5 @@ Effect { } } - property real weight: param1Value - fragmentShaderFilename: "shaders/shockwave.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection1.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection1.qml index e95737931..465686e21 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection1.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection1.qml @@ -42,15 +42,16 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "threshold" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real mixLevel: param1Value - property real targetSize: 250 - (200 * param1Value) // TODO: fix ... + // Transform slider values, and bind result to shader uniforms + property real mixLevel: parameters.get(0).value + property real targetSize: 250 - (200 * mixLevel) // TODO: fix ... property real resS: targetSize property real resT: targetSize diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection2.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection2.qml index 5061b2852..f0b6744db 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection2.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectSobelEdgeDetection2.qml @@ -42,14 +42,15 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "threshold" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real weight: param1Value + // Transform slider values, and bind result to shader uniforms + property real weight: parameters.get(0).value fragmentShaderFilename: "shaders/sobeledgedetection2.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectTiltShift.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectTiltShift.qml index 8a81ec55d..31315f7ef 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectTiltShift.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectTiltShift.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/tiltshift.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectToon.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectToon.qml index 9b8235c82..6e49b03c4 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectToon.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectToon.qml @@ -42,15 +42,16 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "threshold" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 - - property real threshold: param1Value - property real targetSize: 250 - (200 * param1Value) // TODO: fix ... + // Transform slider values, and bind result to shader uniforms + property real threshold: parameters.get(0).value + property real targetSize: 250 - (200 * threshold) // TODO: fix ... property real resS: targetSize property real resT: targetSize diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectVignette.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectVignette.qml index 65b099d4e..7203705ec 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectVignette.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectVignette.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/vignette.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectWarhol.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectWarhol.qml index 39ddc4e93..a60c7cce7 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectWarhol.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectWarhol.qml @@ -42,11 +42,5 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 0 - property bool supportsDivider: true - - property real dividerValue: 0.5 - fragmentShaderFilename: "shaders/warhol.fsh" } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/EffectWobble.qml b/examples/video/qmlvideofx/qml/qmlvideofx/EffectWobble.qml index d1b7491bd..40d2614e4 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/EffectWobble.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/EffectWobble.qml @@ -42,14 +42,16 @@ import QtQuick 2.0 Effect { - // Constant properties which must be supported by every effect - property int numParameters: 1 - property bool supportsDivider: true + parameters: ListModel { + ListElement { + name: "amplitude" + value: 0.5 + } + } - property real param1Value: 0.5 - property real dividerValue: 0.5 + // Transform slider values, and bind result to shader uniforms + property real amplitude: parameters.get(0).value * 0.05 - property real amplitude: param1Value * 0.05 property real frequency: 20 property real time: 0 diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml b/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml index 43e245bf6..a6ff7d09c 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/ParameterPanel.qml @@ -44,44 +44,64 @@ import QtQuick 2.0 Rectangle { id: root color: "transparent" - height: numParameters * sliderHeight + (numParameters + 1) * spacing - visible: numParameters > 0 + height: view.model.count * sliderHeight property color lineColor: "black" - property int numParameters: 1 - property alias param1Value: slider1.value - property alias param2Value: slider2.value - property bool enabled: true property real gripSize: 25 property real spacing: 10 property real sliderHeight: 40 - Slider { - id: slider1 - color: "white" - enabled: parent.enabled - gripSize: root.gripSize - height: sliderHeight - visible: enabled - anchors { - left: parent.left - right: parent.right - bottom: (root.numParameters == 1) ? root.bottom : slider2.top - margins: root.spacing - } + property ListModel model: ListModel { } + + Rectangle { + anchors.fill: parent + color: "black" + opacity: 0.5 + radius: 10 } - Slider { - id: slider2 - color: "white" - enabled: parent.enabled && root.numParameters >= 2 - gripSize: root.gripSize - height: sliderHeight - visible: enabled - anchors { - left: parent.left - right: parent.right - bottom: root.bottom - margins: root.spacing + Component { + id: editDelegate + + Rectangle { + id: delegate + width: parent.width + height: root.sliderHeight + color: "transparent" + + Text { + id: text + text: name + color: "white" + anchors { + top: parent.top + bottom: parent.bottom + left: parent.left + } + font.pixelSize: 0.5 * parent.height + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + width: 150 + } + + Slider { + anchors { + top: parent.top + bottom: parent.bottom + left: text.right + leftMargin: 20 + right: parent.right + rightMargin: 20 + } + value: model.value + onValueChanged: view.model.setProperty(index, "value", value) + } } } + + ListView { + id: view + anchors.fill: parent + model: root.model + delegate: editDelegate + } } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml b/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml index c19a9df3b..ea3cd6dba 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/Slider.qml @@ -43,9 +43,10 @@ import QtQuick 2.0 Rectangle { id: root - color: "white" + color: "transparent" radius: 5 property alias value: grip.value + property color fillColor: "white" property color lineColor: "black" property alias gripSize: grip.width property alias enabled: mouseArea.enabled @@ -57,7 +58,7 @@ Rectangle { Rectangle { anchors { fill: parent; margins: 1 } - color: root.color + color: root.fillColor } } @@ -95,12 +96,12 @@ Rectangle { Rectangle { anchors { fill: parent; margins: 1 } radius: width/2 - color: root.color + color: root.fillColor } } function displayedColor() { - var tint = Qt.rgba(color.r, color.g, color.b, 0.25) - return enabled ? lineColor : Qt.tint(color, tint) + var tint = Qt.rgba(fillColor.r, fillColor.g, fillColor.b, 0.25) + return enabled ? lineColor : Qt.tint(fillColor, tint) } } diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml b/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml index 0c24d0dc2..a1a725162 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/main-largescreen.qml @@ -94,15 +94,12 @@ Rectangle { ParameterPanel { id: parameterPanel - enabled: numParameters >= 1 - numParameters: content.effect ? content.effect.numParameters : 0 anchors { - top: content.bottom left: parent.left bottom: parent.bottom + right: effectSelectionPanel.left + margins: 20 } - width: content.width - onParam1ValueChanged: updateParameters() } EffectSelectionPanel { @@ -117,7 +114,7 @@ Rectangle { itemHeight: 40 onEffectSourceChanged: { content.effectSource = effectSource - updateParameters() + parameterPanel.model = content.effect.parameters } } @@ -160,11 +157,6 @@ Rectangle { performanceLoader.item.qmlFramePainted() } - function updateParameters() { - if (content.effect.numParameters >= 1) - content.effect.param1Value = parameterPanel.param1Value - } - function openImage() { d.openFileType = "image" showFileBrowser("../../images") diff --git a/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml b/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml index 922c57d85..5667a294f 100644 --- a/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml +++ b/examples/video/qmlvideofx/qml/qmlvideofx/main-smallscreen.qml @@ -71,7 +71,11 @@ Rectangle { } onLoaded: { item.parent = root - item.anchors.fill = root + item.anchors.top = root.top + item.anchors.topMargin = 100 + item.anchors.left = root.left + item.anchors.right = root.right + item.anchors.bottom = root.verticalCenter item.logging = root.perfMonitorsLogging item.displayed = root.perfMonitorsVisible item.init() @@ -92,15 +96,12 @@ Rectangle { ParameterPanel { id: parameterPanel - anchors { left: parent.left; right: parent.right; margins: 10 } - numParameters: content.effect.numParameters y: parent.height - opacity: 0.75 gripSize: 40 states: [ @@ -125,10 +126,8 @@ Rectangle { } ] - enabled: content.effect.numParameters >= 1 && effectSelectionPanel.state != "shown" + enabled: false state: enabled ? "shown" : "baseState" - onParam1ValueChanged: updateParameters() - onParam2ValueChanged: updateParameters() } EffectSelectionPanel { @@ -168,8 +167,12 @@ Rectangle { onEffectSourceChanged: { content.effectSource = effectSource - parameterPanel.numParameters = content.effect.numParameters - updateParameters() + if (content.effect.parameters.count) { + parameterPanel.model = content.effect.parameters + parameterPanel.enabled = true + } else { + parameterPanel.enabled = false + } } onClicked: state = "baseState" @@ -364,13 +367,6 @@ Rectangle { performanceLoader.item.qmlFramePainted() } - function updateParameters() { - if (content.effect.numParameters >= 1) - content.effect.param1Value = parameterPanel.param1Value - if (content.effect.numParameters >= 2) - content.effect.param2Value = parameterPanel.param2Value - } - function openImage() { fileOpenContainer.state = "baseState" d.openFileType = "image" |