Apache Cordova splash screens not showing in Android

≯℡__Kan透↙ 提交于 2019-11-27 20:05:29

Just had this problem myself. Change this

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

to

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

This fixed it.

source: http://forum.ionicframework.com/t/need-help-with-displaying-splash-screen-on-android-cordova-3-6/10436/12

I had to install the splash screen plugin to make it work

cordova plugin add cordova-plugin-splashscreen

as well as adding

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

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

For new comers and those who are still facing this issue

1) Add Splash screen preference in config.xml

<preference
    name="SplashScreen"
    value="screen" />
<preference
    name="AutoHideSplashScreen"
    value="true" />
<preference
    name="SplashScreenDelay"
    value="5000" />

<feature name="SplashScreen" >
    <param
        name="android-package"
        value="org.apache.cordova.splashscreen.SplashScreen" />

    <param
        name="onload"
        value="true" />
</feature>

2) Declare your splash screens in config.xml

    <!-- you can use any density that exists in the Android project -->
    <splash
        density="land-hdpi"
        src="res/drawable-land-hdpi/splash.png" />
    <splash
        density="land-ldpi"
        src="res/drawable-land-ldpi/splash.png" />
    <splash
        density="land-mdpi"
        src="res/drawable-land-mdpi/splash.png" />
    <splash
        density="land-xhdpi"
        src="res/drawable-land-xhdpi/splash.png" />
    <splash
        density="port-hdpi"
        src="res/drawable-hdpi/splash.png" />
    <splash
        density="port-ldpi"
        src="res/drawable-ldpi/splash.png" />
    <splash
        density="port-mdpi"
        src="res/drawable-mdpi/splash.png" />
    <splash
        density="port-xhdpi"
        src="res/drawable-xhdpi/splash.png" />
</platform>

3) Finally Add this class into your android project structure under org.apache.cordova.splashscreen package

or

install it as Cordova plugin.

user3094755

I had a similar issue on android, I put the Splash Screen Directly into res/drawable-hdpi and got the following error during cordova build.

res/drawable-hdpi-v4/DocBackground.png: Invalid file name: must contain only [a-z0-9_.]

When I de-capitalised the file name, in ~project/icons, cordova build copied them to the res/drawable folder & splash screen worked.

After carefully following the PhoneGap CLI splash screen instructions, my Android splash screen was still not showing up. I then looked at build.gradle under platforms/android and noticed that changes I made to the defaultConfig block were causing changes to AndroidManifest.xml that ultimately prevented the splash screen from working. Below is the defaultConfig block I was using:

defaultConfig {
    applicationId "com.leadingedje"
    minSdkVersion 17
    targetSdkVersion 21
    versionCode getAppVersionCode()
    versionName getAppVersionName()
}

When I removed this block from build.gradle, the splash screen started working again.

Splashscreen integration:

