Develop Reference

Cordova not copying appropriate icon and splash, using default, Android only

My app keeps using the default cordova icon and splash screen. Upon digging, what should happen is all of my icon/splash get copies to platforms/android/res/. When I look in there, it's just the default cordova ones. However, in my resources/android/ all of my custom ones are there.
Working fine for iOS, not fine for Android at. I am running Cordova CLI 6.4.0.
I have all the custom icons and splash images setup in correct directory structure, and receive no errors during platform add or build android
Below is my config.xml
<platform name="android">
<allow-intent href="market:*" />
<icon platform="android" src="resources/icon.png" />
<icon platform="android" qualifier="ldpi" src="resources/icons/android/icon-36-ldpi.png" />
<icon platform="android" qualifier="mdpi" src="resources/icons/android/icon-48-mdpi.png" />
<icon platform="android" qualifier="hdpi" src="resources/icons/android/icon-72-hdpi.png" />
<icon platform="android" qualifier="xhdpi" src="resources/icons/android/icon-96-xhdpi.png" />
<icon platform="android" qualifier="xxhdpi" src="resources/icons/android/icon-144-xxhdpi.png" />
<icon platform="android" qualifier="xxxhdpi" src="resources/icons/android/icon-192-xxxhdpi.png" />
<splash platform="android" src="resources/splash.png" />
<splash platform="android" qualifier="ldpi" src="resources/screens/android/screen-ldpi-portrait.png" />
<splash platform="android" qualifier="mdpi" src="resources/screens/android/screen-mdpi-portrait.png" />
<splash platform="android" qualifier="hdpi" src="resources/screens/android/screen-hdpi-portrait.png" />
<splash platform="android" qualifier="xhdpi" src="resources/screens/android/screen-xhdpi-portrait.png" />
</platform>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="2000" />
<preference name="FadeSplashScreen" value="false" />
<preference name="FadeSplashScreenDuration" value="0" />
<preference name="SplashScreenBackgroundColor" value="0xFFFFFFFF" />
Same exact exact setup for iOS, and works perfectly there
I've triple checked the paths and everything is correct, and my custom icons are indeed in the indicated locations, but simply not copied over during build
I've tried several times to remove and add android platform, then build, same with cordova-plugin-splashscreen
Both the icon and the splash screen are not working on Android
And here's a screencap showing the folder layout, and the unfortunately incorrect images.
Update made some progress but not quite there. I replaced "qualifier" with "density" in my config.xml. Now what it does it create a correct looking "res" folder, but it puts it in the root of my project instead of platforms/android. It also creates platforms/android/res but all of the images in there are the default Cordova ones. If I move the new folder /res (my custom icons) into /platforms/android (default cordova icons) before build then the app shows my correct stuff. I guess it's a working workaround but an annoying one... and to note; I delete the /res folder but cordova platform add android builds it, just seems to create it in the wrong directory.

This is an issue in cordova-android solved in the version 6.1.0.
The recommended steps are:
cordova platform update android#6.1.0 --save
cordova platform rm android
cordova platform add android
Source: https://github.com/apache/cordova-android/pull/343

I have the same problem, If you find a solution tell me please :)
EDIT
I Solved updgrading my version of android
cordova platform update android#6.1.0

I had this problem some time before and I, and found two ways to pass over.
Upgrade Cordova Platform: This is the recomended, I believe that you upgrade to Cordova 6.4.x but not your Platform, please try: cordova platform update android#latest
OR
Downgrade Cordova CLI: Sometimes, the prev step does not work, so you have to do something that is disrecomended, downgrade cordova to work npm install -g cordova#6.3.1 (Note => CLI 6.3.1 is just the version I believe could work)

ionic app splash screen are not shown

