OpenGL: Weird transparency blending result

Question

I'm working on creating a transparent GUI in OpenGL, and am trying to get text rendered over some semi-transparent quads, but the results are odd.

If I render the text by itself, with nothing behind it, it looks fine:

Text without transparent background

However, if I render a semi-transparent quad behind it (rendering the quad before rendering the text), I get this:

Text with transparent background

I have blending set to (GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA). The font texture is an all-white texture with the character shapes in the alpha channel.

Do I need to be doing something special when performing alpha-transparency over an existing layer of transparency? Or is there something else I need to check?

+1 to @Nicol Bolas' suggestion. For instance, your source image might be alright, but your image loader could be screwing things up. — Paul-Jan

haffax haffax · Accepted Answer · 2012-03-20T21:20:20

The alpha value of your font texture seems to be off. It should be 0 for texels that you want to be invisible and 1 (or 255 in bytes) for visible texels. You should check the texture and make sure alpha values are correct.

Instead of alpha blending, you can use alpha testing. This will completely get rid of fragments, that have a alpha value below a certain threshold and is often much faster than blending.

glDisbale(GL_BLEND);    
glEnable(GL_ALPHA_TEST);
glAlphaFunc(GL_GREATER, 0.96f); // Or some fitting threshold for your texture

This might work even if your texture's alpha is off in some places, but doesn't look like it is the case here, as the 's' and 't' seem to have a low alpha in places where it should be 1.

OpenGL: Weird transparency blending result

2 Answers