Different device screen sizes

Question

I am learning iOS development and I am slightly confused with these device sizes. When I test in Simulator, I have such options:

Hardware -> Device -> iPhone
Hardware -> Device -> iPhone (Retina 3.5 inch)
Hardware -> Device -> iPhone (Retina 4 inch)

Should I test my app against all these three options? To which phone does a respective screen size correspond to? (e.g., what does it mean when we test against 3.5 inch, for which iPhone is it suitable?).

Dont worry if you have used the Autolayout then choose any option. — Jitendra, Jul 30 '13 at 08:03
iPhone5 screen size is 320px 568px and iPhone4s and bellow devices its screen size is 320px x 480px — Nitin Gohel, Jul 30 '13 at 08:03

score 1 · Answer 1 · answered Jul 30 '13 at 08:13

Unless you're going to have a completely different UI for the iPhone 5 vs previous iPhones, you don't really need to worry too much about the screen size. Whenever you do anything in iOS to do with custom rendering of any kind, you specify the coordinates in points, not pixels. iOS will automatically calculate the pixel value based on the device for you.

The only thing you need to concern yourself with is the retina display when it comes to images. For this, you just need to have a double sized image, with @2x on the end. For example, for a pre-retina phone, you may have an image that's 100x100 pixels called image.png. You then need one called image@2x.png that is 200x200 pixels. iOS will automatically load the retina version when required.

If you DO want a different UI for iPhone 5, then the solution @user2277872 will be good.

You should definitely look into using Autolayout as well, as this makes life very easy for a number of things, especially if you're not going to have a different UI for iPhone 5, as it will automatically position elements according to a set of pre-defined rules you give it. For example, you may want a button to always be 20px from the bottom of the screen. Autolayout will do this for you, regardless of whether the screen is 4-inches or 3.5.

Hi PaReeOhNos, you mentioned: "you specify the coordinates in points" -- do you mean it is done like this automatically, or I should do like this ? — user2054339, Jul 30 '13 at 14:13
It's done automatically. So if for example, you wanted to add a subview, then regardless of whether it is a retina display or a non-retina, you would do `[[UIView alloc] initWithFrame:CGRectMake(10, 10, 10, 10)]; For a non retina display, this would draw a 10x10px square, at the coordinate 10px,10px. On a retina display, it would draw a 20x20px square, at the coordinate 20px,20px :) — PaReeOhNos, Jul 30 '13 at 14:20

score 0 · Answer 2 · answered Jul 30 '13 at 08:04

0

You should test against all those. First one means, devices before iPhone 4. Second corresponds to iPhone 4 and iPhone 4s. Last one is iPhone 5.

answered Jul 30 '13 at 08:04

cahn

1,350
1
12
24

score 0 · Answer 3 · edited Jul 30 '13 at 09:11

0

Hardware -> Device -> iPhone

//iPhone 3gs & iPod Touch 3 & early

Hardware -> Device -> iPhone (Retina 3.5 inch)

//iPhone4,4s & iPod Touch 4

Hardware -> Device -> iPhone (Retina 4 inch)

//iPhone5 & iPod Touch 5

edited Jul 30 '13 at 09:11

Abdullah Shafique

6,878
8
35
70

answered Jul 30 '13 at 08:06

Seamus

243
1
12

score 0 · Answer 4 · edited May 23 '17 at 12:29

0

Well, the different iPhones have different screen dimensions. For example, the iPhone 4,4S's dimensions are

320 X 480

the iPhone 5 is

1136 X 640

So what you need to do is check for the screen size, or check for the type of device that is currently running, and have it return it.

here is an answer found on another page : here

if([[UiDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone){
 if(UIScreenOverscanCompensationScale==1136/640){
         //move to your iphone5 storyboard
         [UIStoryboard storyboardWithName:(NSString *) bundle (NSBundle *)];
  }
    else{
         //move to your iphone4s storyboard
         [UIStoryboard storyboardWithName:(NSString *) bundle (NSBundle *)];
  }
}

edited May 23 '17 at 12:29

Community

1
1

answered Jul 30 '13 at 08:07

user2277872

2,963
1
21
22

hi thanks for the answer. yes it would be helpful also to find info how to support all these screens. btw. I am not using storyboards .. i heard i could use image.png and image@2x.png and app would load corresponding one if it is a retina or non retina display, but now I see there are three options (iphone, iphone 3.5 inch, iphone 4 inch), instead of two...?! – user2054339 Jul 30 '13 at 08:11
yes, if you just check for the size of the original iphone, and the 3g/3gs, then you will just have to check for those as well. Nothing more than a if else() statement :) But if you want to just use images, then change the storyboard to UIImage *image = [UIImage imageNamed:]; and change the image on the device however you need :) – user2277872 Jul 30 '13 at 08:13

score 0 · Answer 5 · answered Jul 30 '13 at 08:10

The 3.5 inch screen size corresponds to the size of every iPhone/iPod touch screen up until the iPhone 5. iPhone 5 has a 4 inch screen.

You will have to test your app against all screen sizes. In fact, Apple recommends using Auto Layout to ensure that even if the screen has a different size your app will look good, for example when the status bar gets bigger when the user is making a phone call.

score 0 · Answer 6 · answered Jul 30 '13 at 08:11

See iPhone comes in 2 different screen size 3.5 inch and 4 inch, iPhone that comes with 3.5 inch screen have option of having retina and non-retina display, but 4 inch screen that started with iPhone 5 has only retina display. iPhone5 has screen dimension of 320px568p and below iPhone5 has 320x480

so If you are planning to target both the screen size for your app, you should test on all size iPhones

Different device screen sizes

6 Answers6