Как смешивать маску изображения? - PullRequest
1 голос

Как я могу применить такую ​​маску

mask

, чтобы получить такой эффект, как боке

bokeh

необходимо размыть края в маске и примените к текстуре изображения. Как это сделать?

Вершинный шейдер:

attribute vec4 a_Position;

    void main()
    {
        gl_Position = a_Position;
    }

Фрагментный шейдер:

precision lowp float;

    uniform sampler2D u_Sampler; // textureSampler 
    uniform sampler2D u_Mask; // maskSampler
    uniform vec3 iResolution;

    vec4 blur(sampler2D source, vec2 size, vec2 uv) {

        vec4 C = vec4(0.0);

        float width = 1.0 / size.x;
        float height = 1.0 / size.y;

        float divisor = 0.0;

        for (float x = -25.0; x <= 25.0; x++)
        {
            C += texture2D(source, uv + vec2(x * width, 0.0));
            C += texture2D(source, uv + vec2(0.0, x * height));
            divisor++;
        }
        C*=0.5;

        return vec4(C.r / divisor, C.g / divisor, C.b / divisor, 1.0);

    }

    void main()
    {
        vec2 uv = gl_FragCoord.xy / iResolution.xy;
        vec4 videoColor = texture2D(u_Sampler, uv);
        vec4 maskColor = texture2D(u_Mask, uv);
        gl_FragColor = blur(u_Sampler, iResolution.xy, uv);
    }

1 Ответ

1 голос
/ 28 мая 2020
vec4 blurColor = blur(u_Sampler, iResolution.xy, uv);
gl_FragColor = mix(blurColor, videoColor, maskColor.r);

Но, к вашему сведению, не принято размывать за один проход, как у вас. Чаще всего применяется размытие в одном направлении (по горизонтали), затем размытие результата по вертикали, затем смешивание результатов, blurredTexture, videoTexture, mask.

...