Text Render in combination with Dept Of Field produces distorted and difficult to read text

Hey Guys,

I’m encountering a perplexing issue with the Text Render Component in Unreal Engine, when used in combination with Depth of Field.
The text becomes distorted and sometimes difficult to read, appearing as if it’s transparent on edges with varying depths. This issue greatly reduces the readability and overall visual quality of the rendered text.

To provide some context, I have incorporated the Text Render Component into my project to display the name of players. However, when I enable Depth of Field effects in the Camera Actor, the text becomes visually distorted.
It seems as though the blurring effect caused by Depth of Field is interfering with the proper rendering of the text, resulting in an unpleasant visual artifact.

I have tried various approaches to troubleshoot the issue, including adjusting the Depth of Field settings, experimenting with different font sizes types and materials, as well as changing between the different Transparency methods (masked, opaque, translucent… ). However, none of these attempts seemed to produce satisfactory results. The problem persists, and the text remains distorted and difficult to read.

Has anyone an idea what could cause this issue?

Examples:
Reference

2 Likes

Demn!

2 Likes

Switch the widget component from “world space” to “screen space”

And the problems with the text being garbled is due to image reconstruction. Turn off TSR to not have it interfere with ui.

1 Like

Hi, thank you for your Reply!

This would actually fix the distortion problem, but unfortunately it is no viable solution to me.
The Text from a player further away would be displayed on top of a player that is closer to you, as far as i know there is no way to prevent this when a widget is rendering in screen space.
Also Depth Of Field now won’t have any impact on the Player Name, wich is not mandatory for me, but would be nice to have.

Keep it in world space but turn off tsr and youvshouod have what you need.

1 Like

This somehow doesn’t fix it for me.
At the same time TSR or Antia Aliasing in general is something i don’t want to miss out on.
This is how it looks like for me with the different Anti Aliasing settings:

(Because starting the game in PIE and Standalone mode sometimes has huge differences, my screenshots are all made in Standalone mode)

Does your text have any opacity set? As in is it transparent in any way?

This is what I’m getting in my scene with world space & TSR enabled

My text has a 100% opacity.

No, i created a new Projekt from the Third Person Character template for the Screenshots and the Video, to make sure its not due to custom project settings.
I didnt change any Settings in the Widget or Text Render Component.

The Issue seems to appear when the Background is blured through DoF and the Background has different depths (see my Video for reference).
If i put a straight wall without edges behind my characters, the text renders normally.

To reproduce my issue, you’d have to put the focus on the Character in the front, and place some thin pillars behind the character to the right.

This is what I’m getting. Different dynamic settings from focal length to sensor width.

If anything I’m just getting surrounding glow.

HD ver should update soon.

1 Like

This is looking very different from what i’m seeing, i really dont know why. Is the Video from PIE or Standalone Game?

I don’t have any glow. I will upload a video from my perspective, and a sample project.

Maybe its something hardware related, would be my only explanation besides Unreal Engine

This is the project if you want a look

I was running it in PIE

controls = numpad +, - and numpad 0, 1 to change dof parameters runtime.

2 Likes

Thank you for sharing the project!
I compared your settings with mine, and if I reset the outline from the Text to default and reduce the camera FOV to around 57,6 ° i can reproduce my issue in your project.

But it seems like adding an outline to the text in my project, removes the distortion on my Text.

This solves the problem for me.

Thank you for your time and help!!

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.