Splash screen on Android is not working

Question

I have an application on Cordova (6.2) and install it into Android device (Android v6.0). To change application icon I replace an icon in /platforms/android/res/drawable-hdpi and it works fine. But when I add

<platform name="android">
    <preference name="SplashScreen" value="screen"/>
    <preference name="SplashScreenDelay" value="1000" />
</platform>

to config.xml and recompile an application - splash screen was not showing.

How to fix this problem? (all default screens are present in folders and they names screen.png )

Answer 1

first of all install plugin for splash screen with following command:

cordova plugin add cordova-plugin-splashscreen

then in config.xml copy following:

for Android:

<platform name="android">

    <splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi"/>
    <splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi"/>
    <splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi"/>
    <splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi"/>

    <splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
    <splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
    <splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
    <splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
</platform>

For IOS:

<platform name="ios">
    <splash src="res/screen/ios/Default~iphone.png" width="320" height="480"/>
    <splash src="res/screen/ios/Default@2x~iphone.png" width="640" height="960"/>
    <splash src="res/screen/ios/Default-Portrait~ipad.png" width="768" height="1024"/>
    <splash src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" height="2048"/>
    <splash src="res/screen/ios/Default-Landscape~ipad.png" width="1024" height="768"/>
    <splash src="res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" height="1536"/>
    <splash src="res/screen/ios/Default-568h@2x~iphone.png" width="640" height="1136"/>
    <splash src="res/screen/ios/Default-667h.png" width="750" height="1334"/>
    <splash src="res/screen/ios/Default-736h.png" width="1242" height="2208"/>
    <splash src="res/screen/ios/Default-Landscape-736h.png" width="2208" height="1242"/>
</platform>

now made splash screen with above size. you can do with many ways:

1) http://ionicframework.com/docs/cli/icon-splashscreen.html

2) http://ticons.fokkezb.nl/

now put all generated files in res/screen/{platform} folder and double check with entry with config.xml

now again go to config.xml and add following:

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

above tags hide splash screen after 3 seconds .

Ping me if you still faced problem.

Hope it will help.

Answer 2

public class SplashScreen extends Activity {
    private static int SPLASH_TIME_OUT = 3000;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.splashscreen);

        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent i = new Intent(SplashScreen.this,GetStartedScreen.class);
                startActivity(i);
                finish();
            }
        }, SPLASH_TIME_OUT);
    }
}

Answer 3

The Splash Screen Won't appears After I have Updated My CLI to 6.5.0 and the Older Verison Of the Plugin doesn't support the latest One. SO I Removed the Older One ( Cordova-plugin-splash screen 3.2.2 "Splash screen" ) and added the Latest One()

To Remove the Plugin Use:

cordova plugin remove cordova-plugin-splashscreen

To Add the Plugin Use:

cordova plugin addcordova-plugin-splashscreen