iOS Question Scaling Photographic Assets For Different Screens

RichardN said:

In all devices the Navigation bar is a constant 48 logical points high.

Click to expand...

Not in landscape. It depends on the device size.

Why not use an ImageView with MODE_FIT? This way the image will not be distorted and it will almost fill the screen.

Yes I should have used MODE_FIT, however....

The iPad screens are all 4/3 aspect ratio. For a portrait photo to fill the screen perfectly beneath the Navigation Bar (based on the largest iPad Pro) it should be a size of:

1034 x (1366 - 48) pts = 1034 x 1318 pts.

Upscale to pixels (x2) = 2068 x 2636 image

Load this image into a ImageView scaled to 0-100%x and 0-100%y and you get white bands on the left & right sides suggesting the aspect ratio is incorrect. Of course you can get rid of it by using MODE_FILL but you introduce distortion to the image.

......................

The Nav-Bar height also seems to vary in portrait mode. If I Log the 100% x 100% ImageView dimensions in Page_Resize the system reports 1024x704 pts in landscape and 768x960 pts in portrait agreeing with the device full screen size of 1024x768 pts (iPad Pro 9.5"). However, in portrait orientation the dimensions do not infer a Navigation Bar size of 48px but....

1024-960 = 64 pts

How can this be? How can the correct aspect ratio of an image be determined when the Nav-Bar height appears to vary even in portrait orientation?

I've ran this code on the iPad Pro (9.7 inch) simulator:

The page size is 768 * 960

I get precisely the same values on the hardware device.

This information, whilst useful, does not get me any closer to determining a common graphic aspect ratio to perfectly fit in the client area beneath the Navigation bar... because the height of the Navigation Bar differs with different devices within each aspect ratio family.

I believe you are saying (in a roundabout way) that it cant be done?

.....................

Workaround: If you work backwards from the values obtained from Log(Width) & Log(Height) to determine the graphic aspect ratio and make the longest side of the graphic the same as the longest side on the largest iPad then it fills the area exactly using MODE_FIT.

Will it do the same on other devices of the same screen aspect ratio? I don't know because I can only test with the iPad Pro 9.7"

I'm not saying that it is not possible, just that there are many different screen sizes and aspect ratios and I don't think that it is a good idea to try to exactly match all of them.

MODE_FIT works in the same way that LoadBitmapResize with KeepAspectRatio = True works. It sets the image size to the maximum possible size while keeping the aspect ratio.

https://www.b4x.com/android/forum/threads/82693/#content