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="[email protected]" href="http://cordova.io"> Apache Cordova Team </author> <content src="index.html" /> <access origin="*" /> <icon src="icon.png" /> </widget>
Cordova iOS is an iOS application library that allows for Cordova-based projects to be built for the iOS Platform. Cordova based applications are, at the core, applications written with web technology: HTML, CSS and JavaScript.
Apache Cordova Is Retired: Alternatives for Cross Platform Mobile Development in 2022. Future trends of cross-platform mobile development are already starting to emerge, and it appears that Apache Cordova won't be included in the list of frameworks that power hybrid web apps for mobile devices.
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/[email protected]" width="120" height="120" /> <!-- iPad --> <icon src="www/res/ios/icon-76.png" width="76" height="76" /> <icon src="www/res/ios/[email protected]" 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/[email protected]" width="80" height="80" /> <!-- iPhone / iPod Touch --> <icon src="www/res/ios/icon.png" width="57" height="57" /> <icon src="www/res/ios/[email protected]" width="114" height="114" /> <!-- iPad --> <icon src="www/res/ios/icon-72.png" width="72" height="72" /> <icon src="www/res/ios/[email protected]" 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/[email protected]" 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/[email protected]" width="100" height="100" /> </platform>
As you can see the URIs are relative to the cordova project's path, not to the www folder.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With