Alpha blending with OpenGL ES 2.0?

Question

What's the best way?

I tried to do this naïvely with a fragment shader that looks like this:

varying lowp vec4 color;
void main()
{
    lowp vec4 alpha = colorVarying.wwww;
    const lowp vec4 one = vec4(1.0, 1.0, 1.0, 1.0);
    lowp vec4 oneMinusAlpha = one-alpha;
    gl_FragColor = gl_FragColor*oneMinusAlpha + colorVarying*alpha;
    gl_FragColor.w = 1.0;
}

But this doesn't work, because it seems gl_FragColor does not contain anything meaningful before the shader runs.

What's the correct approach?

Answer 1

Alpha blending is done for you. On shader exit, gl_FragColor should hold the alpha value in w component and you have to set the blending mode with the normal API just like there is no shader at all. For example gl_FragColor = vec4(0,1,0,0.5) will result in a green, 50% transparent fragment.