TiCons

Generate Icons & Splash (Launch) Images

For Appcelerator® Titanium™ & Alloy

Icons

You could generate all icons from a single 2048x2048 PNG. Set Border radius to 10 when you do. It is more likely you want to run it once for iOS using a flat image and then again for the other platforms using a transparent image for unique shapes.

Splashes

You could use the same flat square 2208x2208 PNG for both icons and splashes. Set Border radius to 10 and disable Crop It is more likely you run it one (or two) times for icons and one time for splashes, or two if you want a perfect nine-patch for Android and provide a croppable input for the other platforms.

Assets

You can now also generate image assets. Simply upload any image and specify its density under the Assets tab or let it autodetect if the input filename has @2x or @3x.

Compression

Thanks to device fragmentation icons & splashes make a big part of your app's size. Use ImageOptim to reduce the size up to 50%. Just drop your entire project on the app and get a coffeee while it melts your laptop.

TiCons Server

This Node.js Express app simply wraps the TiCons NPM Module.

Input

Ideally an 2208x2208 image with main content in center 1104x1104 if you're cropping splashes (default).

TIP Submit the form (with optional input) for CLI and Module copy-paste examples.

Options

Apple Watches images generate to /apple-watch. You need to use them in the Xcode project yourself.

Set to the Titanium SDK version you use to get the right icons.

Change the Alloy base directory if you use something like JAST.

iOS adds a border radius for you and TiCons will not, but if you use the same flat square input for other platforms you might want to set a border radius of 10 for them to use.

Specify a ISO 639-1 language code to write iOS and Android splash screens to localized paths. You would need to run TiCons for every required language and then merge the resulting asset folders.

TiCons try to not crop this part of the input, measured from the center. It depends on the aspect ratio of the input and that of the output specs if it can.

Autodetect requires the filename of the input image to have @2x or @3x.

TiCons CLI & Module

Next time, use TiCons as CLI or NPM module, e.g. as part of CI or an app factory.

brew install imagemagick && sudo npm i -g ticons

TIP Submit the TiCons Server form (with optional input) for CLI and Module copy-paste examples.

Apple Watch

TiCons supports Apple Watch. These icons will generate to /apple-watch, but you'll have to add them to the XCode project manually as Titanium does support JavaScript Extentions yet.

iPhone 6(+)

TiCons has support for iPhone 6(+) icons and splashes.

App stores

TiCons also generates iTunes Connect and Google Play assets for you.

BlackBerry & Tizen

TiCons will generate a Tizen icon and both icon and splash for BlackBerry 10.

Filters

TiCons does not apply any filters. iOS automatically adds rounded corners, so the border radius option does not apply to iOS.

Android nine-patch splash

TiCons by default generates nine-patch images for Android, but you can disable this. You can disable Crop to have a effect similar to nine-patch by resizing the input to be contained in the target size and then fill the remainder by repeating the outer pixels.

Mobile Web

There is partial support for Mobile Web. HTML splash screens are currently not generated.

Contribute

Feel free to contact me at mail@fokkezb.nl or fork the CLI or server code and send a pull request.

© Fokke Zandbergen - License - Server 1.0.0 - CLI 0.23.1