Hi All,
I am using Ionic3. I am trying to create a custom icon and splash screen for my app. I created an icon.png (432x193) and splash.png (6135x2733) in the resources folder.
I then run:
ionic cordova resources
✔ Collecting resource configuration and source images - done!
✔ Uploading source images to prepare for transformations - done!
✔ Generating platform resources: 38 / 38 complete - done!
✔ Modifying config.xml to add new image resources - done!
If I check resources/android/icon:
and resources/android/splash:
I can see the new images have been generated (I have <preference name="orientation" value="portrait"/>, so I think that’s why only portrait images are generated, landscape has the default ionic ones).
I also check:
config.xml
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.thewhozoo912107" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>theWhoZoo</name>
<description>An awesome Ionic/Cordova app.</description>
<author email="admin@thewhozoo.com" href="http://thewhozoo.com/">theWhoZoo Team</author>
<content src="index.html"/>
<access origin="*"/>
<allow-intent href="http://*/*"/>
<allow-intent href="https://*/*"/>
<allow-intent href="tel:*"/>
<allow-intent href="sms:*"/>
<allow-intent href="mailto:*"/>
<allow-intent href="geo:*"/>
<allow-intent href="*"/>
<platform name="android">
<allow-intent href="market:*"/>
<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-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">
<allow-intent href="itms:*"/>
<allow-intent href="itms-apps:*"/>
<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-40@3x.png" width="120" height="120"/>
<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-83.5@2x.png" width="167" height="167"/>
<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" width="640" height="1136"/>
<splash src="resources/ios/splash/Default-667h.png" width="750" height="1334"/>
<splash src="resources/ios/splash/Default-736h.png" width="1242" height="2208"/>
<splash src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" height="2048"/>
<splash src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" height="2732"/>
<splash src="resources/ios/splash/Default-Portrait~ipad.png" width="768" height="1024"/>
<splash src="resources/ios/splash/Default@2x~iphone.png" width="640" height="960"/>
<splash src="resources/ios/splash/Default~iphone.png" width="320" height="480"/>
</platform>
<allow-navigation href="*"/>
<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="SplashMaintainAspectRatio" value="true"/>
<preference name="FadeSplashScreenDuration" value="300"/>
<preference name="loadUrlTimeoutValue" value="700000"/>
<preference name="orientation" value="portrait"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="3000"/>
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar"/>
</feature>
<plugin name="ionic-plugin-keyboard" spec="~2.2.1"/>
<plugin name="cordova-plugin-whitelist" spec="1.3.1"/>
<plugin name="cordova-plugin-console" spec="1.0.5"/>
<plugin name="cordova-plugin-statusbar" spec="2.2.1"/>
<plugin name="cordova-plugin-device" spec="1.1.4"/>
<plugin name="cordova-plugin-splashscreen" spec="~4.0.1"/>
<plugin name="cordova-plugin-facebook4" spec="~1.7.4">
<variable name="APP_ID" value="XXXXXXXXXX"/>
<variable name="APP_NAME" value="theWhoZoo"/>
</plugin>
<plugin name="cordova-plugin-googleplus" spec="~5.1.1">
<variable name="REVERSED_CLIENT_ID" value="com.googleusercontent.apps.XXXXXXXXXXXXXXXXXXX"/>
</plugin>
<plugin name="cordova-plugin-crop" spec="~0.3.1"/>
<plugin name="cordova-plugin-app-version" spec="~0.1.9"/>
</widget>
I then run:
ionic cordova build android
to build an apk file. When I install this apk on my Android device, the icon and splash screen is still the same default Cordova image:
If anyone can help, I would appreciate it.
More info:
global packages:
@ionic/cli-utils : 1.3.0
Cordova CLI : 6.4.0
Ionic CLI : 3.3.0
local packages:
@ionic/app-scripts : 1.3.0
@ionic/cli-plugin-cordova : 1.3.0
@ionic/cli-plugin-ionic-angular : 1.3.0
Cordova Platforms : android 6.0.0 ios 4.3.1
Ionic Framework : ionic-angular 3.2.1
System:
Node : v7.10.0
OS : macOS Sierra
Xcode : Xcode 8.3.2 Build version 8E2002
ios-deploy : not installed
ios-sim : not installed
Are you sure that you are on android ? Just kidding… 
Hum… what about the icon/splash.png outside the folder android/ios/… ?
Path :
YourProject/resources/icon.png
YourProject/resources/splash.png
Let me know. I had the same problem but in my case, it was the config.xml, there is mine (just with the ionic resources command line (CLI)
There is only all the lines that concern the SplashScreen.
config.xml :
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<preference name="loadUrlTimeoutValue" value="700000" />
<platform name="android">
<allow-intent href="market:*" />
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<icon height="57" src="resources/ios/icon/icon.png" width="57" />
<icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
<icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
<icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
<icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
<icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
<icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
<icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
<icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
<icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
<icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
<icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
<icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
<icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
<icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
<icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
<icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
<icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
<splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
<splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
<splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
<splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
<splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
</platform>
<plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
Reading here, it looks like there’s a bug in the 6.0.0 version of the Android Cordova platform. So it looks like an upgrade fixes it.
ionic cordova platform rm android
ionic cordova platform add android@latest
ionic cordova resources
ionic cordova build android
However, when I upgraded to android 6.2.3 (latest), I now get:
ionic cordova build android
> cordova build android
✖ Running command - failed!
[ERROR] Cordova encountered an error.
You may get more insight by running the Cordova command above directly.
[ERROR] An error occurred while running cordova build android (exit code 1):
Error: cordovaProject.projectConfig.getFileResources is not a function
Richards-MacBook-Pro:theWhoZoo richardmarais$ (node:60728) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: channel closed
(node:60728) DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
I am going to try figure this out first, then hopefully the above issue will be resolved.
I upgraded Codova, and now I can build an apk:
npm install -g cordova@latest . (Cordova CLI : 7.0.1 )
cordova build android
Now the icon is there!!! The Splash screen is just white though.
Verify your icon.png and splash.png in yourproject/resources
then do in the CLI (on macbook) :
sudo ionic resources
To be sure that everything has been applied
1 Like
Looks like the upgrade to Cordova 7.0.1 has caused a few issues I need to resolve first:
Using ionc-native Geolocation
Application does not have sufficient geolocation permissions
Oh well I just implement geolocation yesterday, working fine 
Try remove and re-add the plugins
If this is this one : https://ionicframework.com/docs/native/geolocation/ and not the background-one try this :
$ npm remove --save @ionic-native/geolocation
$ ionic cordova plugin remove cordova-plugin-geolocation
then re-install
$ ionic cordova plugin add cordova-plugin-geolocation
$ npm install --save @ionic-native/geolocation
Also check the version in the package.json file
Mine is :
"@ionic-native/geolocation": "^3.10.3"
"cordova-plugin-geolocation": "^2.4.3"
My ionic info :
ionic info
global packages:
@ionic/cli-utils : 1.1.2
Cordova CLI : 7.0.1
Ionic CLI : 3.1.2
local packages:
@ionic/app-scripts : 1.3.7
@ionic/cli-plugin-cordova : 1.1.2
@ionic/cli-plugin-ionic-angular : 1.1.2
Ionic Framework : ionic-angular 3.2.1
System:
Node : v6.10.3
OS : macOS Sierra
Xcode : not installed
ios-deploy : not installed
ios-sim : not installed
1 Like
I am using Ionic3:
global packages:
@ionic/cli-utils : 1.3.0
Cordova CLI : 6.4.0
Ionic CLI : 3.3.0
local packages:
@ionic/app-scripts : 1.3.0
@ionic/cli-plugin-cordova : 1.3.0
@ionic/cli-plugin-ionic-angular : 1.3.0
Cordova Platforms : android 6.0.0 ios 4.3.1
Ionic Framework : ionic-angular 3.2.1
System:
Node : v7.10.0
OS : macOS Sierra
Xcode : Xcode 8.3.2 Build version 8E2002
ios-deploy : not installed
ios-sim : not installed
I then upgraded my Cordova to the latest version (from 6.4.0 to 7.0.1):
global packages:
@ionic/cli-utils : 1.3.0
Cordova CLI : 7.0.1
Ionic CLI : 3.3.0
local packages:
@ionic/app-scripts : 1.3.0
@ionic/cli-plugin-cordova : 1.3.0
@ionic/cli-plugin-ionic-angular : 1.3.0
Cordova Platforms : android 6.2.3 ios 4.3.1
Ionic Framework : ionic-angular 3.2.1
System:
Node : v7.10.0
OS : macOS Sierra
Xcode : Xcode 8.3.2 Build version 8E2002
ios-deploy : not installed
ios-sim : not installed
As you can see, I also upgraded my Android platform from android 6.0.0 to android 6.2.3.
Since then, I cannot get my Cordova plugins to work on Android. iOS and browser all still works fine.
If I run it on an Android device or emulator, it loads the app, but does not show the Splash Screen, or get the Geolocation, allow Firebase login, etc. It looks like all Cordova plugins for Android are not working.
When I run in Android Studio, I get the following over and over in the logs:
W/art: Attempt to remove non-JNI local reference, dumping thread
It appears as if the install of the latest Android Platform (6.2.3) has broken the app.
Any suggestions welcome.
Now I try uninstall the Android platform and reinstall version 6.0.0. But I get errors:
cordova platform remove android
Removing platform android from config.xml file...
Richards-MacBook-Pro:theWhoZoo richardmarais$ ionic cordova platform add android@6.0.0
> cordova platform add android@6.0.0 --save
✖ Running command - failed!
[ERROR] Cordova encountered an error.
You may get more insight by running the Cordova command above directly.
[ERROR] An error occurred while running cordova platform add android@6.0.0 --save (exit code 1):
Using cordova-fetch for cordova-android@6.0.0
Adding android project...
Creating Cordova project for the Android platform:
Path: platforms/android
Package: com.ionicframework.thewhozoo912107
Name: theWhoZoo
Activity: MainActivity
Android target: android-24
Subproject Path: CordovaLib
Android project created with cordova-android@6.0.0
Installing "cordova-plugin-app-version" for android
ANDROID_HOME=/Users/richardmarais/Library/Android/sdk/
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_112.jdk/Contents/Home
Failed to install 'cordova-plugin-app-version': Error
at Object.module.exports.check_gradle (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/lib/check_reqs.js:90:25)
at GradleBuilder.prepEnv (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/lib/builders/GradleBuilder.js:161:23)
at Api.module.exports.runClean (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/lib/build.js:131:20)
at /Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/Api.js:391:50
at _fulfilled (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:834:54)
at self.promiseDispatch.done (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:863:30)
at Promise.promise.promiseDispatch (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:796:13)
at /Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:604:44
at runSingle (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:137:13)
at flush (/Users/richardmarais/Development/ionic/theWhoZoo/platforms/android/cordova/node_modules/q/q.js:125:13)
Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK.
Looked here: /Users/richardmarais/Library/Android/sdk/tools/templates/gradle/wrapper
But:
cordova platform ls
Installed platforms:
android 6.0.0
ios 4.3.1
then
cordova build android
✖ Running command - failed!
[ERROR] Cordova encountered an error.
You may get more insight by running the Cordova command above directly.
[ERROR] An error occurred while running cordova build android (exit code 1):
ANDROID_HOME=/Users/richardmarais/Library/Android/sdk/
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_112.jdk/Contents/Home
Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK.
Looked here: /Users/richardmarais/Library/Android/sdk/tools/templates/gradle/wrapper
I check my Android SDK in Android Studio, and I have all the latest installed (Android 6.0, 7.0 & 7.1).
So I upgrade back to the latest Android platform:
cordova platform remove android
ionic cordova platform add android@latest
Now it builds again with no errors, but I sit with the same problem of the Cordova Plugins not working, and the following in the logs:
W/art: Attempt to remove non-JNI local reference, dumping thread
I have read here , that changing from Snapshot to Host GPU may help.
Where is this? Reading here indicates that it’s a setting on an emulator. Bit then how do you get this to work on a devise? Or is there a way to build the apk with this setting?
I think I don’t really understand this?
Solved:
deleted node_modules
npm install
ionic cordova platform remove android
ionic cordova platform add android@latest
ionic cordova build android