Problems with alpha channel on textures

OpenGL OpenGL: Basic Coding
1

Hello

I’m trying to create alpha blending on textures, but I can’t get it to work.
I have a texture with alpha channel, compressed with DXT5 (I’ve tried 3 and 1 as well). Texture is loaded with SOiL.
Blending functions are


glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

Shader:

out vec4 outColor;
...
outColor = min(vec4(col * scatteredLight + reflectedLight, texcol.a), vec4(1.0f, 1.0f, 1.0f, texcol.a));

Which gives me this result:

The pavement should have smoothed edge that blends with the grass texture behind it. It turned out that the gray color that should be transparent is the color that I’m using to clear the scene (it’s cleared once per drawing loop).
I tried to see if the alpha is sent correctly, so I changed the code in shader a little bit to


outColor = vec4(1.0f, 1.0f, 1.0f, texcol.a);

Which gave me

That shows us the alpha is actually there.
Strange thing is the text in upper left and cursor are rendered correctly, while the only difference is that it is drawn after all the meshes are drawn, and it uses glDrawArrays instead of glDrawElements (that meshes use). I tried to draw the font picture on the mesh, but the result was the same - gray background instead of proper blending.

If it matters, the pavement and the grass are two separate meshes.

What could I miss?

2

I’m not quite sure what you mean by “I tried to draw the front picture on the mesh”, so sorry if the following is what you already tried: You need to draw your objects that have transparency after drawing the fully opaque objects. In this case, you need to draw the pavement last.

What happens otherwise is exactly what you’re seeing. The blending happens against the current framebuffer content, which is all the objects you rendered previously. If you render the pavement first, it will blend against the background color. All the rendered pixels, even the ones that are transparent, will still update the depth buffer. If you later draw objects that cover the same pixels, at a greater depth, they will be eliminated by the depth test.

In a more general case, to render transparency with this type of blending, you need to render all your full opaque objects first. Then you render the objects that contain transparency, sorted back to front.

3

That’s what i thought. I tried the fast way to change display order, but I must have messed something up. I will try to do it the right way this time and I will see if it work.
Thank you for help :slight_smile: