Forums | NoesisGUI

I have a problem in UE4 like Using transparent images as TextureSource (Unity)
How to solve it in UE4? Thanks.

Hello,

As explained in that post, Noesis requires textures with the color channels premultiplied by the alpha channel. This is done to allow for proper composition that is associative, but it also fixes problems with texture filtering and mi map generation. You can find more information about it in these links:

https://developer.nvidia.com/content/al ... or-not-pre
http://www.realtimerendering.com/blog/g ... plication/

At the moment, UE4 doesn't support doing the alpha multiplication at texture import time, so the way to go is to use textures that have the alpha premultiplied. If your authoring tool doesn't support it, this forum thread has a link to a tool you can use:

viewtopic.php?f=3&t=1036&p=5842

As an aside, UE4 handles PNGs with alpha in a way that doesn't work with premultiplied alpha. Here's a link explaining the situation:

https://forums.unrealengine.com/develop ... -the-image

So, for now, remember: premultiply your textures and don't use PNGs for translucent textures.

Moving forward we'd like to support doing the processing of the texture in the editor, either by adding it to the plugin or submitting a modification to the engine.

Please, let us know if you need more help on this matter.

So, for now, remember: premultiply your textures and don't use PNGs for translucent textures.

Hi,
What's the working pipeline exactly?

If I have a translucent png file, then I need to convert it to premultiply png and then convert to other formats like tga?

Hi flyingtree,

Yes, if you want to keep using PNG as the source, then you need to convert to TGA to avoid Unreal filling in the color channel of the masked parts. And the premultiplication step has to be performed before the texture is imported, as there's no way to get Unreal's texture import pipeline to do it.

Hi flyingtree,

Yes, if you want to keep using PNG as the source, then you need to convert to TGA to avoid Unreal filling in the color channel of the masked parts. And the premultiplication step has to be performed before the texture is imported, as there's no way to get Unreal's texture import pipeline to do it.

How if I just use TGA file, does xaml support TGA?

No, unfortunately WPF doesn't support TGA, so you wouldn't be able to run the Blend project.

I've been looking at possible options and would like to test some. I've also been looking at the code that messes with the pixels. The function in question is FillZeroAlphaPNGData
and it's called from UTextureFactory::ImportTexture (in EditorFactories.cpp). According to the comment before said function, they do it because some PNG exporters fill fully transparent pixels with white to avoid artifacts when interpolating. which is exactly what pre-multiplied alpha textures aim to solve.

You can give a try at removing that function call, which I tried and seems to work, but may cause with other alpha cut-out textures. In the long run I'll try adding something on our side. I think it should be possible to add something to the editor without modifying its source code, but I've taken a bit of a look at it and it looks like a bit of work, so I'm not sure when I will be able to take on the task.

Hi guys,

I've just uploaded a new version of the plugin that contain a couple of changes to deal with this issue.

First is that now textures imported with XAMLs are assigned to the UI Texture Group, instead of the default World group as before. Then, all textures in the UI group are inspected when they are imported of the Texture Group property is changed, and if the source is a PNG image then texels with an alpha value of zero are set to black. This behaviour is controlled by a new setting in the NoesisGUI project settings. If you want to give this a try, first enable the new setting, and then either manually change the Texture Group of your existing textures, or reimport the XAMLs that reference them.
If you have textures that you use via Bindings, just assign them to the UI group manually.

Hope this is enough to work around this engine problem, and as always, if you run into any problems, let us know.

Hi hcpizii,

I tested this new version, and find it is good for many image, But there are still some flaws,
There have sawtoothes in some image's border, besides translucent picture is too bad.
Please compare bleow two pictures.

1.Using TGA 2.Using new Plugin Thanks.

Would you mind sharing the source image with us so I can test it?

Hi hcpizzi,

You can test this picture. In my testing code, it like this It is OK, using TGA.