Properly rendering transparent areas of textures

Question

I'm rendering a tree that contains branch meshes with partially transparent textures.

If I render it with AlphaTestEffect and set the ReferenceAlpha to something low, I'll get this.

I want to render the tree with BasicEffect, however, this is the result I get. BlendState is set to NonPremultiplied.

I am not even sure what I am looking at. It looks like the transparent area of the closest branch is covering up the one behind it (but not the trunk of the tree). If I set the DepthState to DepthRead, then all the branches are drawn out of order.

What exactly is the problem here?

Answer 1

The problem is that you don't sort your polygons here thus can not use alpha blending properly. The common ways to resolve this are:

• Alpha testing: discard the pixels which are below a certain alpha threshold so that you gain proper Z buffering, Z discard. This results is hard edges when looked from up close.
• Alpha to coverage: you have to set up a blend state which supports this technique. It is based on multisampling anti aliasing so you get better results when you turn it on to higher levels.
• Two pass rendering: first you render everything alpha tested to get correct sorting, then in a second pass you render everything with alpha blending and Z buffer writes turned off, but discarding pixels which are above a certain alpha level. This way you render only the smooth outlines of the transparent geometry, which gets you incorrect sorting, but the user won't recognize it (probably).

There are also some advanced techniques (order independent transparency) which are not really used in real time apps because of their performace hungry nature.

Answer 2

If you're using a render target instead of rendering directly to screen then make sure you use the most complete constructor overload of the render target to construct it so you can instruct it to create a depth buffer.

Other than that you should set your DepthStencilState to Default not Read as this means your branches are only depth tested versus what was already in the depth buffer and not against themselves.

The BlendState should be set to AlphaBlend. This is I think the only option that supports semi-transparent textures. NonPreMultiplied should only be used for content that was not imported using XNA's content pipeline.

Just a note, János Turánszki is correct, I'm just listing here how to get in done in XNA.