Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

ShaderEffect on layer create weird artifacts on text



  • Hi,

    I am trying to apply an effect on a Item and its children. To do so I'm using a layer with a ShaderEffect but even when I'm just passing the source texture through I get a different result than if I had not used an effect.

    Here is the code I use:

    import QtQuick 2.15
    import QtGraphicalEffects 1.15
    
    Item {
        id: root
    
        layer.enabled: true
        layer.samplerName: 'source'
        layer.effect: ShaderEffect {
            fragmentShader: "
                #version 330 core // My whole application is using core 3.3 so that matches the global profile
    
                uniform highp sampler2D source;
                uniform lowp float qt_Opacity;
    
                in highp vec2 qt_TexCoord0;
                out highp vec4 out_color;
    
                void main() {
                    // Just pass the source texture through and apply opacity (does not change anything if I do not multiply by the opacity)
                    out_color = texture(source, qt_TexCoord0) * qt_Opacity;
                }
            "
        }
    }
    

    And then at the point of usage (MyItem is centered in an orange window)

    MyItem {
        width: 350
        height: 200
    
        Rectangle {
            width: 50
            height: 50
            x: 3
            y: 3
            gradient: Gradient {
                GradientStop { position: 0.0; color: "red" }
                GradientStop { position: 1.0; color: Qt.hsla(1.0, 0, 0, 0) }
            }
        }
    
        Text {
            text: 'This is a test text. See if the text looks "normal"'
            color: 'red'
        }
    }
    

    Then if I disable the layer I get the following image that looks correct and how I would expect it to look. (This is my ground truth):
    c8ba0430-0128-4970-bf56-065e22d6fe99-image.png

    But when I enable the layer I get the following:
    511cb004-c3c1-46f3-af74-fd4e2b69b9ba-image.png

    The gradient is preserved correctly but I get "dark" pixels on the text and it is more visible over the gradient then it should be.

    Am I wrong to assume that just passing the source texture through should result in the exact same result as if there was no shader effect? What have I done wrong and how can I fix that? This effect will be used in positions where there will be a lot of text so it needs to preserve its look.

    Thanks

    edit:
    Adding my configuration in case it is important:
    Qt Version: 5.15.2
    OS: Ubuntu 21.04 on X11



  • I tested it on both Intel & Nvidia GPUs and I can see the issue on both hardware.

    What's weird is it that it looks like the kind of issues that would happen when something is wrong in the premultiplied alpha but the documentation says that the input texture is already premultiplied and the output FBO should be premultiplied. So by directly passing the input to the output it should work out okay.


Log in to reply