Creating a sprite sheet using Photoshop

[danno]

I'm using photoshop 2020 but this should still work for earlier versions.

I used scripts, get it here

Layers To Sprite Sheet.js

GitHub Gist: instantly share code, notes, and snippets.

gist.github.com

Place the script inside

program files > adobe > adobe photoshop > presets > scripts

load up photoshop

file > scripts > load files into stack

select a group of individual sprites, I'm using a character from another mod but you can get individual sprites from other programs like fighter factory

when the sprites have been stacked into layers go to

file > scripts > layers to sprite sheet

fill in a background layer with colour and then merge visible layers.

I'm creating sprite sheets because I am redoing character palettes so thought I'd share.

javascript just in case link dies

// Put this file in Program Files\Adobe\Photoshop\Presets\Scripts\
// In PhotoShop menu File > Scripts > Layers To Sprite Sheet

// Arrange layers into a sprite sheet.

if (documents.length > 0) {
    var docRef = activeDocument;

    var numLayers = docRef.artLayers.length;
    var cols = docRef.width;

    var spriteX = docRef.width;
    var spriteY = docRef.height;

    app.preferences.rulerUnits = Units.PIXELS;

    var hasBackground = false;
    var layerNumbers = [];
    for (i = 0; i < numLayers; i++) {
        if (docRef.artLayers[i].isBackgroundLayer) {
            docRef.artLayers[i].visible = false;
            hasBackground = true;
        } else {
            layerNumbers.push(i);
        }
    }

    var numSprites = layerNumbers.length;

    var rowSize = prompt("How many sprites per row?", "8", "Configure stylesheet");

    var rowCount = Math.ceil(numSprites / rowSize);
    var emptySpaces = (rowSize * rowCount) - numSprites;

    while (rowSize && !confirm("Is " + rowSize + "x" + rowCount + " sheet OK? There will be " + emptySpaces + " empty spaces.")) {
        rowSize = prompt("How many sprites per row?", "8", "Configure stylesheet");
        rowCount = Math.ceil(numSprites / rowSize);
        emptySpaces = (rowSize * rowCount) - numSprites;
    }

    if (rowSize) { // cannot return from function in photoshop :/
        var reverse = confirm("Use reverse order? Photoshop creates new sprites on top, with reverse order first sprite will be the most bottom layer");
        if (reverse) {
            layerNumbers.reverse();
        }

        var newX = rowSize * spriteX;
        var newY = rowCount * spriteY;

        docRef.resizeCanvas(newX, newY, AnchorPosition.TOPLEFT);

        var startOffset = hasBackground ? 2 : 1;
        startOffset += emptySpaces;

        for (i = 0; i < rowSize; i++) {
            for (j = 0; j < rowCount; j++) {
                var layer = rowSize * j + i;
                if (layer >= numSprites) {
                    continue;
                }
                layer = layerNumbers[layer];
                try {
                    if (docRef.artLayers[layer].isBackgroundLayer) {
                        docRef.artLayers[layer].visible = 0;
                    } else {
                        docRef.artLayers[layer].visible = 1;

                        var movX = spriteX * i;
                        var movY = spriteY * j

                        docRef.artLayers[layer].translate(movX, movY);
                    }
                } catch (e) {
                    alert("Layer " + layer + " at row:col " + j + ":" + i + " failed: " + e.message);
                }
            }
        }
    }
}

 

[O Ilusionista]

That could very handy, thanks for sharing.

If you already have all the layers separated into different files, then I recommend a different approach:

ChronoCrash

Home of the OpenBOR Community.

www.chronocrash.com

This is what I use and its incredible useful to split and combine images.

 

[danno]

Thanks buddy I could never find StitchStudio online, I appreciate you reuploading it.

 

[O Ilusionista]

Thanks buddy I could never find StitchStudio online, I appreciate you reuploading it.

its under GFX Utils on the original link, this is why you can't find it