Changing Font size depending on PPI / DPI

[ron2812]

Hello!

I'm working on a text-heavy UI using a background image for my window design.
I'm using a HD and a SD atlas for switching quality for different resolutions.

My problem is:
When i have some text on an iPhone 4 retina display with a higher dpi the text gets pretty small and hard to read.
So i used a bigger font size that's easier to read on the iPhone.
On the iPad the text gets too big since the resolution is close to the one on the iPhone, but the DPI differs a lot.

I wanna keep all of the elements on my panel resizing, so the position on the screen and the size of the element stays the same on all resolutions,
but i wanna switch the font sizes depending on the DPI of the device.

* Bigger font size on devices with a small screen
* Smaller font size on a device with a big screen

-> rest of UI should scale

Thanks for you help!

[Nicki]

You do it the same way you otherwise would change between SD and HD fonts, with the added bonus that you have to call MakePixelPerfect to make sure that it's not scaled wrongly.

[ArenMook]

Look into the replacement atlas feature. You'll be designing your UI with the "automatic" flag on UIRoot turned off, and you will swap the atlas based on the screen resolution.

[ron2812]

Hi!

The first thing:
I already use atlas swapping with a reference atlas and the automatic flag switched off. That works fine!
The background graphic stretches and is on the same position on different resolutions - that's perfect.

My only problem is the font - I want the label-field (the GameObject itself) to stretch, so it stretches along the background sprite (which i use for the window layout), but wanna have a smaller fontsize and fit more characters in my label field. I attached an image to my post to show you what i mean.


The second thing is devices with different ppi.
Here's what i want:

iPhone 4      ->      960x640      ->     small display    ->    bigger font
iPad 2         ->      1024x768    ->     big display        ->    small font
Galaxy S3    ->      1280x720    ->     small display     ->    bigger font
iPad 3         ->      2047x1536   ->     big display       ->    small font

As you can see, the screen resolution doesn't really tell me what font size i need. It depends on the ppi.
How do you deal with that?

thanks in advance!

[ArenMook]

The two pictures you posted look identical, just one happens to be smaller than others. The number of lines is the same. Why would you change it?

Regardless, if you really want it to change, then you need to write custom logic to use a different font on a different device.

[ron2812]

Yeah, they are identical. That was my point - one is iPad's and one is iPhone's physical size.
On iPad things are easier to read, since the screen is bigger (resolution left aside), so the font can be smaller.

The text comes from a server can differ. I just wanna show more lines on an iPad
because it's readably with a smaller fontsize - and it's not readable if i use the same smaller size from the iPad on the iPhone.

[ArenMook]

Well if you want to show more lines then you need two different layouts. One for the iPhone and another for the iPad.

[ron2812]

Alright! Thanks! I will do that!


PS: I love NGUI. It really make stuff so much easier.

[ArenMook]