OpenGL: Supporting multiple iOS device resolutions in a universal app

Currently, when targeting all iOS devices in a universal application, the OGL rendering code needs to support 3 different screen sizes.

For landscape format (used by "The Greedy Sponge") it is:

My solution looks as follows:

The virtual coordinate system in which the simulation takes place is always at the 480x320 scale. So positioning and the size of the elements in the simulation remains the same independently of the resolution.

for classic screen iPod/iPhone resolution:

glViewport(0, 0, 480, 320);
glOrthof(-480/2, +480/2, -320/2, +320/2, -1, 1);  // left,right,bottom,top, near, far

This is quite straight forward, since virtual space of the simulation corresponds 1:1 to the viewport.

for Retina:

glViewport(0, 0, 960, 640);
glOrthof(-480/2, +480/2, -320/2, +320/2, -1, 1);

This is also quite straight forward, we keep the projection matrix the same, but increase the viewport size to reflect the x2 resolution of the Retina display.

for Ipad:

glViewport(0, 0, 1024, 768);
glOrthof(-480/2-16, +480/2+16, -320/2, +320/2+64, -1, 1);

This is little bit trickier, since in virtual space we have horizontally 32 units more, and vertically 64 units more. How you distribute this for your game, depends on the game-play. For instance, in "The Greedy Sponge" I extended it to the left by 16 units (which are 32 pixel) and to the right by the same amount. Since Mr. Greedy is aligned to the lower screen edge, I extended the virtual space only upwards, allowing the player to see more rows. This is reflected by the +64 in glOrthof.

That's it, hope you find it useful.