how to setup splash screen for phonegap project

In this splash screen tutorial, we’re going to learn how to setup splash screen for phonegap project or apache cordova based applications. Before that you can also read various icon and splash screen sizes for phonegap projects

Steps for setting up phonegap splash screen

Step 1 : Create your phonegap project Creating your phonegap project

Step 2 : Add Splash Screen Plugins


cordova plugin add org.apache.cordova.splashscreen

step 3 :

Create folder name called (res) in your root directory and save your splash screen files

Step 4:

Change your config.xml file with following

 
<platform name="android">
 <!-- you can use any density that exists in the Android project -->
 <splash src="res/hdpi.png" density="port-hdpi"/>
 <splash src="res/ldpi.png" density="port-ldpi"/>
 <splash src="res/mdpi.png" density="port-mdpi"/>
 <splash src="res/xhdpi.png" density="port-xhdpi"/>
 </platform>
 <preference name="SplashScreen" value="screen" />
 <preference name="SplashScreenDelay" value="5000" />

where SplashScreenDelay is display duration in milliseconds

Step 5 : save and compile

There are two methods in splash screen plugin. such as

splashscreen.show
splashscreen.hide

Share This

Share this post with your friends!