ionic-cli: Icons and splash screens generated from `ionic resources` ignored on Android

I found my problem. I created a new ionic test project and the splashscreen is working. So I made a diff between the two config.xml files.

I was using <preference name="SplashScreen" value="splash"/> instead of <preference name="SplashScreen" value="screen"/>.

Thus, I can tell this configuration is working:

• ionic lib: 2.0.0-rc2
• ionic cli: 2.1.8
• cordova: 6.4.0
• cordova-android: 6.1.0
• cordova-plugin-splashscreen: 4.0.0

All you have to do is:

• ionic platform remove android
• install the correct configuration (cordova, ionic cli)
• ionic platform add android@6.1.0
• ionic resources
• check you don’t have a bad config.xml (see my error)

A valid Android splashcreen config line should look like: <splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>

Hope this helps! 😃

Note that my current workaround to get it built with the icons is to simply move them into the correct position. I do that like so:

mv platforms/android/res/{values,xml} res
rm -rf platforms/android/res
cp -r res platforms/android
ionic build android

However I suspect if I generate a new set of icons or prepare the Android platform again, these steps would be reversed.

If you’re splashscreens and icons are not getting used/copied, run

ionic platform rm android
ionic platform add android@latest --save

Android 6.0 (which cordova currently has pinned as the default version) had a bug with resources not being used.

I had the same issue with the following system information:

Cordova CLI: 6.4.0 Gulp version: CLI version 3.9.1 Gulp local: Local version 3.9.1 Ionic Framework Version: 1.3.2 Ionic CLI Version: 2.0.0 Ionic App Lib Version: 2.0.0 ios-deploy version: 1.9.0 ios-sim version: 5.0.8 OS: Mac OS X El Capitan Node Version: v4.4.4 Xcode version: Xcode 8.1 Build version 8B62

and my cordova-android version is 6.0.0

I tried the solutions above but none of them worked for me.

Finally I managed to make it work by downgrading Cordova CLI from 6.4.0 to 6.3.1 by running the following command:

npm install -g cordova@6.3.1

and removing & adding android platform then re-building for android:

ionic platform remove android
ionic platform add android
ionic run android

Note: In this solution, instead of qualifier I keep using density attribute in config.xml. For example, <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/> or <splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>

Thanks @florentsuc, your tips helped me a lot.

Add <engine name="android" spec="~6.1.0" /> to the config.xml file to make ionic platform add android always resolve to 6.1.0.

@EmreErdogan your solution solved my problem. Downgrading cordova solves all problems!

For the people reading this, just uninstall the current cordova before installing the older version.

npm uninstall -g cordova
npm install -g cordova@6.3.1

@florentsuc I’ve been reading your comment multiple times and just realized I’m using cordova-android@6.0. Upgrade to cordova-android@6.1 solved the issue. The icon & splash works great now. Thanks! 😃

+1