I have been trying over and over to add a splashscreen to my Ionic App
with this configuration the icons does work but the splashscreen aren't working. It's displaying a blank screen, not even the cordova default splashscreen.
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.toggle423609" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>Toggle</name>
<description>
An Ionic Framework and Cordova project.
</description>
<author email="you#example.com" href="http://example.com.com/">
Your Name Here
</author>
<content src="index.html"/>
<access origin="*"/>
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="android-minSdkVersion" value="16"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="3000"/>
<preference name="AutoHideSplashScreen" value="false" />
<feature name="StatusBar">
<param name="ios-package" value="CDVStatusBar" onload="true"/>
</feature>
<platform name="android">
<icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
<splash src="resources/android/splash/drawable-land-ldpi-screen.png" density="land-ldpi"/>
<splash src="resources/android/splash/drawable-land-mdpi-screen.png" density="land-mdpi"/>
<splash src="resources/android/splash/drawable-land-hdpi-screen.png" density="land-hdpi"/>
<splash src="resources/android/splash/drawable-land-xhdpi-screen.png" density="land-xhdpi"/>
<splash src="resources/android/splash/drawable-land-xxhdpi-screen.png" density="land-xxhdpi"/>
<splash src="resources/android/splash/drawable-land-xxxhdpi-screen.png" density="land-xxxhdpi"/>
<splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
<splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
<splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
<splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
<splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
<splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
</platform>
<platform name="ios">
<icon src="resources/ios/icon/icon.png" width="57" height="57"/>
<icon src="resources/ios/icon/icon#2x.png" width="114" height="114"/>
<icon src="resources/ios/icon/icon-40.png" width="40" height="40"/>
<icon src="resources/ios/icon/icon-40#2x.png" width="80" height="80"/>
<icon src="resources/ios/icon/icon-50.png" width="50" height="50"/>
<icon src="resources/ios/icon/icon-50#2x.png" width="100" height="100"/>
<icon src="resources/ios/icon/icon-60.png" width="60" height="60"/>
<icon src="resources/ios/icon/icon-60#2x.png" width="120" height="120"/>
<icon src="resources/ios/icon/icon-60#3x.png" width="180" height="180"/>
<icon src="resources/ios/icon/icon-72.png" width="72" height="72"/>
<icon src="resources/ios/icon/icon-72#2x.png" width="144" height="144"/>
<icon src="resources/ios/icon/icon-76.png" width="76" height="76"/>
<icon src="resources/ios/icon/icon-76#2x.png" width="152" height="152"/>
<icon src="resources/ios/icon/icon-small.png" width="29" height="29"/>
<icon src="resources/ios/icon/icon-small#2x.png" width="58" height="58"/>
<icon src="resources/ios/icon/icon-small#3x.png" width="87" height="87"/>
<splash src="resources/ios/splash/Default-568h#2x~iphone.png" height="1136" width="640"/>
<splash src="resources/ios/splash/Default-667h.png" height="1334" width="750"/>
<splash src="resources/ios/splash/Default-736h.png" height="2208" width="1242"/>
<splash src="resources/ios/splash/Default-Landscape-736h.png" height="1242" width="2208"/>
<splash src="resources/ios/splash/Default-Landscape#2x~ipad.png" height="1536" width="2048"/>
<splash src="resources/ios/splash/Default-Landscape~ipad.png" height="768" width="1024"/>
<splash src="resources/ios/splash/Default-Portrait#2x~ipad.png" height="2048" width="1536"/>
<splash src="resources/ios/splash/Default-Portrait~ipad.png" height="1024" width="768"/>
<splash src="resources/ios/splash/Default#2x~iphone.png" height="960" width="640"/>
<splash src="resources/ios/splash/Default~iphone.png" height="480" width="320"/>
</platform>
</widget>

First try readding your plugin:
$ ionic plugin remove cordova-plugin-splashscreen
$ ionic plugin add cordova-plugin-splashscreen
Then edit the splash image in your resources folder.
Run $ ionic resources --splash in CLI
Rebuild $ ionic build android and run your app
Check Ionic documentation - Icon and Splash Screen Image Generation
If this is not working, you should remove and readd the platform, on which you experiencing the problem.
$ cordova platform remove android (or ios)
$ cordova platform add android (or ios)

