How do you get pixel perfect text?

This question is centered on iOS but you see it on PC too. It may be due to antialiasing on the text characters. It could be texture handling.

But in a nutshell fonts look sharper outside unreal than inside.

The font that drives this home is the iPhone default font. Its stunning. It’s got such poise and balance and its edges are just oh so crisp.

I’ve never salivated over a font before. I WANT that font, or at least it’s edges.

And I want it in Unreal.

I’m rendering using FCanvasTextItem and UCanvas DrawItem. I’ve long since removed all scaling on my fonts and made sure my positions are pixel aligned.

But still, too blurry. Not crisp. Better than a kick in the teeth sure but surely I can match that system font…

How?

I have a lot of text in my project and it all looks a bit mushy.

Help me please!!

It’s suspicious to me that the fonts render at a much larger size than I’d expect (doubleish?). I tried doubling the point size and rendering at half scale but that looked way worse.

Anyone able to get pixel perfect text on iOS and if so how did you do it?

Everyone loves a picture so I’ve added comparisons.

“Bob’s Stuff” is in my app and a similar on screen size to “Matchoo” in the second picture (which is in the OS). Note how much cleaner the system font is.

I know this seems like a small detail but it’s fairly critical to making the App look solid.

Perhaps this should be a bug report…

link text

Here’s a project that has simple text demonstrating a lack of clarity.

It looks okay. Okay is not good enough!

And moved to bug reports.

124897-textblendingproblem.png

I’m not sure what this proves - but switching to an offline font and looking at the preview window I’m definitely losing clarity on my side. The lower text here is in game, the upper text is in the preview.

Hi ,

I’m not offering this as a solution, but when you compare fonts “in game” and fonts previewed in editor, please compare white on black to white on black and black on white to black on white. I notice in both examples, the white on a dark background looks sharper but this could be because the transition pixels (could be) transparent and blending into the dark background, while visible against the light background.

That said, I did run tests on an iPad and iPhone with your project, took screen shots and they did appear a bit blurry at 100% zoom. I’m looking into this to find a definitive answer, but my first thought would be to make sure if you want the font displayed at 8pt that there is no enlargement or reduction from project in the editor -you should be developing at an exact 1:1 ratio.

My only other thought would be there could be some compression settings on the font that need to be adjusted…Test font> right click> Asset Actions> Bulk Editor via Property Matrix>Runtime Font> Legacy font size = 12… (The default font size when a font size is not specified.) Again, make sure you are setting the font at the exact size it is to be displayed (vs setting it at 12 pixels and displaying it at 8.)

-.

Yeah - after making that last comment I realised the same thing you suggested and switched colors to match. In fact my preview and ingame tests look identical on PC and I added a diagonal line draw that shows the same pixel density.

In the process of moving this new test to iOS to see how the pixels compare.

Looking at the bulk edit options point sizes vary as I’d expect (and I’ve debugged my code to check that the scale setting in the DrawItem call is 1.0).

I think my friend Rich Yandle has the solution - +CVars=r.MobileContentScaleFactor=2.

Now I have a second issue - this makes my UI text on the iphone tiny in comparison to PC - clear and legible but tiny. I have a UI scale factor I can use per platform to fix this (i.e. I’ll scale up the font to compensate and render it smaller on PC) but it would be nice to have per platform font scaling - is that possible?

So just to be clear - this totally fixes the original problem but presents another one - how to best have different text sizes for different platforms?

Also - how come this thread is on -1 answers?

The thread was showing -1 for the answer because I posted my response as an answer and converted it to a comment (since it was not actually an answer.)

If you are satisfied that the solution above resolves the original blurry text issue for iOS please start a new post regarding how to best have different text sizes for different platforms. We try to keep one question per post in order to make it easier to search.