Create a gist now

Instantly share code, notes, and snippets.

Generate app icons and splash screens using a 'logo.png' source image and a json package for multiple platforms

Usage:

ruby iconsplash.rb

Instructions:

  1. Download Ruby script and json file.
  2. To this add your own 'logo.png' file. You should now have 3 files in your working directory:
  1. Open Terminal and cd to the directory and run ruby iconsplash.rb

Prerequisites:

Script requires ImageMagick and the quick_magick ruby gem to be installed.

  1. Install ImageMagick
  1. Install Ruby gem gem install quick_magick

NB: Mac users have to use sudo gem install quick_magick if not using RVM.

{
"package": "Cordova",
"package-version": "5.1.1",
"revision": 1,
"output": [
{
"category": "iOS",
"description": "iOS icons",
"alpha": false,
"path": "Resources/icons",
"sizes": [
{
"file": "icon-40.png",
"width": 40,
"height": 40
},
{
"file": "icon-40@2x.png",
"width": 80,
"height": 80
},
{
"file": "icon-50.png",
"width": 50,
"height": 50
},
{
"file": "icon-50@2x.png",
"width": 100,
"height": 100
},
{
"file": "icon-60.png",
"width": 60,
"height": 60
},
{
"file": "icon-60@2x.png",
"width": 120,
"height": 120
},
{
"file": "icon-60@3x.png",
"width": 180,
"height": 180
},
{
"file": "icon-72.png",
"width": 72,
"height": 72
},
{
"file": "icon-72@2x.png",
"width": 144,
"height": 144
},
{
"file": "icon-76.png",
"width": 76,
"height": 76
},
{
"file": "icon-76@2x.png",
"width": 152,
"height": 152
},
{
"file": "icon-small.png",
"width": 29,
"height": 29
},
{
"file": "icon-small@2x.png",
"width": 58,
"height": 58
},
{
"file": "icon.png",
"width": 57,
"height": 57
},
{
"file": "icon@2x.png",
"width": 114,
"height": 114
}
]
},
{
"category":"iOS",
"description":"iOS splashscreens",
"alpha": false,
"path": "Resources/splash",
"sizes": [
{
"file": "Default-568h@2x~iphone.png",
"width": 640,
"height": 1136
},
{
"file": "Default-667h.png",
"width": 750,
"height": 1334
},
{
"file": "Default-736h.png",
"width": 1242,
"height": 2208
},
{
"file": "Default-Landscape-736h.png",
"width": 2208,
"height": 1242
},
{
"file": "Default-Landscape@2x~ipad.png",
"width": 2048,
"height": 1536
},
{
"file": "Default-Landscape~ipad.png",
"width": 1024,
"height": 768
},
{
"file": "Default-Portrait@2x~ipad.png",
"width": 1536,
"height": 2048
},
{
"file": "Default-Portrait~ipad.png",
"width": 768,
"height": 1024
},
{
"file": "Default@2x~iphone.png",
"width": 640,
"height": 960
},
{
"file": "Default~iphone.png",
"width": 320,
"height": 480
}
]
},
{
"category": "Android",
"description": "Android icons",
"alpha": true,
"path": "res",
"sizes": [
{
"path": "drawable-hdpi",
"file": "icon.png",
"width": 72,
"height": 72
},
{
"path": "drawable-ldpi",
"file": "icon.png",
"width": 36,
"height": 36
},
{
"path": "drawable-mdpi",
"file": "icon.png",
"width": 48,
"height": 48
},
{
"path": "drawable-xhdpi",
"file": "icon.png",
"width": 96,
"height": 96
}
]
},
{
"category":"Android",
"description":"Android splashscreens",
"alpha": false,
"path": "res",
"sizes": [
{
"path": "drawable-land-hdpi",
"file": "screen.png",
"width": 800,
"height": 480
},
{
"path": "drawable-land-ldpi",
"file": "screen.png",
"width": 320,
"height": 200
},
{
"path": "drawable-land-mdpi",
"file": "screen.png",
"width": 480,
"height": 320
},
{
"path": "drawable-land-xhdpi",
"file": "screen.png",
"width": 1280,
"height": 720
},
{
"path": "drawable-port-hdpi",
"file": "screen.png",
"width": 480,
"height": 800
},
{
"path": "drawable-port-ldpi",
"file": "screen.png",
"width": 200,
"height": 320
},
{
"path": "drawable-port-mdpi",
"file": "screen.png",
"width": 320,
"height": 480
},
{
"path": "drawable-port-xhdpi",
"file": "screen.png",
"width": 720,
"height": 1280
}
]
}
]
}
#!/usr/bin/env ruby
require 'rubygems'
require 'json'
require 'quick_magick'
@jsonFile = "cordova.json"
@source = "logo.png"
@quality = 100
@background_color = "#ffffff"
@package = JSON.parse( File.read( @jsonFile ) )
puts 'package: ' + @package['package']
def size(width, height, filepath, file, alpha)
FileUtils.mkdir_p("#{filepath}")
if !alpha
QuickMagick.exec3("convert #{@source} -resize #{width}x#{height} -background \"#{@background_color}\" -gravity center -extent #{width}x#{height} +matte -quality #{@quality} \"#{filepath}/#{file}\"")
else
QuickMagick.exec3("convert #{@source} -strip -resize #{width}x#{height} -background none -gravity center -extent #{width}x#{height} -matte -quality #{@quality} \"#{filepath}/#{file}\"")
end
return "size #{width}x#{height} #{filepath}/#{file} #{alpha}"
end
@package['output'].each { |o|
puts "#{o['description']}"
alpha = o['alpha'] ? o['alpha'] : false;
o['sizes'].each { |s|
width = s['width']
height = s['height']
filepath = s['path'] ? o['path']+'/'+s['path'] : o['path']
file = s['file']
alpha = s['alpha'] ? s['alpha'] : alpha;
# size image
puts size(width, height, filepath, file, alpha)
}
#break
}
exit
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment