To make an impression of a super-quick response and to give the application suitable time to load completely, iOS introduced the concept of a launch image. A launch image is the first interaction of an application with the user; so it becomes vital to have a properly displayed image at start up. The launch image is displayed while the application is loading, and as per iOS human interface guidelines, it’s one of the must-have requirements for an application.
For Adobe AIR applications, a launch image must remain visible until the AIR runtime is completely initialized. To accomplish this, AIR runtime displays the same launch image as displayed by iOS until the application is ready for use.
To support an application on all iOS devices, one should include launch images of various sizes and resolutions as per the following naming scheme.
Basename + screen size modifier + orientation + scale + device + .png
Basename is the name specified in UILaunchImageFile key in the InfoAdditions element in the application descriptor. Usually it is given as the value, Default.
Screen size modifier when multiplied by the scale factor of the device, gives the actual dimensions of the device. For example, screen modifier for iPhone 5s is 568h, which, when multiplied by scale factor of 2 gives 1136h – the actual height of iPhone 5s in pixels.
Orientation– different launch images can be displayed on an iPad and iPhone 6 plus, based on their orientation, at the time of application launch.
Scale factor for non-retina display devices is 1x and for retina devices it is 2x. The recently launched iPhone 6 plus has a scale factor of 3x.
Device portion is provided in applications that can run on both iPhone and iPad. Its value can either be ~iphone or ~ipad.
|Devices||Resolution (pixels)||Launch image name||Orientation|
|iPhone 6, 7, 8||750×1334||Default-375w-667h@2x~iphone.png||Portrait|
|iPhone 6+, 7+, 8+||1242×2208||Default-414w-736h@3x~iphone.png||Portrait|
|iPhone 6+, 7+, 8+||2208×1242||Default-Landscape-414w-736h@3x~iphone.png||Landscape|
|iPad 1,2||768×1024||Default-PortraitUpsideDown~ipad.png||Upside down portrait|
|iPad 1,2||1024×768||Default-Landscape~ipad.png||Left landscape|
|iPad 1,2||1024×768||Default-LandscapeRight~ipad.png||Right landscape|
|iPad 3,Air||1536×2048||Default-PortraitUpsideDown@2x~ipad.png||Upside down portrait|
|iPad 3,Air||2048×1536||Default-LandscapeLeft@2x~ipad.png||Left landscape|
|iPad 3,Air||2048×1536||Default-LandscapeRight@2x~ipad.png||Right landscape|
|iPad Pro (10.5″)||1668×2224||Default-Portraitemail@example.com||Portrait|
|iPad Pro (10.5″)||2224×1668||Default-Landscapefirstname.lastname@example.org||Landscape|
|iPad Pro (12.9″)||2048×2732||Default-Portrait@2x.png||Portrait|
|iPad Pro (12.9″)||2732×2048||Default-Landscape@2x.png||Landscape|
Number of images to include may vary according to the application requirement. If an application is built only for an iPhone, then iPad images can be skipped and vice versa.
On iPhone 6 and iPhone 6 plus, newly introduced display modes (Standard and Zoomed) makes the situation a bit tricky. In Standard mode, both devices display launch image as per the table shown above. In zoomed mode, however, the launch image of its predecessor device is displayed, which means on iPhone 6 plus, image meant for iPhone 6 i.e. Default-375w-667h@2x~iphone.png is displayed, likewise on iPhone 6 launch image of iPhone 5 is displayed.
How to package launch images:
To include launch images in your application, all launch images are required to be placed at the top-most level or base location of your project hierarchy. For example if the base location is the src folder, then all launch images should be placed as shown in the following screenshot.
However, if you wish to package your iOS application using the command line then launch images can be added as assets in packaging command. For example, to package a Demo app with all iPhone launch images then the same can be done using the following command.
adt -package -target <target> -provisioning-profile <Profile> -storetype pkcs12 -keystore <Certificates.p12> -storepass <password> Demo.ipa Demo-app.xml Demo.swf Default~iphone.png Default@2x~iphone.png Default-568h@2x~iphone.png Default-375w-667h@2x~iphone.png Default-414w-736h@3x~iphone.png Default-Landscape-414w-736h@3x~iphone.png
For more information on iOS Launch image you can refer to Apple’s iOS Human Interface Guidelines.