Search code examples
androidcordovacordova-plugins

Problems with using custom splashscreens in Cordova splashscreen plugin


I have custom images that I am trying to use with Cordova's splashscreen plugin. It works well in ios but in android it's still showing the default cordova splashscreen and icon. I have tried to remove android platform and installed it again but it didn't work. I have Googled for too long without finding a solution to my problem. Does anyone knows a solution to this?

Cordova version: 6.4.0

Android version: 6.0.0

Cordova-plugin-splashscreen version: 4.0.0

  <platform name="android">
    <icon density="ldpi" src="res/icons/android/icon-36-ldpi.png" />
    <icon density="mdpi" src="res/icons/android/icon-48-mdpi.png" />
    <icon density="hdpi" src="res/icons/android/icon-72-hdpi.png" />
    <icon density="xhdpi" src="res/icons/android/icon-96-xhdpi.png" />
  </platform>
  <platform name="ios">
    <preference name="Orientation" value="all" />
  </platform>
  <platform name="ios">
    <icon height="180" src="res/icons/ios/icon-60-3x.png" width="180" />
    <icon height="60" src="res/icons/ios/icon-60.png" width="60" />
    <icon height="120" src="res/icons/ios/icon-60-2x.png" width="120" />
    <icon height="76" src="res/icons/ios/icon-76.png" width="76" />
    <icon height="152" src="res/icons/ios/icon-76-2x.png" width="152" />
    <icon height="40" src="res/icons/ios/icon-40.png" width="40" />
    <icon height="80" src="res/icons/ios/icon-40-2x.png" width="80" />
    <icon height="57" src="res/icons/ios/icon-57.png" width="57" />
    <icon height="114" src="res/icons/ios/icon-57-2x.png" width="114" />
    <icon height="72" src="res/icons/ios/icon-72.png" width="72" />
    <icon height="144" src="res/icons/ios/icon-72-2x.png" width="144" />
    <icon height="29" src="res/icons/ios/icon-small.png" width="29" />
    <icon height="58" src="res/icons/ios/icon-small-2x.png" width="58" />
    <icon height="50" src="res/icons/ios/icon-50.png" width="50" />
    <icon height="100" src="res/icons/ios/icon-50-2x.png" width="100" />
    <icon height="100" src="res/icons/ios/icon-40-3x.png" width="120" />
    <icon height="100" src="res/icons/ios/icon-small-3x.png" width="87" />
  </platform>
  <platform name="windows">
    <icon height="150" src="res/icons/windows/Square150x150Logo.scale-100.png" width="150" />
    <icon height="360" src="res/icons/windows/Square150x150Logo.scale-240.png" width="360" />
    <icon height="30" src="res/icons/windows/Square30x30Logo.scale-100.png" width="30" />
    <icon height="310" src="res/icons/windows/Square310x310Logo.scale-100.png" width="310" />
    <icon height="106" src="res/icons/windows/Square44x44Logo.scale-240.png" width="106" />
    <icon height="70" src="res/icons/windows/Square70x70Logo.scale-100.png" width="70" />
    <icon height="170" src="res/icons/windows/Square71x71Logo.scale-240.png" width="170" />
    <icon height="50" src="res/icons/windows/StoreLogo.scale-100.png" width="50" />
    <icon height="120" src="res/icons/windows/StoreLogo.scale-240.png" width="120" />
    <icon height="150" src="res/icons/windows/Wide310x150Logo.scale-100.png" width="310" />
    <icon height="360" src="res/icons/windows/Wide310x150Logo.scale-240.png" width="744" />
  </platform>
  <platform name="wp8">
    <icon height="99" src="res/icons/wp8/ApplicationIcon.png" width="99" />
    <icon height="159" src="res/icons/wp8/Background.png" width="159" />
  </platform>
  <platform name="android">
    <splash density="port-hdpi" src="res/screens/android/screen-hdpi-portrait.png" />
    <splash density="port-ldpi" src="res/screens/android/screen-ldpi-portrait.png" />
    <splash density="port-mdpi" src="res/screens/android/screen-mdpi-portrait.png" />
    <splash density="port-xhdpi" src="res/screens/android/screen-xhdpi-portrait.png" />
    <splash density="land-hdpi" src="res/screens/android/screen-hdpi-landscape.png" />
    <splash density="land-ldpi" src="res/screens/android/screen-ldpi-landscape.png" />
    <splash density="land-mdpi" src="res/screens/android/screen-mdpi-landscape.png" />
    <splash density="land-xhdpi" src="res/screens/android/screen-xhdpi-landscape.png" />
  </platform>
  <platform name="ios">
    <splash height="480" src="res/screens/ios/screen-iphone-portrait.png" width="320" />
    <splash height="960" src="res/screens/ios/screen-iphone-portrait-2x.png" width="640" />
    <splash height="1024" src="res/screens/ios/screen-ipad-portrait.png" width="768" />
    <splash height="2048" src="res/screens/ios/screen-ipad-portrait-2x.png" width="1536" />
    <splash height="1136" src="res/screens/ios/screen-iphone-568h-2x.png" width="640" />
    <splash height="1334" src="res/screens/ios/screen-iphone-portrait-667h.png" width="750" />
    <splash height="2208" src="res/screens/ios/screen-iphone-portrait-736h.png" width="1242" />
  </platform>
  <platform name="windows">
    <splash height="300" src="res/screens/windows/SplashScreen.scale-100.png" width="620" />
    <splash height="1920" src="res/screens/windows/SplashScreen.scale-240.png" width="1152" />
    <splash height="1920" src="res/screens/windows/SplashScreenPhone.scale-240.png" width="1152" />
  </platform>
  <platform name="wp8">
    <splash height="1280" src="res/screens/wp8/SplashScreenImage.png" width="768" />
  </platform>
  <plugin name="cordova-plugin-globalization" version="1.0.4" />
  <plugin name="cordova-plugin-network-information" version="1.3.0" />
  <plugin name="cordova-plugin-splashscreen" version="4.0.0" />
  <plugin name="cordova-plugin-whitelist" version="1.3.0" />
  <plugin name="cordova-plugin-inappbrowser" version="1.5.0" />
  <plugin name="cordova-plugin-device" version="1.1.3" />
  <plugin name="cordova-plugin-statusbar" version="2.2.1" />

Solution

  • This is what I use. Notice that the density is different.

    <platform name="android">
        <allow-intent href="market:*" />
        <splash density="land-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
        <splash density="land-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
        <splash density="land-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
        <splash density="land-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />
        <splash density="port-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
        <splash density="port-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
        <splash density="port-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
        <splash density="port-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />
        <icon src="res/icons/android/logo.png" />
    </platform>