iPhone 6 Plus resolution confusion: Xcode or Apple

Question

Apple's website claims that the resolution is 1080p: 1920 x 1080

However, the launch screen required by Xcode (8.0 GM launched today) is 2208 x 1242.

Who's right?

Answer 1

Even if I don't generally like the tone of John Gruber's Daring Fireball blog, his Larger iPhone Display Conjecture is well worth the read.

He guessed but got exactly right both the resolution in points and in pixels for both models, except that he did not (me neither) expect Apple to build a smaller resolution physical display and scale down (details are in @Tommy's answer).

The gist of it all is that one should stop thinking in terms of pixels and start thinking in terms of points (this has been the case for quite some time, it's not a recent invention) and resulting physical size of UI elements. In short, both new iPhone models improve in this regard as physically most elements remain the same size, you can just fit more of them on the screen (for each bigger screen you can fit more).

I'm just slightly disappointed they haven't kept mapping of internal resolution to actual screen resolution 1:1 for the bigger model.

Answer 2

For those like me who wonder how legacy apps are treated, I did a bit of testing and computation on the subject.

Thanks to @hannes-sverrisson hint, I started on the assumption that a legacy app is treated with a 320x568 view in iPhone 6 and iPhone 6 plus.

The test was made with a simple black background [e-mail] with a white border. The background has a size of 640x1136 pixels, and it is black with an inner white border of 1 pixel.

Below are the screenshots provided by the simulator:

• iPhone 5 simulator : http://i.stack.imgur.com/b2E5K.png
• iPhone 6 simulator : http://i.stack.imgur.com/4Qz8N.png
• iPhone 6 plus simulator : http://i.stack.imgur.com/hQisc.png

On the iPhone 6 screenshot, we can see a 1 pixel margin on top and bottom of the white border, and a 2 pixel margin on the iPhone 6 plus screenshot. This gives us a used space of 1242x2204 on iPhone 6 plus, instead of 1242x2208, and 750x1332 on the iPhone 6, instead of 750x1334.

We can assume that those dead pixels are meant to respect the iPhone 5 aspect ratio:

iPhone 5               640 / 1136 = 0.5634
iPhone 6 (used)        750 / 1332 = 0.5631
iPhone 6 (real)        750 / 1334 = 0.5622
iPhone 6 plus (used)  1242 / 2204 = 0.5635
iPhone 6 plus (real)  1242 / 2208 = 0.5625

Second, it is important to know that @2x resources will be scaled not only on iPhone 6 plus (which expects @3x assets), but also on iPhone 6. This is probably because not scaling the resources would have led to unexpected layouts, due to the enlargement of the view.

However, that scaling is not equivalent in width and height. I tried it with a 264x264 @2x resource. Given the results, I have to assume that the scaling is directly proportional to the pixels / points ratio.

Device         Width scale             Computed width   Screenshot width
iPhone 5        640 /  640 = 1.0                        264 px
iPhone 6        750 /  640 = 1.171875  309.375          309 px
iPhone 6 plus  1242 /  640 = 1.940625  512.325          512 px

Device         Height scale            Computed height  Screenshot height
iPhone 5       1136 / 1136 = 1.0                        264 px
iPhone 6       1332 / 1136 = 1.172535  309.549          310 px
iPhone 6 plus  2204 / 1136 = 1.940141  512.197          512 px

It's important to note the iPhone 6 scaling is not the same in width and height (309x310). This tends to confirm the above theory that scaling is not proportional in width and height, but uses the pixels / points ratio.

I hope this helps.

Answer 3

You should probably stop using launch images in iOS 8 and use a storyboard or nib/xib.

• In Xcode 6, open the File menu and choose New ⟶ File... ⟶ iOS ⟶ User Interface ⟶ Launch Screen.

• Then open the settings for your project by clicking on it.

• In the General tab, in the section called App Icons and Launch Images, set the Launch Screen File to the files you just created (this will set UILaunchStoryboardName in info.plist).

Note that for the time being the simulator will only show a black screen, so you need to test on a real device.

Adding a Launch Screen xib file to your project:

Configuring your project to use the Launch Screen xib file instead of the Asset Catalog:

Answer 4

Real/physical iPhone 6 Plus resolution is 1920x1080 but in Xcode you make your interface for 2208x1242 resolution (736x414 points) and on device it is automatically scaled down to 1920x1080 pixels.

iPhone resolutions quick reference:

Device          Points    Pixels     Scale  Physical Pixels   Physical PPI  Size
iPhone X        812x375   2436x1125  3x     2436x1125         458           5.8"
iPhone 6 Plus   736x414   2208x1242  3x     1920x1080         401           5.5"
iPhone 6        667x375   1334x750   2x     1334x750          326           4.7"
iPhone 5        568x320   1136x640   2x     1136x640          326           4.0"
iPhone 4        480x320   960x640    2x     960x640           326           3.5"
iPhone 3GS      480x320   480x320    1x     480x320           163           3.5"

Answer 5

On the physical device, iPhone 6 Plus's main screen's bounds is 2208x1242 and nativeBounds is 1920x1080. There is hardware scaling involved to resize to the physical display.

On the simulator, the iPhone 6 Plus's main screen's bounds and nativeBounds are both 2208x1242.

In other words... Videos, OpenGL, and other things based on CALayers that deal with pixels will deal with the real 1920x1080 frame buffer on device (or 2208x1242 on sim). Things dealing with points in UIKit will be deal with the 2208x1242 (x3) bounds and get scaled as appropriate on device.

The simulator does not have access to the same hardware that is doing the scaling on device and there's not really much of a benefit to simulating it in software as they'd produce different results than the hardware. Thus it makes sense to set the nativeBounds of a simulated device's main screen to the bounds of the physical device's main screen.

iOS 8 added API to UIScreen (nativeScale and nativeBounds) to let a developer determine the resolution of the CADisplay corresponding to the UIScreen.

Answer 6

Check out this infographic: http://www.paintcodeapp.com/news/iphone-6-screens-demystified

It explains the differences between old iPhones, iPhone 6 and iPhone 6 Plus. You can see comparison of screen sizes in points, rendered pixels and physical pixels. You will also find answer to your question there:

iPhone 6 Plus - with Retina display HD. Scaling factor is 3 and the image is afterwards downscaled from rendered 2208 × 1242 pixels to 1920 × 1080 pixels.

The downscaling ratio is 1920 / 2208 = 1080 / 1242 = 20 / 23. That means every 23 pixels from the original render have to be mapped to 20 physical pixels. In other words the image is scaled down to approximately 87% of its original size.

Update:

There is an updated version of infographic mentioned above. It contains more detailed info about screen resolution differences and it covers all iPhone models so far, including 4 inch devices.

http://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions