<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space;" class="">
<br class="">
<div>
<blockquote type="cite" class="">
<div class="">On 11 Feb 2015, at 10:46, Luca Donaggio <<a href="mailto:donaggio@gmail.com" class="">donaggio@gmail.com</a>> wrote:</div>
<br class="Apple-interchange-newline">
<div class="">
<div dir="ltr" class="">
<div class="">
<div class="">
<div class="">Thank you Gunnar!<br class="">
<br class="">
</div>
I completely misunderstood the "layer" property of the Item element! I thought its purpouse was to apply an effect (or a texture) to an Item before rendering it on the scene, not to render any Item as an out-of-scene texture which could then be used as the
 source for a ShaderEffect! </div>
</div>
</div>
</div>
</blockquote>
<div><br class="">
</div>
<div>A convenient way of adding an effect is one usecase certainly. You can use it for other things though. The Qt 5.4 docs should have a fairly good explanation of how it works.  <a href="http://doc-snapshot.qt-project.org/qt5-5.4/qml-qtquick-item.html#item-layers" class="">http://doc-snapshot.qt-project.org/qt5-5.4/qml-qtquick-item.html#item-layers</a></div>
<br class="">
<blockquote type="cite" class="">
<div class="">
<div dir="ltr" class="">
<div class="">
<div class="">I thought that's what ShaderEffectSource does!<br class="">
</div>
</div>
</div>
</div>
</blockquote>
<div><br class="">
</div>
<div>layer is a more convenient ShaderEffectSource which doesn’t require you to add items into the sibling hierarchy.  </div>
<br class="">
<blockquote type="cite" class="">
<div class="">
<div dir="ltr" class="">
<div class="">
<div class=""><br class="">
</div>
In my defense I must say that Qt documentation is not very clear, nor there are many examples available :-)<br class="">
</div>
</div>
</div>
</blockquote>
<div><br class="">
</div>
<div>In pre Qt 5.4, yes. Very much so :) If you find the 5.4 docs lacking, please let me know.</div>
<br class="">
<blockquote type="cite" class="">
<div class="">
<div dir="ltr" class="">
<div class=""><br class="">
</div>
Just out of curiosity then: why do you think my first code example works in the Emulator?<br class="">
</div>
</div>
</blockquote>
<div><br class="">
</div>
<div>Using the FBO as a source texture while writing to it is supported on many graphics cards.</div>
<br class="">
<blockquote type="cite" class="">
<div class="">
<div dir="ltr" class=""><br class="">
</div>
<div class="gmail_extra"><br class="">
<div class="gmail_quote">On Tue, Feb 10, 2015 at 9:04 PM, Gunnar Sletta <span dir="ltr" class="">
<<a href="mailto:gunnar.sletta@jolla.com" target="_blank" class="">gunnar.sletta@jolla.com</a>></span> wrote:<br class="">
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div style="word-wrap:break-word" class="">
<div class="">Hi Luca, </div>
<div class=""><br class="">
</div>
<div class="">The application code is not doing the right thing :)</div>
<div class=""><br class="">
</div>
If the ShaderEffectSource depends on itself, it needs to have the “recursive” property set to true, and that is still probably not what you want. What you probably want is to set “layer.enabled: true; layer.smooth: true” on the gradientSource and then use it
 directly in the ShaderEffect. That should do what you want and comes without consequence.
