QML:如何将着色器效果与QtGraphic效果混合

QML: How to mix a shader effect with a QtGraphical Effect?

本文关键字：QtGraphic 混合 QML      更新时间：2023-10-16

我试图实现的背景图像上有两种效果：波浪（着色器）效果和着色（QtGraphical）效果。 不幸的是，它们只单独出现（即一个图像是我背景上的波浪效果，另一个只是我背景的着色）。

我想将两者合并为一张图像，但已经使用了几个小时。 有人知道怎么做吗？

Colorize {
    anchors.fill: background
    source: background
    hue: 0.0
    saturation: 0.5
    lightness: -0.2
}
ShaderEffect {
    height: intro_over ? 0 : parent.height;
    width:  intro_over ? 0 :  parent.width;
    property variant source: background
    property real frequency: 8
    property real amplitude: 0.1
    property real time: 0.0
    // Animation stuff
    fragmentShader: "
                varying highp vec2 qt_TexCoord0;
                uniform sampler2D source;
                uniform lowp float qt_Opacity;
                uniform highp float frequency;
                uniform highp float amplitude;
                uniform highp float time;
                void main() {
                    highp vec2 pulse = sin(time - frequency * qt_TexCoord0);
                    highp vec2 coord = qt_TexCoord0 + amplitude * vec2(pulse.x, -pulse.x);
                    gl_FragColor = texture2D(source, coord) * qt_Opacity;
                }"
}

使用 ShaderEffectSource .在您的示例中，为Colorize项添加一个id，并创建一个ShaderEffectSource作为ShaderEffect的源：

Colorize {
    id: colorize
    anchors.fill: background
    source: background
    hue: 0.0
    saturation: 0.5
    lightness: -0.2
}
ShaderEffect {
   height: intro_over ? 0 : parent.height;
    width:  intro_over ? 0 :  parent.width;
    property variant source: ShaderEffectSource {
        sourceItem: colorize
        hideSource: true
    }
    property real frequency: 8
    property real amplitude: 0.1
    property real time: 0.0
}
相关文章：