How to add app icon within phonegap projects?

by

Fortunately there is a little bit in the docs about the splash images, which put me on the road to getting the right location for the icon images as well. So here it goes.

Where the files are placed
Once you have built your project using command-line interface “cordova build ios” you should have a complete file structure for your iOS app in the platforms/ios/ folder.

Inside that folder is a folder with the name of your app. Which in turn contains a resources/ directory where you will find the icons/ and splashscreen/ folders.

In the icons folder you will find four icon files (for 57px and 72 px, each in regular and @2x version). These are the Phonegap placeholder icons you’ve been seeing so far.

What to do

All you have to do is save the icon files in this folder. So that’s:

YourPhonegapProject/Platforms/ios/YourAppName/Resources/icons

Same for splashscreen files.

Notes

  1. After placing the files there, rebuild the project using cordova build ios AND use xCode’s ‘Clean product’ menu command. Without this, you’ll still be seeing the Phonegap placeholders.

  2. It’s wisest to rename your files the iOS/Apple way (i.e. [email protected] etc) instead of editing the names in the info.plist or config.xml. At least that worked for me.

  3. And by the way, ignore the weird path and the weird filename given for the icons in config.xml (i.e. <icon gap:platform="ios" height="114" src="https://stackoverflow.com/questions/17820492/res/icon/ios/icon-57-2x.png" width="114" />). I just left those definitions there, and the icons showed up just fine even though my 114px icon was named [email protected] instead of icon-57-2x.png.

  4. Don’t use config.xml to prevent Apple’s gloss effect on the icon. Instead, tick the box in xCode (click the project title in the left navigation column, select your app under the Target header, and scroll down to the icons section).

More Related Contents:

  1. How to implement local push notification in cordova application [closed]
  2. Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK – Android
  3. ionic 2 – Error Could not find an installed version of Gradle either in Android Studio
  4. Handling cookies in PhoneGap/Cordova
  5. How permanent is local storage on Android and iOS?
  6. “No Content-Security-Policy meta tag found.” error in my phonegap application
  7. Angular ng-view/routing not working in PhoneGap
  8. Is there a difference between PhoneGap and Cordova commands?
  9. How to use Google Analytics with Phonegap without a plugin?
  10. How can I specify the minimum SDK in phonegap? It is ignoring android-minsdkversion in config.xml
  11. CORS and phonegap apps
  12. Cordova, why would InAppBrowser plugin be required to open links in system browser
  13. Flickering when navigating between pages
  14. PhoneGap: Opening external URL’s in Safari
  15. Ionic2 authentication firebase
  16. Should a phonegap plugin be declared in the config.xml file?
  17. Xamarin 2.0 vs Appcelerator Titanium vs PhoneGap [duplicate]
  18. Cordova InAppBrowser – How to disable URL and Navigation Bar?
  19. How i can set User Agent in Cordova App
  20. How to handle Push notification when application is resumed?
  21. Update cordova plugins in one command
  22. Can phonegap app work in background?
  23. error: could not find gradle wrapper within android sdk. might need to update your android sdk
  24. How to add a local cordova plugin with ionic / ionic 2 / ionic 3 / ionic 4 / ionic 5?
  25. iOS9 ATS: what about HTML5 based apps?
  26. Share something to a phonegap app
  27. Use PhoneGap to Check if GPS is enabled
  28. PhoneGap iOS, how to get app “Documents” folder full path?
  29. Ionic 3 – ios – displaying selected image on screen
  30. Building combined armv7/x86 apk after Crosswalk integration in an Ionic project

Leave a Comment