<div class=""><br class="">
</div>
<div class="">cheers,</div>
<div class="">Gunnar
<div class="">
<div class="h5">
<div class="">
<div class=""><br class="">
</div>
<div class=""><br class="">
<div class="">
<blockquote type="cite" class="">
<div class="">On 10 Feb 2015, at 11:54, Luca Donaggio <<a href="mailto:donaggio@gmail.com" target="_blank" class="">donaggio@gmail.com</a>> wrote:</div>
<br class="">
<div class="">
<div dir="ltr" class="">
<div class="">Thanks Andrey.<br class="">
</div>
<div class=""><br class="">
I'll report this on TJC as well, trying to get more visibility. I hope that some Sailor will notice it: it's not that important, but it's disturbing nonetheless.<br class="">
</div>
<br class="">
</div>
<div class="gmail_extra"><br class="">
<div class="gmail_quote">On Tue, Feb 10, 2015 at 11:39 AM, Andrey Kozhevnikov <span dir="ltr" class="">
<<a href="mailto:coderusinbox@gmail.com" target="_blank" class="">coderusinbox@gmail.com</a>></span> wrote:<br class="">
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div bgcolor="#FFFFFF" text="#000000" class="">yes i can confirm this behaviour.<br class="">
<br class="">
<div class="">10.02.2015 15:24, Luca Donaggio пишет:<br class="">
</div>
<div class="">
<div class="">
<blockquote type="cite" class="">
<div dir="ltr" class="">
<div class="">
<div class="">Hi Andrey, thanks for your reply.<br class="">
<br class="">
</div>
Still, can you try both tests on your Jolla?<br class="">
</div>
The first shouldn't work, while the second does.<br class="">
</div>
<div class="gmail_extra"><br class="">
<div class="gmail_quote">On Tue, Feb 10, 2015 at 10:32 AM, Andrey Kozhevnikov <span dir="ltr" class="">
<<a href="mailto:coderusinbox@gmail.com" target="_blank" class="">coderusinbox@gmail.com</a>></span> wrote:<br class="">
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div bgcolor="#FFFFFF" text="#000000" class="">sorry, not using emulator at all.<br class="">
<br class="">
<div class="">10.02.2015 14:28, Luca Donaggio пишет:<br class="">
</div>
<blockquote type="cite" class="">
<div class="">
<div class="">
<div dir="ltr" class="">Anybody is willing to try my test code and confirm or deny my finding?<br class="">
</div>
<div class="gmail_extra"><br class="">
<div class="gmail_quote">On Fri, Feb 6, 2015 at 2:12 PM, Luca Donaggio <span dir="ltr" class="">
<<a href="mailto:donaggio@gmail.com" target="_blank" class="">donaggio@gmail.com</a>></span> wrote:<br class="">
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div dir="ltr" class="">The following code works fine in Emulator, changing the gradient of the Rectangle correctly updates the nested ShaderEffectSource and it is reflected on the ShaderEffect which uses it as its texture:<br class="">
<br class="">
Page {<br class="">
    id: page<br class="">
<br class="">
    SilicaFlickable {<br class="">
        anchors.fill: parent<br class="">
<br class="">
        contentHeight: column.height<br class="">
<br class="">
        Column {<br class="">
            id: column<br class="">
<br class="">
            anchors { top: parent.top; left: parent.left; right: parent.right; leftMargin: Theme.paddingLarge; rightMargin: Theme.paddingLarge; }<br class="">
            spacing: Theme.paddingLarge<br class="">
<br class="">
            PageHeader {<br class="">
                title: qsTr("ShaderEffect Test")<br class="">
            }<br class="">
<br class="">
            Row {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                spacing: Theme.paddingLarge<br class="">
<br class="">
                Column {<br class="">
                    spacing: Theme.paddingSmall<br class="">
<br class="">
                    Rectangle {<br class="">
                        id: gradientSource<br class="">
<br class="">
                        property list<Gradient> gradients: [<br class="">
                            Gradient {<br class="">
                                GradientStop { position: 0.0; color: "black"; }<br class="">
                                GradientStop { position: 1.0; color: "blue"; }<br class="">
                            },<br class="">
<br class="">
                            Gradient {<br class="">
                                GradientStop { position: 0.0; color: "black"; }<br class="">
                                GradientStop { position: 1.0; color: "red"; }<br class="">
                            }<br class="">
                        ]<br class="">
<br class="">
                        width: 100<br class="">
                        height: 100<br class="">
<br class="">
                        gradient: gradients[0]<br class="">
<br class="">
                        ShaderEffectSource {<br class="">
                            id: gradientTexture<br class="">
<br class="">
                            anchors.fill: parent<br class="">
                            sourceItem: gradientSource<br class="">
                            hideSource: false<br class="">
                            live: true<br class="">
                        }<br class="">
                    }<br class="">
<br class="">
                    Label {<br class="">
                        font.pixelSize: Theme.fontSizeExtraSmall<br class="">
                        wrapMode: Text.WordWrap<br class="">
                        text: "Rectangle\nShaderEffectSource"<br class="">
                    }<br class="">
                }<br class="">
<br class="">
                Column {<br class="">
                    spacing: Theme.paddingSmall<br class="">
<br class="">
                    ShaderEffect {<br class="">
                        property variant source: gradientTexture<br class="">
<br class="">
                        width: 100<br class="">
                        height: 100<br class="">
<br class="">
                        blending: false<br class="">
                        cullMode: ShaderEffect.BackFaceCulling<br class="">
                        fragmentShader: "<br class="">
                            varying highp vec2 qt_TexCoord0;<br class="">
                            uniform lowp float qt_Opacity;<br class="">
                            uniform sampler2D source;<br class="">
<br class="">
                            void main() {<br class="">
                                gl_FragColor = texture2D(source, qt_TexCoord0) * qt_Opacity;<br class="">
                            }"<br class="">
                    }<br class="">
<br class="">
                    Label {<br class="">
                        font.pixelSize: Theme.fontSizeExtraSmall<br class="">
                        text: "ShaderEffect"<br class="">
                    }<br class="">
                }<br class="">
            }<br class="">
<br class="">
            Button {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                text: "Blue gradient"<br class="">
<br class="">
                onClicked: gradientSource.gradient = gradientSource.gradients[0]<br class="">
            }<br class="">
<br class="">
            Button {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                text: "Red gradient"<br class="">
<br class="">
                onClicked: gradientSource.gradient = gradientSource.gradients[1]<br class="">
            }<br class="">
        }<br class="">
    }<br class="">
}<br class="">
<br clear="all" class="">
<div class="">It doesn't work on device though (changing Reactangle's gradient doesn't update the ShaderEffectSource).<br class="">
<br class="">
</div>
<div class="">Un-nesting the ShaderEffectSource from its source item (the Rectangle) works fine both on emulator and on device:<br class="">
<br class="">
Page {<br class="">
    id: page<br class="">
<br class="">
    SilicaFlickable {<br class="">
        anchors.fill: parent<br class="">
<br class="">
        contentHeight: column.height<br class="">
<br class="">
        Column {<br class="">
            id: column<br class="">
<br class="">
            anchors { top: parent.top; left: parent.left; right: parent.right; leftMargin: Theme.paddingLarge; rightMargin: Theme.paddingLarge; }<br class="">
            spacing: Theme.paddingLarge<br class="">
<br class="">
            PageHeader {<br class="">
                title: qsTr("ShaderEffect Test")<br class="">
            }<br class="">
<br class="">
            Row {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                spacing: Theme.paddingLarge<br class="">
<br class="">
                Column {<br class="">
                    spacing: Theme.paddingSmall<br class="">
<br class="">
                    Rectangle {<br class="">
                        id: gradientSource<br class="">
<br class="">
                        property list<Gradient> gradients: [<br class="">
                            Gradient {<br class="">
                                GradientStop { position: 0.0; color: "black"; }<br class="">
                                GradientStop { position: 1.0; color: "blue"; }<br class="">
                            },<br class="">
<br class="">
                            Gradient {<br class="">
                                GradientStop { position: 0.0; color: "black"; }<br class="">
                                GradientStop { position: 1.0; color: "red"; }<br class="">
                            }<br class="">
                        ]<br class="">
<br class="">
                        width: 100<br class="">
                        height: 100<br class="">
<br class="">
                        gradient: gradients[0]<br class="">
                    }<br class="">
<br class="">
                    Label {<br class="">
                        font.pixelSize: Theme.fontSizeExtraSmall<br class="">
                        text: "Rectangle"<br class="">
                    }<br class="">
                }<br class="">
<br class="">
                Column {<br class="">
                    spacing: Theme.paddingSmall<br class="">
<br class="">
                    ShaderEffectSource {<br class="">
                        id: gradientTexture<br class="">
<br class="">
                        width: 100<br class="">
                        height: 100<br class="">
                        sourceItem: gradientSource<br class="">
                        hideSource: false<br class="">
                        live: true<br class="">
                    }<br class="">
<br class="">
                    Label {<br class="">
                        font.pixelSize: Theme.fontSizeExtraSmall<br class="">
                        text: "ShaderEffectSource"<br class="">
                    }<br class="">
                }<br class="">
<br class="">
                Column {<br class="">
                    spacing: Theme.paddingSmall<br class="">
<br class="">
                    ShaderEffect {<br class="">
                        property variant source: gradientTexture<br class="">
<br class="">
                        width: 100<br class="">
                        height: 100<br class="">
<br class="">
                        blending: false<br class="">
                        cullMode: ShaderEffect.BackFaceCulling<br class="">
                        fragmentShader: "<br class="">
                            varying highp vec2 qt_TexCoord0;<br class="">
                            uniform lowp float qt_Opacity;<br class="">
                            uniform sampler2D source;<br class="">
<br class="">
                            void main() {<br class="">
                                gl_FragColor = texture2D(source, qt_TexCoord0) * qt_Opacity;<br class="">
                            }"<br class="">
                    }<br class="">
<br class="">
                    Label {<br class="">
                        font.pixelSize: Theme.fontSizeExtraSmall<br class="">
                        text: "ShaderEffect"<br class="">
                    }<br class="">
                }<br class="">
            }<br class="">
<br class="">
            Button {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                text: "Blue gradient"<br class="">
<br class="">
                onClicked: gradientSource.gradient = gradientSource.gradients[0]<br class="">
            }<br class="">
<br class="">
            Button {<br class="">
                anchors.horizontalCenter: parent.horizontalCenter<br class="">
                text: "Red gradient"<br class="">
<br class="">
                onClicked: gradientSource.gradient = gradientSource.gradients[1]<br class="">
            }<br class="">
        }<br class="">
    }<br class="">
}<br class="">
<br class="">
</div>
<div class="">Is it a bug?<span class=""><font color="#888888" class=""><br class="">
</font></span></div>
<span class=""><font color="#888888" class="">
<div class=""><br class="">
-- <br class="">
<div class="">Luca Donaggio</div>
</div>
</font></span></div>
</blockquote>
</div>
<br class="">
<br clear="all" class="">
<br class="">
-- <br class="">
<div class="">Luca Donaggio</div>
</div>
<br class="">
<fieldset class=""></fieldset> <br class="">
</div>
</div>
<pre class="">_______________________________________________
<a href="http://sailfishos.org/" target="_blank" class="">SailfishOS.org</a> Devel mailing list
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" target="_blank" class="">devel-unsubscribe@lists.sailfishos.org</a></pre>
</blockquote>
<br class="">
</div>
<br class="">
_______________________________________________<br class="">
<a href="http://sailfishos.org/" target="_blank" class="">SailfishOS.org</a> Devel mailing list<br class="">
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" target="_blank" class="">
devel-unsubscribe@lists.sailfishos.org</a><br class="">
</blockquote>
</div>
<br class="">
<br clear="all" class="">
<br class="">
-- <br class="">
<div class="">Luca Donaggio</div>
</div>
<br class="">
<fieldset class=""></fieldset> <br class="">
<pre class="">_______________________________________________
<a href="http://sailfishos.org/" target="_blank" class="">SailfishOS.org</a> Devel mailing list
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" target="_blank" class="">devel-unsubscribe@lists.sailfishos.org</a></pre>
</blockquote>
<br class="">
</div>
</div>
</div>
<br class="">
_______________________________________________<br class="">
<a href="http://sailfishos.org/" target="_blank" class="">SailfishOS.org</a> Devel mailing list<br class="">
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" target="_blank" class="">
devel-unsubscribe@lists.sailfishos.org</a><br class="">
</blockquote>
</div>
<br class="">
<br clear="all" class="">
<br class="">
-- <br class="">
<div class="">Luca Donaggio</div>
</div>
_______________________________________________<br class="">
<a href="http://sailfishos.org/" target="_blank" class="">SailfishOS.org</a> Devel mailing list<br class="">
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" target="_blank" class="">
devel-unsubscribe@lists.sailfishos.org</a></div>
</blockquote>
</div>
<br class="">
</div>
</div>
</div>
</div>
</div>
</div>
<br class="">
_______________________________________________<br class="">
<a href="http://SailfishOS.org" class="">SailfishOS.org</a> Devel mailing list<br class="">
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" class="">
devel-unsubscribe@lists.sailfishos.org</a><br class="">
</blockquote>
</div>
<br class="">
<br clear="all" class="">
<br class="">
-- <br class="">
<div class="gmail_signature">Luca Donaggio</div>
</div>
_______________________________________________<br class="">
<a href="http://SailfishOS.org" class="">SailfishOS.org</a> Devel mailing list<br class="">
To unsubscribe, please send a mail to <a href="mailto:devel-unsubscribe@lists.sailfishos.org" class="">
devel-unsubscribe@lists.sailfishos.org</a></div>
</blockquote>
</div>
<br class="">
</body>
</html>