Font positioning issues using display.newText()...

From other questions and comments in the forums for the last few years, it looks like the positioning and leading of fonts is not consistent between the iOS simulator and actual device (and Android).

Is there a workflow (or workaround) that people are using to keep things sane between the two?

TIA, Allen

I don’t think there is any easy solution. Simplest is just trial and error. But once you get the position you want and decide to change the design later it starts all over again. Not good for sanity.

I made this module to place text, it works well as far as I know. http://developer.coronalabs.com/code/perfect-vertical-text-alignment-across-devices

It just does not fall in the easy category. But once you do the work your sanity is saved.

The reason is that point (0, 0) in Corona is usually not top-left corner of physical screen. If you want text to be always the same distance from top and left of physical screen then you must pass to display.newText() x and y position as follows (for example I will create text at point (50, 100))

local x = display.screenOriginX + 50 local y = display.screenOriginY + 100

If you pass it to newText then regardles of device you will always have text in the same position

piotrz55: That is not what the issue is about. Fonts are treated differently depending on platform. Make a newLine guide, adjust the font position to be aligned with it and check the different platforms.

Ok, my bad - will check it (but never have problem with fonts on different devices), thanks

Depends somewhat on the font how obvious the problem is, but if you are aiming for pixel perfect placement you are going to have a bad time :frowning:

Price for device diversity, sadly

@jonjonsson - Thanks for the advice on using your module. I ran across that earlier in my searches, but I want to keep the implementation as straightforward as possible since its part of a tutorial I am doing for my students.

I didn’t see it before, but is there anyway to manually set the leading of a text object?

I don’t think there is any easy solution. Simplest is just trial and error. But once you get the position you want and decide to change the design later it starts all over again. Not good for sanity.

I made this module to place text, it works well as far as I know. http://developer.coronalabs.com/code/perfect-vertical-text-alignment-across-devices

It just does not fall in the easy category. But once you do the work your sanity is saved.

The reason is that point (0, 0) in Corona is usually not top-left corner of physical screen. If you want text to be always the same distance from top and left of physical screen then you must pass to display.newText() x and y position as follows (for example I will create text at point (50, 100))

local x = display.screenOriginX + 50 local y = display.screenOriginY + 100

If you pass it to newText then regardles of device you will always have text in the same position

piotrz55: That is not what the issue is about. Fonts are treated differently depending on platform. Make a newLine guide, adjust the font position to be aligned with it and check the different platforms.

Ok, my bad - will check it (but never have problem with fonts on different devices), thanks

Depends somewhat on the font how obvious the problem is, but if you are aiming for pixel perfect placement you are going to have a bad time :frowning:

Price for device diversity, sadly

@jonjonsson - Thanks for the advice on using your module. I ran across that earlier in my searches, but I want to keep the implementation as straightforward as possible since its part of a tutorial I am doing for my students.

I didn’t see it before, but is there anyway to manually set the leading of a text object?