Question

To render drawing object on to screen how to calculate ratio for the screen I don’t know and also specify ratio calculation is different for mobile and pc.

I want to ask this question because I have problem with the world timestep.

Answer 1

The aspect ratio of a window, screen, image or other rectangular object is simply its width divided by its height.

So, for example, on a full-HD screen (1920 pixels wide by 1080 pixels high), the aspect ratio is:

ratio = width / height = 1920 / 1080 = 1.7778

Notice that 1920/1080 == 16/9: this is why this is often called a 16:9 aspect ratio. If you think of the colon as a division, you’ll get the same aspect ratio as if you measured the screen itself.

Also of interest: if you know the aspect ratio (e.g. 16:9 or 1.7778) and know the height of the screen (e.g. 1080 pixels), you can get the width of the screen by multiplying:

width = height * ratio = 1080 * 1.7778 = 1920 // round result to nearest integer
// Or, if you remember that 16:9 means 16/9, then:
width = height * ratio = 1080 * (16 / 9) = 1920

Similarly, you can get the height of the screen from the aspect ratio and width by dividing:

height = width / ratio = 1920 / 1.7778 = 1080 // Again, rounding to integer
// Or...
height = width / ratio = 1920 / (16 / 9) = 1080

The only really tricky thing is how some mobile devices handle aspect ratio can be a bit confusing. For example, when you rotate a phone onto it’s side its natural to think that the long edge has become the width of the screen and the short edge is it’s height – however, IIRC, most phone operating systems actually keep the width and height the same and leave it up to you to handle the fact that the screen is basically just tipped on its side.