Cordova - Splash Screen

This plugin is used to display a splash screen on apppcation launch.

Step 1 - Instalpng Splash Screen Plugin

Splash screen plugin can be installed in command prompt window by running the following code.

C:UsersusernameDesktopCordovaProject>cordova plugin add cordova-plugin-splashscreen

Step 2 - Add Splash Screen

Adding splash screen is different from adding the other Cordova plugins. We need to open config.xml and add the following code snippets inside the widget element.

First snippet is SplashScreen. It has value property which is the name of the images in platform/android/res/drawable- folders. Cordova offers default screen.png images that we are using in this example, but you will probably want to add your own images. Important thing is to add images for portrait and landscape view and also to cover different screen sizes.

<preference name = "SplashScreen" value = "screen" />

Second snippet we need to add is SplashScreenDelay. We are setting value to 3000 to hide the splash screen after three seconds.

<preference name = "SplashScreenDelay" value = "3000" />

The last preference is optional. If value is set to true, the image will not be stretched to fit screen. If it is set to false, it will be stretched.

<preference name = "SplashMaintainAspectRatio" value = "true" />

Now when we run the app, we will see the splash screen.