Android

  1. Add the Splashscreen images to folders like below:

    root/res/drawable-land-hdpi/screen.png
    root/res/drawable-land-ldpi/screen.png
    root/res/drawable-land-mdpi/screen.png
    root/res/drawable-land-xdpi/screen.png
    
    root/res/drawable-port-hdpi/screen.png
    root/res/drawable-port-ldpi/screen.png
    root/res/drawable-port-mdpi/screen.png
    root/res/drawable-port-xdpi/screen.png
    
  2. Add splash Screen plugin to android project. (git : git://git.apache.org/cordova-plugin-splashscreen.git)

    src/org/apache/cordova/splashscreen/SplashScreen.java
    
  3. Add plugin javascript file in assets/www/js/lib/android/plugins/cordova-plugin-splashscreen/www/ (git : https://github.com/apache/cordova-plugin-splashscreen/blob/master/www/splashscreen.js)

  4. Add plugin entery in cordova_plugins.js

    {
        "file": "plugins/cordova-plugin-splashscreen/www/splashscreen.js",
        "id": "cordova-plugin-splashscreen.SplashScreen",
        "clobbers": [
            "navigator.splashscreen"
        ]
    },
    
    
    "cordova-plugin-splashscreen": "3.1.0",..   
    
  5. Add following code in config.xml

    <preference name="SplashScreen"         value="screen"/>
    <preference name="SplashScreenDelay"    value="5000" />
    <feature name="SplashScreen">
        <param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />
        <param name="onload" value="true" />
    </feature>
    
  6. now build the android project.

I solved the problem by adding default splash tag

Add this to config.xml in the root destination or in www/config.xml

<gap:splash src="splash.png" />

I'd faced same issue and I've fixed it by using following configuration :-

install splash screen plugin

cordova plugin add cordova-plugin-splashscreen

Next we need to add following preference in config.xml,

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

Add the Splashscreen images to folders like below

<platform name="android">
    <splash qualifier="land-hdpi" src="res/screen/android/splash-land-hdpi.png" />
    <splash qualifier="land-ldpi" src="res/screen/android/splash-land-ldpi.png" />
    <splash qualifier="land-mdpi" src="res/screen/android/splash-land-mdpi.png" />
    <splash qualifier="land-xhdpi" src="res/screen/android/splash-land-xhdpi.png" />
    <splash qualifier="land-xxhdpi" src="res/screen/android/splash-land-xxhdpi.png" />
    <splash qualifier="land-xxxhdpi" src="res/screen/android/splash-land-xxxhdpi.png" />
    <splash qualifier="port-hdpi" src="res/screen/android/splash-port-hdpi.png" />
    <splash qualifier="port-ldpi" src="res/screen/android/splash-port-ldpi.png" />
    <splash qualifier="port-mdpi" src="res/screen/android/splash-port-mdpi.png" />
    <splash qualifier="port-xhdpi" src="res/screen/android/splash-port-xhdpi.png" />
    <splash qualifier="port-xxhdpi" src="res/screen/android/splash-port-xxhdpi.png" />
    <splash qualifier="port-xxxhdpi" src="res/screen/android/splash-port-xxxhdpi.png" />
</platform>

land-ldpi is not a density but a qualifier

Therefore the correct each splash tag as below:

<splash qualifier="land-ldpi" src="res/screen/android/splash-land-ldpi.png" />

After above configuration, below step is very important,

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

2019 February end:

Only two things I did and it worked:

  • Install plugin:

    cordova plugin add cordova-plugin-splashscreen

  • Add below to config.xml, have corresponding images

(1st splash line is a generic screen size, if you want)

<platform name="android">
    <splash src="res/screen/android/splash-2732x2732.png" />

    <splash density="land-ldpi" src="res/screen/android/splash-land-320x200-ldpi.png" />
    <splash density="land-mdpi" src="res/screen/android/splash-land-480x320-mdpi.png" />
    <splash density="land-hdpi" src="res/screen/android/splash-land-800x480-hdpi.png" />
    <splash density="land-xhdpi" src="res/screen/android/splash-land-1280x720-xhdpi.png" />
    <splash density="land-xxhdpi" src="res/screen/android/splash-land-1600x960-xxhdpi.png" />
    <splash density="land-xxxhdpi" src="res/screen/android/splash-land-1920x1280-xxxhdpi.png" />
    <splash density="port-ldpi" src="res/screen/android/splash-port-200x320-ldpi.png" />
    <splash density="port-mdpi" src="res/screen/android/splash-port-320x480-mdpi.png" />
    <splash density="port-hdpi" src="res/screen/android/splash-port-480x800-hdpi.png" />
    <splash density="port-xhdpi" src="res/screen/android/splash-port-720x1280-xhdpi.png" />
    <splash density="port-xxhdpi" src="res/screen/android/splash-port-960x1600-xxhdpi.png" />
    <splash density="port-xxxhdpi" src="res/screen/android/splash-port-1280x1920-xxxhdpi.png" />
</platform>
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!