Slate UI - How can I disable anti-aliasing on fonts?

Development Programming & Scripting UI
, , , , , ,
1

Myself and a small handfull of people find anti-aliased font to look blury, strain our eyes and are hard to read for long periods of time. It is very frustrating.

The unreal editor (Slate UI) renders fonts anti-aliased and i have found no option to disable it.

I have spent several days playing with the source code but im a java programmer and there are a lot of classes here. Im really tired of it now. It could be something to do with slate font atlas generation. If anyone has a c++ fix or knows the exact class I need to look at, please let me know.

2

Here is one solution, its not perfect but at least its not blurry anymore, and hey if your desperate its better than nothing.

In the file Engine\Shaders\SlateElementPixelShader.usf there is a method:

float4 GetFontElementColor( VertexOut InVertex )
{
	float4 OutColor = InVertex.Color;
	OutColor.a *= Texture2DSample_A8(ElementTexture, ElementTextureSampler, InVertex.TextureCoordinates.xy);
	return OutColor;
}

Insert an if statement so that it looks like:

float4 GetFontElementColor( VertexOut InVertex )
{
	float4 OutColor = InVertex.Color;
	OutColor.a *= Texture2DSample_A8(ElementTexture, ElementTextureSampler, InVertex.TextureCoordinates.xy);
	if( OutColor.a > 0.3921568627450980392156862745098 )
	{
		OutColor.a = 1;	// makes pixel white or coloured
	}
	else
	{
		OutColor.a = 0;	//makes pixel transparent
	}
	return OutColor;
}

Now run the editor and the relevant shaders will be rebuilt and cached.

Here is the result (see the attached file, the web page is scaleing the image down):

31596-shader+comparsion.png
31596-shader+comparsion.png1156×527 144 KB

You can tweak the float constant to your preference, for now im going with this value.

Hopefully someone has a better solution that prevents the anti-aliasing in the first place instead of trying to fix it after the fact like this one.
Please let me know if you find this usefull.

3

Our font glyphs are generated by FreeType in the FFreeTypeInterface::GetRenderData function of FontCache.cpp.

You can disable the anti-aliasing that FreeType applies by forcing a monochrome output when calling FT_Render_Glyph (use FT_RENDER_MODE_MONO rather than FT_RENDER_MODE_NORMAL).

Please note that this will also affect games shipped with this source code, so you may want to limit the change to editor builds:

FT_Render_Glyph( Slot, (WITH_EDITOR) ? FT_RENDER_MODE_MONO : FT_RENDER_MODE_NORMAL );
4

Perfect. Thanks a lot Jamie.

5

Is there a new way of doing this in newer Engine version? The classes appear to have changed significantly and I believe this method no longer works.

6

The FT_Render_Glyph calls are now in FSlateFontRenderer::GetRenderDataInternal. FreeType hasn’t changed, so it should still work AFAIK.

7

Please pardon me, but I cannot seem to find FSlateFontRenderer::GetRenderDataInternalanywhere within the solution. I have looked through FontCache.cpp as well as searching the whole solution to no avail. I am probably missing something really easy but I am relatively new to modifying engine code.

8

Which version are you using?

9

4.18 Sorry.

10

Okay, in that version it was called FSlateFontRenderer::GetRenderData. FSlateFontRenderer is the class you want though, search for FT_Render_Glyph in there.

11

This code path has rotted though, and no longer correctly renders monochromatic fonts.

I’ve fixed this, and added a CVar (Slate.EnableFontAntiAliasing) to control which font rendering method you want, however this won’t go out in a release until 4.20.

I could try and explain the change if you want to try and apply it, but it’s more complex than editing a few lines.

12

Hello!!

Is there solution for current Unreal Engine 5.2.1? The codes provided above does not exists in both files.

Thanks in advance!!