Hi folks, I have this pb also. I think I know the reason (don’t worry it has nothing to do with Illuminatis 😉. The command “ionic resources” updates config.xml. The code written is partly bad code. Instead of “density” inside:<splash src="resources/android/splash/drawable-land-ldpi-screen.png" density="land-ldpi"/> It should be “qualifier” as here: <splash src="resources/android/splash/drawable-port-hdpi-screen.png" qualifier="port-hdpi"/> Then magically the build process creates the right folders and copy the right files for every screens. So basically the CLI has to be patched (PLZ supa Ionic Team). But for know let’s house party: https://www.youtube.com/watch?v=tGJEe-yGLos

@herkulano Sorry, i have a problem with tha Node 6.9.X, say sys is deprecated. Use util instead. I wanna to know this hide using Node 7.0 or above.

Your system information:

 ordova CLI: 6.3.1
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v5.12.0
Xcode version: Not installed

@florentsuc - Thanks for the instructions. I can now see my custom icon on my Android device.

Hope this issue gets a good resolution: an app distributed with a default cordova icon gives a bad impression, even if distributed only for testing purposes.

Yes, having the same issue just after updating Ionic and Cordova NPM libraries.

Using Ionic 1.3.2 app

Cordova CLI: 6.4.0
Ionic Framework Version: 1.3.2
Ionic CLI Version: 2.1.4
Ionic App Lib Version: 2.1.2

Update:

Hmm, mine appears to be a bigger issue than that, none of my Plugins (using the Ionic Native library) are no longer loading/found (all is fine for iOS), installed/reinstalled all plugins/platforms etc, strange because I have managed to upgrade fine in the past…

Also to note: Upgraded all Android SDK tools… Uninstalled and Reinstalled Cordova/Ionic

will investigate further…

** Lastest Update **

So after the various CLI updates. It appears if I use an explicit older android cli platform: cordova platform add android@5.2.2 Fixed the issues with plugins, icons ect, and runs fine.

I have noticed the ‘res’ folder was appearing (cordova 6) (with the correct iocns) in the root folder of my inital app files, NOT the platform generated folder

So, this should be considered a Cordova issue?

@mhartington Upgrading to latest android worked for me.

@almothafar thanks.

It was working already with @florentsuc post. My splash problem was the previous value of: <preference name="SplashScreenDelay" value="10000"/> was set at 0. Changed it and it’s now working correctly.

@florentsuc thanks!

It worked for the icon but I still have the splash screen blank issue.

My config.xml

<splash src="resources/android/splash/drawable-land-mdpi-screen.png" density="land-mdpi"/>
<preference name="SplashScreen" value="screen"/>

My info

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 0.0.48
ios-deploy version: 1.9.0 
ios-sim version: 5.0.13 
OS: macOS Sierra
Node Version: v7.3.0
Xcode version: Xcode 8.2.1 Build version 8C1002

Platforms

Installed platforms:
  android 6.1.0

@camexapps , your solution to do cordova platform add android@5.2.2 worked. NOTE: This is for a cordova backbone app - thought i’d post here since this seems to be more a cordova issue than an ionic issue.

Thanks a lot @florentsuc. I updated android platform to 6.1.3 but seems like only 6.1.0 works well.

I too have the issue. I just did

cordova platform update android@6.1.0

because I was on android@6.0.0 and it seems it is the cause of the problem.

But then I go through a lot of errors on compilation, plugins errors like:

AdMobPlugin.java:37: error: package com.rjfun.cordova.ad does not exist

import com.rjfun.cordova.ad.GenericAdPlugin;

I tried ionic plugin rm and ionic plugin addall the plugins, but I still see these errors.

Can you help ?

@EmreErdogan solution doesn’t seem to work.

Thank you both! @felippepuhle @florentsuc

But why isn’t the 6.1 engine set as default if it contains bugs like this?

Thanks to @florentsuc to get past that frustrating issue!

Now, in my case, my app is saved on device with the correct icon. And also getting the splash screen shown with correct image. However, after the splash display, the screen goes all white. Nothing happens! 😦

Any suggestions or pointers?

Your help is highly appreciated!

Thanks @florentsuc !!

@florentsuc and @felippepuhle Thank you, the workaround worked, but bad news I have a new issue, the splash screen shown as a blank, not image one, if I use <preference name="SplashScreen" value="screen" /> it works.

Gracias @florentsuc y @felippepuhle, the workarround worked for me!

Upgrade to 6.1 worked. Many thanks to @florentsuc and @felippepuhle!

@florentsuc Thanks!

GET IT. GOTTCHA YOU BUGGY BUG! My solution with a config like: Cordova CLI: 6.4.0 + Ionic Framework Version: 2.0.0-rc.2 + Ionic CLI Version: 2.1.4; is basically: after the Command $ionic resource, in config.xml for all the <splash src="resources/android/splash/drawable-land-ldpi-screen.png" density="land-ldpi"/> REPLACE “density” by “qualifier” AND in <preference name="SplashScreen" value="screen"/> REPLACE value=“screen” by value=“splash”