Wie kann ich ein Spritesheet einfach zusammenbauen?

Für ein Projekt muss ich mehrere 8x8-Kacheln entwerfen und sie in einem 256*224-Rahmen zusammenbauen.

Mein Problem ist, dass ich, sobald ich alle 8px x 8px-Kacheln habe, nicht herausfinden kann, wie ich einfach auf sie zugreifen/zusammenbauen kann, ohne VIEL Öffnen, Kopieren, Einfügen, Schließen usw. von Dateien zu erfordern.

Gibt es einen bequemeren Weg, dies zu tun? Idealerweise hätte ich ein Panel mit all meinen Kacheln und müsste sie nur auf meiner Leinwand verschieben. Und noch idealer würde es mit Photoshop funktionieren (aber ich bin offen dafür, bei Bedarf auch eine andere Software zu verwenden).

Antworten (1)

Eine schnelle Suche führt zu dieser Seite: ( http://boxhacker.com/blog/?s=layertoanimation ), die die Anweisungen dazu enthält. Um die nützlichen Informationen auf diese Seite zu bringen, fasse ich zusammen:

) Laden Sie Ihre Kacheln in ein einzelnes Dokument als Ebenen mit Photoshop "Datei> Skripte> Dateien zum Stapeln laden".

) Verwenden Sie ein Skript (Javascript), um die Größe des Dokuments zu ändern, und durchlaufen Sie dann die Ebenen, wobei Sie die Position der Ebenenelemente übersetzen

Diese Seite enthält ein Skriptbeispiel, das ich geändert habe. Ich habe es auf einem Sprite-Sheet mit 16 Spalten x 10 Zeilen getestet. Es ist langsam.

Code folgt (Javascript. Code als Textdatei speichern, bei Bedarf mit js- oder jsx-Dateierweiterung umbenennen, dann über das Menüelement "Datei> Skripte in Photoshop ausführen). Die ersten 5 Zeilen sind konfigurierbare Variablen, in denen Sie die Kachelgröße und angeben neue Dokumentgröße.

Ich kann diesbezüglich keine technische Unterstützung geben, aber Sie können auf der Hilfeseite von Adobe nach Referenzinformationen zum Skripting suchen.

var newDocWidth = 16*8;
var newDocHeight = 10*8;
var tileWidth = 8;
var tileHeight = 8;
var bottomLayerFirst = false;


var appPrefRulerUnits = app.preferences.rulerUnits;

var rows = newDocHeight / tileHeight;
var cols = newDocWidth / tileWidth;

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

    var numLayers = docRef.artLayers.length;    

    if ( numLayers === (rows*cols) )
    {
        var spriteX = docRef.width;
        var spriteY = docRef.height;    

        app.preferences.rulerUnits = Units.PIXELS;
        docRef.resizeCanvas( tileWidth * cols, tileHeight * rows, AnchorPosition.TOPLEFT );

        if ( bottomLayerFirst)
        {
            var currentLayer = numLayers-1;
            var layerIndexIncrement = -1
        }else
        {
            var currentLayer = 0;
            var layerIndexIncrement = 1
        }
        for (r=1;r <= rows ;r++) 
        {   
            for ( c=1; c<= cols;c++)
            {
                docRef.artLayers[currentLayer].visible = true;

                var movX = (c-1)*tileWidth;
                var movY = (r-1)*tileHeight;

            docRef.artLayers[currentLayer].translate(movX, movY);
            currentLayer = currentLayer + layerIndexIncrement;
            }

        }
    }else
    {
        alert("Number of layers ("+ numLayers +") does not match desired canvas size.\nEnsure tilesizes in script match and you have the proper number of layers in document (should be " + (cols * rows)+ ")");
    }
}else
{
    alert("Sorry must have more than 1 image open in photoshop to work");
}

app.preferences.rulerUnits =  appPrefRulerUnits;
Wow, wusste nicht einmal, dass Sie Javascript in Photoshop verwenden können, eine ganz neue Welt von Möglichkeiten. Danke, genau das habe ich gebraucht
Beachten Sie, dass das Schließen der Ebenenpalette und das Reduzieren der Verlaufsebenen vor dem Ausführen des Skripts die Geschwindigkeit erhöhen kann.
Das ist hervorragend