jitsvm
jitsvm

Reputation: 27

Size of images for UI for different screen sizes?

If I want to set a button's background image in iOS in an app that uses autolayout, what size should the .png image be? Since the height, and width of the button will always vary, in addition to accommodating for retina/nonretina displays (@2x?).

Upvotes: 1

Views: 442

Answers (2)

Mrunal
Mrunal

Reputation: 14118

You can add multiple images with providing proper naming conventions normal, @2x, @3x, ~iPad etc.

For that go through Apple documentations. For example, your image name is myBackground.png then

[UIImage imageForDeviceWithName:@"myBackground"];

Then here is the list of files and resolutions for "myBackground"

[email protected] == 960 × 640

[email protected] == 1136 × 640

[email protected] == 1334 × 750

[email protected] == 2208 × 1242

myBackground~ipad.png == 1024 × 768

myBackground@2x~ipad.png == 2048 × 1536

Same way you require to add images for landscape with suffix added like: ~Landscape

Upvotes: 1

Sarat Patel
Sarat Patel

Reputation: 856

When You are using Image for particular Button then you should note down the following point

  • When your Button is size of 50x100 then the Image should be with size 50x100 for non-ratina. and Button is size of 50x100 then the Image should be with size 100x200 for Ratina.

In short doesn't matter with your Button size. when you are using any Image with X size for Non Ratina then for Ratina display required same Image with 2X (double size) image.

X size for Non Ratina

2*x size for Ratina

because it will work every device but your Button Image will not seen properly.

Upvotes: 0

Related Questions