Supporting iPhone 6 and iPhone 6+ with different launch/splash screen image for iPad Portrait and Landscape orientations

Question

What I understood from the available documentation and my testing is that

1. All existing Apps on iPhone 6 and 6 Plus run in compatibility mode, which means the APIs (like [UIScreen mainScreen].bounds) will return 320x568 (iPhone 5/5s) still in new iPhones (6/6 Plus) and all UI is scaled to the correct resolution by iOS.

2. To support iPhone 6/6Plus we need to create xib for Launch Screen (File->New->File->UserInterace->Launch Screen) and set the nib file as "Launch Screen File".

3. We can set different images for launch screen inside Launch screen nib file based on avaialble size classes. [Basically combinations of Any, regular and compact]

4. There is no way to differentiate between iPad in portrait and iPad in Landscape orientation (both are regular width regular height). Also there no way to differentiate between iPhone 4/4s and iPhone 5/s.

Is there a way I can support iPhone 6/6 Plus mode and also provide different launch images for iPad in portrait and iPad in landscape orientation?

See also the similar problem here iOS 8 size classes for iPad landscape

Answer 1

You don´t have to use the launch screen file to make your App iPhone 6 / 6+ resolution compatible. Instead, you can select the LaunchImage asset as your Launch Images Source.

It can be found at "App Icons and Launch Images" under your Targets:

If there is no LaunchImage asset just go to your Images.xcassets, make a secondary click (right click) and select "New Launch Image":

The result is something like that:

Now just drag and drop your images for the specific resolutions you want to support and set the created LaunchImage asset as your source.

Hope it helps

Cheers

Answer 2

Asset catalogues currently work in landscape mode on iPhone on ios8. I had this reponse from apple support:

"There is a bug involving launch images in asset catalogs and apps that launch in landscape on iPhone. Behind the scenes, the asset catalog compiler generates the same UILaunchImages key [1] in the final Info.plist that you would have added when you were specifying launch images manually. One of the sub-keys for each launch image specified under the UILaunchImages key is UILaunchImageOrientation which is always set to Portrait by the asset catalog compiler. This makes sense because apps on iPhone always launch in portrait orientation [2]. However, the iOS app launcher decides that since your UISupportedInterfaceOrientations only contains UIInterfaceOrientationLandscapeLeft and UIInterfaceOrientationLandscapeRight, it will only look for landscape launch images under the UILaunchImages key, of which it finds none.

Since there is no way to force the assets catalog compiler to specify Landscape for the UILaunchImageOrientation sub-key of iPhone launch images, you should continue to specify your launch images by editing the information property list for your app as before."

Answer 3

The asset catalog solution doesn't work for iPad Pro. A different approach is using spacer views that position the correct image in the visible area and move the other one off screen (see my original answer to a similar question here).

You can't provide different images for different screen sizes (iPhone 4, iPhone X, ...), but if you want different images for iPhone and iPad and different images for portrait and landscape this solution is for you.

I created an example project on github if you want to try it out. It works on iPad and iPhone.

The important constraints are

PortraitSpacer.width ≤ 5 × view.width
PortraitSpacer.width ≤ 5 × view.height

LandscapeSpacer.width ≥ 5 × view.width
LandscapeSpacer.width ≥ 5 × view.height

PositionSpacer.width = 5 × view.width

where view.width and view.height are the main view's width and height.

The PortraitSpacer positions the portrait image at 5 × min(view.width, view.height), the LandscapeSpacer positions the landscape image at 5 × max(view.width, view.height), and the PositionSpacer has the same width as PortraitSpacer in portrait mode and the same width as LandscapeSpacer in landscape mode.

We multiply everything with 5 so the two images do not overlap. This works for all devices where the following is true

5 × min(view.width, view.height) + max(view.width, view.height) ≤ 5 × max(view.width, view.height)

In landscape mode this would mean

5 / 4 ≤ view.width / view.height

which is the case for all current devices: iPad has the lowest aspect ratio with 4:3 which is still greater than 5:4.

You can then of course configure images per device (iPhone, iPad) in the asset catalog.