I am trying to find a way to set a UI element to a physical size (in the real world) across all devices.
For example: in pages on Ipad, when you zoom in / out you see a % scale, and at 100% it says "Actual" because the page onscreen is the same width as a real piece of paper. I would like to set my scroll view / PKCanvas view to the size of a real piece of (a4) paper but have not found a way to achieve this aside from hard coding values.
Constraints are sized using points so I expect to need some conversion scale, unique to each device (eg. how many points = 1cm).
You have to do some computation.
Here is a table which gives all devices size information. h t t p s : / / w w w.ios-resolution.com
Let's consider an example:
From screen physical Diagonal (phD), you can compute physical width (phW) and height (phH):
- we have equation :
phW*phW + phH * phH = phD * phD. // Pythagore
- physical dimensions are proportional to logical dimensions
phW = logW * x phH = logH * x
- Hence we get :
x = phD / sqrt(logW*logW + logH * logH)
phW = phD / sqrt()
physWidth = x * logicalWidth
Now that you have physical height and width of screen, as well as logical dimensions, it is easy to compute physical size of UI element:
- if it is h and w (in points)
itemPhyWidth = w * physWidth / logicalWidth,
- or with previous formulae
itemPhyWidth = w * x
itemPhyHeight h * x
Hope that helps.