Manage the splash screen in an iOS-based hybrid application

Choose how to manage the splash screen for iOS during application initialization.

By default, iOS hybrid applications show a splash screen image during application initialization. This image is selected at run time from the launch images that are supplied in the application Xcode project. We can also use a custom splash screen by replacing the default set of splash images in the native/Resources folder of the project.

The code that shows the splash screen is in the {AppName}.m class in the didFinishLaunchingWithOptions method. Use the [[WL.sharedInstance] showSplashScreen] API to show the splash screen.

Define a root view controller before you call this API. For example:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
{
  ...
  UIViewController* rootViewController = ...
  [self.window setRootViewController:rootViewController]; 
  ...
  [[WL sharedInstance] showSplashScreen];
  ...
}

By default, the MobileFirst JavaScript library auto-hides the splash screen when the application is launched. To have a smooth transition from the splash screen to the web view, set the option autoHideSplash to false in the initOptions.js file and use the WL.App.hideSplashScreen() method to hide the splash screen after all of the page initialization tasks (including loading other JavaScript frameworks) are completed.

Make sure that the application initialization flow does not block the JavaScript call to hide the splash screen. For example, a problem can occur when you set the application to connect to the server on application startup, and you define form-based authentication that waits for the user to enter login credentials. In this case, the application shows a web login form behind the splash screen without a way for the user to interact with it.

If we use the splash screen API offered in Cordova, do not use the MobileFirst splash screen APIs at the same time.

iOS automatically displays the app's launch image when the app is launched and hides it when the app is ready (after applicationDidFinishLaunchingWithOptions). After this image is removed, we can use the MobileFirst splash screen as required by the application's logic. The documentation in this section describes the MobileFirst splash screen API.

Parent topic: Manage the splash screen