Random beginner-question: text distorted until window-resize

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By pferft

Hi everyone,

starting up my project shows all text slightly distorted, appearing as if “too sharp”, so here and there some vertical or horizontal lines are clipped away, a 0 cut off on one side, the upper stroke of a T thinner than it should… things like that. It’s the same on several displays including phones.

However, the moment I grab and resize the window, everything looks good. And it only happens with text displayed right from the start, so text in a later opened popup, for example, seems alright.

I tried Mipmaps and Filter on/off as well as different fonts (all dynamic) and sizes, but nothing helped. What could be the reason for this?

What’s your project’s base resolution? Which stretch mode and stretch aspect are you using in the Project Settings?

As a workaround, try disabling font oversampling in the project settings but keep in mind this will make fonts pixelated or blurry at higher resolutions.

Edit: For future reference, this question was cross-posted to Reddit.

Calinou | 2021-02-16 15:42

Hi Calinou,

thanks for your suggestions. My project resolution is 1080x1920px, stretch mode “2D”, aspect “keep”.
Disabling font oversampling got things rougher, as you mentioned, but actually enabling “Use Pixel Snap” fixed the problem. With that, everything looks just fine.
(Error7Studios on Reddit suggested this - I’m usually asking my questions there as well.)

EDIT:
I just realized that “Use Pixel Snap” leads to animations not running smoothly anymore. Zooming a sprite, for example, then “trembles, jitters, bumps” around a bit…

I tried playing around with Rendering and Display settings like Dynamic Fonts Oversampling, Stretch Mode 2d and viewport, but nothing really helped. The weirdest thing is that if I set the scale of my Label not to 1 but to 1.001 (x and y) suddenly it looks good! Now I don’t know what to do… is this a bug?

And EDIT continued:
It’s getting weirder and weirder. It appears that only the even-numbered lines show the distortions, but not the odd ones! (I tried Label and RichTextLabel with several fonts.)

pferft | 2021-02-17 11:14

:bust_in_silhouette: Reply From: aprada

Hi pferft,
I’m doing an iPad app and having the exact same issue, with the added problem that I can’t resize . Most (but not all) text are cut out, either at the Bottom or at the top. For single line labels I was work around it by increasing spacing in the dynamic font, but not for multiline… Anyway, I tried most rendering options (viewport, 2d, keep, expand, etc) and text options (oversampling, mipmap) …nothing works. Also, to make things extra hard, this problems are absent when debugging, they only show up once I deployed the app into the iPad.
Just tried out the pixel snap you mentioned and it worked! Thank you so much!
BTW my resolution is 2732 x 2048, I suspect this problem arises with large resolutions, my guess is that it’s a bug.

“…this problems are absent when debugging, they only show up once I deployed the app into the iPad.” Oh man, I hear you!

My project is set to "only 1080p, upward for mobile, so heavily auto-downscaled to my test-Galaxy A3… but matching exactly the Desktop resolution.
Now funnily enough I have the impression that “adding more to the whole thing” seems to make it better: it looks right since I added some buttons here and there, a scroll-container, some panels… but only on mobile, the Desktop still distorts things a bit (if not as heavily anymore - some digits are being shown smaller than others, even next to each other). Re-sizing the window to smaller usually hits a sweet-spot at some point where everything appears as it should.

Must be a bug, yes. Tell us if you find out more!

pferft | 2021-05-25 10:53