KARPACH

WEB DEVELOPER BLOG

Save for android photoshop javascript

Due to the different pixel density of different android devices, a developer or a designer need to create different versions of graphic artifacts.

Recently I’ve been trying to create my first Android application and got tired of creating image artifacts for the different pixel density. As a result, I came up with the following PhotoShop javascript that automates a tedious task.

var docRef = activeDocument;    
function saveAs(path,filename,width,height,dpi) {
    savedState = docRef.activeHistoryState
    docRef.resizeImage (width, height, dpi);
    var folder = new Folder (path);
    if (!folder.exists)
    {
            folder.create();
    }
    pngFile = new File( path + filename)
    pngSaveOptions = new PNGSaveOptions()    
    app.activeDocument.saveAs(pngFile, pngSaveOptions, true, Extension.LOWERCASE)v
    docRef.activeHistoryState = savedState    
}

function main(isIcon)  {
    if (documents.length == 0) {
        alert("There are no documents open.");
        return;
    }
    try {        
            Path = app.activeDocument.path;
        }
    catch (exception) {
            docRef.saveAs(File.saveDialog ("Save image",["*.psd","*.png","*.jpg"]));
    } 
    Path = app.activeDocument.path;
    var Name = app.activeDocument.name.replace(/\.[^\.]+$/, '');     
    startRulerUnits = app.preferences.rulerUnits;
    app.preferences.rulerUnits = Units.PIXELS;    
    globSavedState = docRef.activeHistoryState;
    try {
        docRef.mergeVisibleLayers();
    }
    catch (exception) {
        alert("Please select visible layer.");
        return;
    }
    if (isIcon) {
        saveAs(Path + "/drawable-xxhdpi/" , Name + ".png",144,144,480);
        saveAs(Path + "/drawable-xhdpi/"  , Name + ".png",96,96,320);
        saveAs(Path + "/drawable-hdpi/"   ,Name + ".png",72,72,240);
        saveAs(Path + "/drawable-mdpi/"  ,Name + ".png",48,48,160);
        saveAs(Path + "/drawable-ldpi/"   ,Name + ".png",36,36,120);
    }
    else {
        var dpi = 480;
        saveAs(Path + "/drawable-xxhdpi/" , Name + ".png", docRef.width * dpi / docRef.resolution, docRef.height * dpi / docRef.resolution, dpi);
        dpi = 320;
        saveAs(Path + "/drawable-xhdpi/" , Name + ".png", docRef.width * dpi / docRef.resolution,docRef.height * dpi / docRef.resolution, dpi);
        dpi = 240;
        saveAs(Path + "/drawable-hdpi/" , Name + ".png", docRef.width * dpi / docRef.resolution ,docRef.height * dpi / docRef.resolution, dpi);
        dpi = 160;
        saveAs(Path + "/drawable-mdpi/" , Name + ".png", docRef.width * dpi / docRef.resolution,docRef.height * dpi / docRef.resolution, dpi);
        dpi = 120;
        saveAs(Path + "/drawable-ldpi/" , Name + ".png", docRef.width * dpi / docRef.resolution, docRef.height * dpi / docRef.resolution, dpi);
    }
    docRef.activeHistoryState = globSavedState;   
    app.preferences.rulerUnits = startRulerUnits;
    docRef.save();            
}

main(true) generates following:

480dpi 144x144 - drawable-xxhdpi
320dpi 96x96 - drawable-xhdpi
240dpi 72x72 - drawable-hdpi
160dpi 48x48 - drawable-mdpi
120dpi 36x36 - drawable-ldpi

main(false) generates images for android in respective folders, where dimensions are proportional to selected resolution / dpi.

For example:

Resolution: 480dpi
Width:150
Height:80

Becomes:

480dpi 150x80 - drawable-xxhdpi
320dpi 100x53 - drawable-xhdpi
240dpi 75x40 - drawable-hdpi
160dpi 50x27 - drawable-mdpi
120dpi 37x20- drawable-ldpi

See Save4Android github repository for more details.

Posted on March 17, 2013 by