Here is your answer!!
If you are using Cordova 6.4.0 (hit cordova -v in your terminal to check the version), you will face this issue(the icons and splash screens won't generate after build)
In order to resolve the issue, you have two options :
change the word density to qualifier in your config.xml. For eg. put
<icon src="resources\android\icon\drawable-ldpi-icon.png" qualifier="ldpi"/> in place of <icon src="resources\android\icon\drawable-ldpi-icon.png" density="ldpi"/>. Build the project. Will work.
Just install the cordova version 6.3.1 by hitting npm install -g cordova#6.3.1 in your terminal. Remove and then add the platform, further build it. Works like a charm!!.
Regards!! :p

After remove and add cordova
$ cordova platform remove android (or ios)
$ cordova platform add android (or ios)
You will get a /res folder with your icons and splash screens. Copy the content from /res and paste into platfomrs/android/res, this will replace the standard icon and splash screens.
Then build your app and you will get your custom images.
I used ionic tab template, without changes.

My Splash-Screen wasn't showing up either (Ionic 3). I found this Link to be very helpfull. These entries in the config.xml did the trick for me:
<preference name="SplashMaintainAspectRatio" value="true"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="30000"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="SplashShowOnlyFirstTime" value="false"/>
<preference name="FadeSplashScreen" value="false"/>

since 07 Nov 2016. Cordova 6.4.0 released with new android version - android#6.1.0.
Most likely you are using android#5 in your cordova(or the old version of android).
Try updating/install the new version of cordova android.
To upgrade:
cordova platform update android#6.1.0
To add it explicitly:
cordova platform add android#6.1.0
https://cordova.apache.org/announcements/2016/11/07/android-release.html
https://cordova.apache.org/blog/

We were trying to update ionic app's splash screen using below configuration system but failed :
Cordova CLI: 6.4.0
Ionic CLI Version: 2.1.7
Ionic App Lib Version: 2.1.4
ios-deploy version: 1.9.0
ios-sim version: 5.0.11
OS: macOS Sierra
Node Version: v6.9.1
Xcode version: Xcode 8.1 Build version 8B62
We were able to generate splash screen and fix the issue in below configuration system:
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 1.2.4
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Mac OS X El Capitan
Node Version: v6.6.0
Xcode version: Xcode 8.1 Build version 8B62

i had same problem, i solved manually by going to path MY_PROJECT\platforms\android\res and delete drawable* and mipmap* and then copy drawable* and mipmap* from MY_PROJECT\res and then re-build project again

Check that you have "cordova-plugin-splashscreen" plugin installed (in the plugins/ folder or by running ionic cordova plugins (for Ionic v3+) or ionic plugins command (older versions of Ionic).
If it's not there run:
ionic plugin add cordova-plugin-splashscreen (Ionic v1 - v2)
ionic cordova plugin add cordova-plugin-splashscreen (Ionic v3+)
Without the plugin iOS will still show the splash screen briefly, but Android wouldn't.

add Splash Screen Cordova plugins in your app using the following command
$ionic cordova plugin add cordova-plugin-splashscreen
$npm install --save #ionic-native/splash-screen
Add following line in you config.xml file
<preference name="FadeSplashScreen" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
Also, Remove SplashScreen.hide() in app.component.ts file
More details with example visit: https://answerdone.blogspot.com/2018/02/ionic-3-splash-screen-plugins.html

Cordova's splash screen doesn't show

I am building a small mobile app using Cordova + AngularJS, so far so good. But I spent the whole day trying to get the splash screen to show, and failed.
Here is my global config.xml
<preference name="Fullscreen" value="true" />
<preference name="WebViewBounce" value="false" />
<preference name="DisallowOverScroll" value="false"/>
<preference name="StatusBarOverlaysWebView" value="false"/>
<preference name="Detect-data-types" value="true"/>
<preference name="Stay-in-webview" value="false"/>
<preference name="Android-targetSdkVersion" value="22"/>
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="LoadingDialog" value="Loading, Please wait!"/>
<platform name="android">
<splash src="www/res/screen.png" density="land-hdpi"/>
<splash src="www/res/screen.png" density="land-ldpi"/>
<splash src="www/res/screen.png" density="land-mdpi"/>
<splash src="www/res/screen.png" density="land-xhdpi"/>
<splash src="www/res/screen.png" density="port-hdpi"/>
<splash src="www/res/screen.png" density="port-ldpi"/>
<splash src="www/res/screen.png" density="port-mdpi"/>
<splash src="www/res/screen.png" density="port-xhdpi"/>
<splash src="www/res/screen.png" density="hdpi"/>
<splash src="www/res/screen.png" density="ldpi"/>
<splash src="www/res/screen.png" density="mdpi"/>
<splash src="www/res/screen.png" density="xhdpi"/>
</platform>
I have installed Cordova's splash screen plugin successfully, and the path www/res/screen.png is correct and the screen.png gets moved to the /platforms/android/res/drawable-** folders successfully. I also tried using navigator.splashscreen.show, But still, the screen doesn't show up!
I tried every solution ever posted regarding this problem and it just wont work. The only way I could get the splash screen to show was by using Intel XDK build/icons & splash screen options, but the build process happens at the XDK servers and I wanna be able to just hit cordova run/emulate/build android and see the results with out XDK middling.
I am loosing my mind here, any help would be appreciated.
I am using Corodva 5.0.0, Angular 1.4.4, on an emulator (Intel atom 64), debugging via Chrome device inspection tools.

Splash screen is not working in android app using Phonegap 3.6.3

I have create a phonegap project which platform is android and added splash screen but it is not displaying.
I've followed all the instruction for splash scrren in android from phonegap docs ( http://docs.phonegap.com/en/3.5.0/config_ref_images.md.html )
and added all splash screen in all platforms/android/res/drawable* directories
My config.xml file is
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.vertismirai.docconnect" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>MyApp</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<feature name="SplashScreen">
<param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />
</feature>
<icon src="res/drawable/icon.png" />
<platform name="android">
<icon src="res/drawable-ldpi/icon.png" density="ldpi" />
<icon src="res/drawable-mdpi/icon.png" density="mdpi" />
<icon src="res/drawable-hdpi/icon.png" density="hdpi" />
<icon src="res/drawable-xhdpi/icon.png" density="xhdpi" />
</platform>
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="10000" />
<content src="index.html" />
<access origin="*" />
</widget>

Cordova implements device-level APIs as plugins. Use the CLI's plugin command, described in The Command-Line Interface, to add this feature for a project:
Please use following link for more information
http://docs.phonegap.com/en/3.3.0/cordova_splashscreen_splashscreen.md.html

Generating iOS and Android icons in Cordova / PhoneGap

I have a freshly created Cordova project with the following config.xml setup (used the instructions from http://docs.phonegap.com/en/edge/config_ref_images.md.html). I also added 2 platforms (iOS and Android).
When I run either cordova run ios or cordova run android, the project still has the default Cordova icons. My understanding from the documentation is that Corodva is supposed to create the icons automatically based in the icon.png I supplied in the config.xml.
config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.testapp" version="1.1.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>SingleApp</name>
<preference name="DisallowOverscroll" value="true" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="Orientation" value="portrait" />
<preference name="Fullscreen" value="false" />
<preference name="target-device" value="handset" />
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<icon src="icon.png" />
</widget>

I wrote a script that auto generates icons for cordova using ImageMagick:
https://github.com/AlexDisler/cordova-icon
To use it, create an "icon.png" file and place it in the root folder of your project, then run:
cordova-icon
and it will generate all the required icons for the platforms your project has.
You can also configure it as a hook in your cordova project so the icons will be generated every time you build the project based on the icon.png you've added. (instructions in the readme).

If you are using cordova 3.5.0 they have updated the docs. In older versions i've always had to replace the icons manually in the project but the latest version of cordova is working fine.
http://cordova.apache.org/docs/en/3.5.0/config_ref_images.md.html#Icons%20and%20Splash%20Screens
As you can see here https://github.com/phonegap/phonegap-cli/issues/58 it's been a common problem. So if you are using an older version of cordova i recommend to update it with the command npm update -g cordova
And after that you should update your config.xml to something like this:
<icon src="www/res/drawable-xxxhdpi/icon.png" />
<platform name="android">
<icon src="www/res/drawable-ldpi/icon.png" density="ldpi" />
<icon src="www/res/drawable-mdpi/icon.png" density="mdpi" />
<icon src="www/res/drawable-hdpi/icon.png" density="hdpi" />
<icon src="www/res/drawable-xhdpi/icon.png" density="xhdpi" />
</platform>
<platform name="ios">
<!-- iOS 7.0+ -->
<!-- iPhone / iPod Touch -->
<icon src="www/res/ios/icon-60.png" width="60" height="60" />
<icon src="www/res/ios/icon-60#2x.png" width="120" height="120" />
<!-- iPad -->
<icon src="www/res/ios/icon-76.png" width="76" height="76" />
<icon src="www/res/ios/icon-76#2x.png" width="152" height="152" />
<!-- iOS 6.1 -->
<!-- Spotlight Icon -->
<icon src="www/res/ios/icon-40.png" width="40" height="40" />
<icon src="www/res/ios/icon-40#2x.png" width="80" height="80" />
<!-- iPhone / iPod Touch -->
<icon src="www/res/ios/icon.png" width="57" height="57" />
<icon src="www/res/ios/icon#2x.png" width="114" height="114" />
<!-- iPad -->
<icon src="www/res/ios/icon-72.png" width="72" height="72" />
<icon src="www/res/ios/icon-72#2x.png" width="144" height="144" />
<!-- iPhone Spotlight and Settings Icon -->
<icon src="www/res/ios/icon-small.png" width="29" height="29" />
<icon src="www/res/ios/icon-small#2x.png" width="58" height="58" />
<!-- iPad Spotlight and Settings Icon -->
<icon src="www/res/ios/icon-50.png" width="50" height="50" />
<icon src="www/res/ios/icon-50#2x.png" width="100" height="100" />
</platform>
As you can see the URIs are relative to the cordova project's path, not to the www folder.

The config.xml settings for icons only works with the PhoneGap Build service. After adding both of your platforms you need to manually (or you can create a hook, but I haven't done that myself) place your icons in the correct paths.
For iOS:
PROJECT_PATH/platforms/ios/PROJECT_NAME/Resources/icons
For Android:
PROJECT_PATH/platforms/android/res/drawable
Android has many res/drawable-* folders, use as applies to your app but at minimum add to res/drawable
Then run cordova prepare or build or run

If you are willing to install extra software for icon generation you can use Ionic which has such function.
Do the following:
npm install ionic -g
Put png, psd or .ai files for icons and/or splashscreens to ${project_location}/resources
ionic resources
If you want to generate icons only there is a handy key for that:
ionic resources --icon
More details here

Don't you need to specify the folder that has the icon on it? Cordova replaces the icon with the default one when it is not found.
Have you tried to replace with something like:
<icon src="res/icon.png" />

npm install -g cordova-res
then cordova-res
also supports adaptive icons for android

Try following https://www.npmjs.org/package/cordova-gen-icon
Example:
$ cordova create hello com.example.hello
Creating a new cordova project with name "HelloCordova" and id "com.example.hello" at location "hello"
$ cd hello
$ cordova platform add ios
Creating ios project...
Preparing ios project
$ cordova-gen-icon
Generate cordova icons with
project: .
icon : ./www/img/logo.png
target :
generate iOS icons
Success generate icon set

A little explication for people who say <icon src="res/icon.png" /> Not work !
You must put icon.png in both this folders
project_name/res/
and
project_name/platforms/platform_name/res/
Steps:
cordova create hello com.example.hello HelloWorld
cd hello
Copy your icon.png to project_name/res/
Open config.xml and put <icon src="res/icon.png" />
After that run
cordova platform add android
Now copy your icon.png to ... hello/platforms/android/res/
then
cordova build android
and finally
adb install platforms/android/build/outputs/apk/android-debug.apk
After that you can see on device your app with your icon

Please upload your icon here: https://pgicons.abiro.com/
You can easily get all things from one station, like Icons(All Platforms), Splash Screens(All Platforms), config.xml (with generated icon name and path).
You just need to replace the res folder and update config.xml, nothing else.