This plugin is used to display splash screen on application launch.

Step 1 - Install Splash Screen Plugin

Open command prompt window, type and run the following code to install Splash screen plugin.

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-splashscreen

Step 2 - Adding Splash Screen

Adding splash screen isn’t similar to adding other Cordova plugins. We have to open add the following code snippets inside the widget element in config.xml file.

The first code is SplashScreen.

It has value property which depicts the name of the images placed in platform/android/res/drawable- folder. Cordova offers default screen.png images that we are using in this example, but you can add any of your own images. Important thing is that you should add images for portrait and landscape view and also to for different screen sizes.

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

Second piece of code we need to add is SplashScreenDelay. Value is the time duration in milli seconds for which the screen will be displayed. We have set value to 4000 to hide the splash screen after three seconds.

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

The last preference is optional. It sets stretching of the image. If the 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, we will see the splash screen on running the app. 

Also Read: Cordova - Network Info

Cordova - Splash Screen

You may also Like : Google's Digital Marketing Course

  Modified On Mar-19-2018 03:59:00 AM

Leave Comment