Game Development Stack Exchange is a question and answer site for professional and independent game developers. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am building a phone application which will display a shape on screen. The shape should look the same on different screen sizes. I Decided the best way to do this is to show more of the background on larger screen keeping the shapes proportion the same on all screens.

My problem is I am not sure how to achieve this, I can query the screen size at runtime and calculate how different it is from the six is designed for but I am not sure what to do with this value.
What kind of projection should I use for my orthographic matrix an hour will I display more on larger screens and not loose information on smaller screens?

share|improve this question
Do you just mean retaining aspect ratio or do you need to take the DPI differences into account too? (not to mention color, gamma and brightness, if we go deeper into the "look the same" definition..) – Jari Komppa Mar 15 '11 at 14:45
The shape should fit in the screen that same on all screens, I will Schick this by multiplying the position of each vertex by some scale (by I this scale is the size of the screen it will cause aspect ratio problems) I will post an image illustrating my intentions when I get home but I think you understand – Jason Mar 15 '11 at 14:57
To rephrase: if you take a slide rule, should the shape be the same width in centimeters on different sized screens? – Jari Komppa Mar 15 '11 at 15:01
No it should not, on the same aspect ratio screen the shape should be the same percent of the screens from thr sides as the same shape on a larger screen (the shape looks the same but larger on a larger screen) doing is not of relavent as I will be setting the position in pixels of each vertex – Jason Mar 15 '11 at 15:23
up vote 3 down vote accepted

Consider scaling your shape so that it's as large as possible while still fitting within the target viewport. In order to do this, you need to consider the ratios between the widths and the heights.

float width_ratio = target_width / source_width;
float height_ratio = target_height / source_height;
float scale = Math.Min(width_ratio, height_ratio);

Edit: Once you've scaled your shape, its coordinate system lines up with that of the screen. In order to center the shape on the screen, you need to translate it by (target_width - source_width) / 2 or (target_height - source_height) / 2, depending on which dimension has extra space.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.