Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Combining GraphicalEffect with custom Shader Effect
Forum Updated to NodeBB v4.3 + New Features

Combining GraphicalEffect with custom Shader Effect

Scheduled Pinned Locked Moved QML and Qt Quick
2 Posts 2 Posters 809 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • A Offline
    A Offline
    awais
    wrote on last edited by
    #1

    I am trying to use the Glow effect on the output of a custom shader effect (Stoke/outline).
    Below is the code that i am trying to use but it looks like we can not combine the custom shader with graphical effect.

    @
    Image {
    id:icon
    x:50
    y:200
    width:130
    height:130
    source: "Images/icnRadio.png"
    visible: false
    }

    ShaderEffect {
        id: stroke
        visible:true
        x:50
        y:200
        width: 130
        height: 130
        property variant source: icon
        property variant delta: Qt.size(0.5 / width, 0.5 / height)
        fragmentShader: "
            uniform sampler2D source;
            uniform highp vec2 delta;
            uniform highp float qt_Opacity;
            varying highp vec2 qt_TexCoord0;
            void main() {
                lowp vec4 tl = texture2D(source, qt_TexCoord0 - delta);
                lowp vec4 tr = texture2D(source, qt_TexCoord0 + vec2(delta.x, -delta.y));
                lowp vec4 bl = texture2D(source, qt_TexCoord0 - vec2(delta.x, -delta.y));
                lowp vec4 br = texture2D(source, qt_TexCoord0 + delta);
                lowp vec4 gx = (tl + bl) - (tr + br);
                lowp vec4 gy = (tl + tr) - (bl + br);
                gl_FragColor.xyz = vec3(0.,0.,0);
                gl_FragColor.w = clamp(dot(sqrt(gx * gx + gy * gy), vec4(1.)), 0., 1.) * qt_Opacity;
                gl_FragColor = vec4(clamp(dot(sqrt(gx * gx + gy * gy), vec4(1.)), 0., 1.) * qt_Opacity);
            }"
    }
    
    Glow {
        width:130
        height:130
        anchors.fill: stroke
        radius: 16
        samples: 32
        color: "red"
        source: icon
        spread:0.5
        visible:true
        } 
    

    @
    Only one effect is applied on the icon either its stoke/outline or Glow. But i want in this way, First the stroke/outline shader effect is applied on the icon image and then on its output the Glow effect is applied.
    Is it possible to do it?

    1 Reply Last reply
    0
    • p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      Hi,

      I think you need to set source of Glow to stroke instead of icon.

      157

      1 Reply Last reply
      0

      • Login

      • Login or register to search.
      • First post
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved