Cordova / Phonegap icon and launch image generator

September 7th, 2012 by Arend Leave a reply »

I created a small script that will generate the required icon files and launch images  in PNG format for a default cordova / phonegap project.

Currently only icon files are supported, I am working on adding the splash / Launch images for iOS as well.

 

Upload a square icon of preferably  512×512 or bigger and you will receive a zip file with the required images as seen in the below screenshot.

Keep in mind that each time you visit this page, all uploaded and generated files are removed. So this might be problematic if many try to run this script at the same time (which I don’t expect).

Todo:
Generate all required files according to the default directory layout as generated by cordova’s create script.

The script: http://arenddeboer.com/cordova/.

Script source: cordova_icon_gen_source.zip (please share any updates or improvements you make)

 

Here is the update to config.xml courtesy of  Corey Maass

<icon src=”cordova/cordova_128.png”/>

<icon src=”cordova/cordova_android_36.png” gap:platform=”android” gap:density=”ldpi”/>

<icon src=”cordova/cordova_android_48.png” gap:platform=”android” gap:density=”mdpi”/>

<icon src=”cordova/cordova_android_72.png” gap:platform=”android” gap:density=”hdpi”/>

<icon src=”cordova/cordova_android_96.png” gap:platform=”android” gap:density=”xhdpi”/>

<icon src=”cordova/cordova_bb_80.png” gap:platform=”blackberry”/>

<icon src=”cordova/cordova_bb_80.png” gap:platform=”blackberry” gap:state=”hover”/>

<icon src=”cordova/cordova_ios_57.png” gap:platform=”ios” width=”57″ height=”57″/>

<icon src=”cordova/cordova_ios_72.png” gap:platform=”ios” width=”72″ height=”72″/>

<icon src=”cordova/cordova_ios_114.png” gap:platform=”ios” width=”114″ height=”114″/>

<icon src=”cordova/cordova_ios_144.png” gap:platform=”ios” width=”144″ height=”144″/>

<icon src=”cordova/cordova_64.png” gap:platform=”webos”/>

<icon src=”cordova/cordova_48.png” gap:platform=”winphone”/>

<icon src=”cordova/cordova_173.png” gap:platform=”winphone” gap:role=”background”/>

 

<gap:splash src=”cordova/res/screen/android_ldpi_portrait.png.png” gap:platform=”android” gap:density=”ldpi”/>

<gap:splash src=”cordova/res/screen/android_mdpi_portrait.png” gap:platform=”android” gap:density=”mdpi”/>

<gap:splash src=”cordova/res/screen/android_hdpi_portrait.png” gap:platform=”android” gap:density=”hdpi”/>

<gap:splash src=”cordova/res/screen/android_xhdpi_portrait.png” gap:platform=”android” gap:density=”xhdpi”/>

<gap:splash src=”cordova/res/screen/blackberry_transparent_300.png” gap:platform=”blackberry”/>

<gap:splash src=”cordova/res/screen/iphone_portrait.png” gap:platform=”ios” width=”320″ height=”480″/>

<gap:splash src=”cordova/res/screen/iphone_retina_portrait.png” gap:platform=”ios” width=”640″ height=”960″/>

<gap:splash src=”cordova/res/screen/ipad_portrait.png” gap:platform=”ios” width=”768″ height=”1024″/>

<gap:splash src=”cordova/res/screen/ipad_landscape.png” gap:platform=”ios” width=”1024″ height=”768″/>

<gap:splash src=”cordova/res/screen/windows_phone_portrait.jpg” gap:platform=”winphone”/>

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

or in plain ascii:

cordova_128.png
cordova_16.png
cordova_24.png
cordova_256.png
cordova_32.png
cordova_48.png
cordova_512.png
cordova_64.png
cordova_android_36.png
cordova_android_48.png
cordova_android_72.png
cordova_android_96.png
cordova_bb_80.png
cordova_ios_114.png
cordova_ios_144.png
cordova_ios_57.png
cordova_ios_72.png
splash_default_ipad_landscape_1024_768.png
splash_default_ipad_landscape_2048_1496.png
splash_default_ipad_portrait_1536_2008.png
splash_default_ipad_portrait_768_1024.png
splash_default_iphone_320_480.png
splash_default_iphone_640_960.png

18 comments

  1. CashLee says:

    That’s helpful… Thank you very much

  2. Jeremy says:

    Absolutely amazing. Also really needed for the phonegap community. Would like to see the code but could not find it.

    Well Done.

  3. Corey says:

    Thank you so much for this! Saved me hours. Wondering if you had a config.xml file to go along with it? Thanks!

  4. Corey says:

    It also looks like cordova/res/screen/ipad_portrait.png is being rendered as 768 x 1004 instead of 768 x 1024.

    • Arend says:

      No specific config.xml. I believe it worked with the default config at the time of writing, but I may be wrong. I think the portrait mode should be 1004, despite being listed here as 1024; It leaves room for the status bar.

  5. David S says:

    Great tool!!!

    Could it be possible to provide the background image -or some sort of option- to change the grey one? Maybe even allowing to upload a second image just for the splashscreen -animated gif perhaps?-

    Thanks for sharing!

    • Arend says:

      I currently have no time/plans to implement such features. But I will keep them in mind when if I update the script.

  6. kamidev says:

    Hi! The hosted version returns HTTP 500 Internal Server Error at the moment. It was working a few days ago. Did something happen?

    Thanks for a very timesaving utility!

  7. Ron says:

    Just tried to open the source zip after downloading and Windows displays an error that it is invalid.

  8. Arend says:

    There were some issues with the upload progress indicator (I removed APC module from the server which in turn generated a fatal error in the image generator)
    It should work as expected now.

  9. Vineeth Vijayan says:

    This was working last week, but these days its not working, could you please fix, It was really helpful…. :)

Leave a Reply


1 + = ten