Ein Tileset mit Rändern und Zwischenabständen ohne verschobene Kacheln aufteilen
Die erste Kachel sieht richtig aus, aber jede weitere Kachel entlang des Sheets enthält mehr von ihrer Nachbarkachel. Dieses Muster bedeutet normalerweise, dass der Abstand als Teil der Kachel mitgezählt oder vollständig ignoriert wurde. Miss drei unabhängige Werte, bevor du das Sheet zerschneidest.
Kachelgröße, Rand und Zwischenraum unabhängig messen
Kachelbreite und -höhe beschreiben die Pixel, die jedes Ausgabebild enthalten soll. Der Außenrand bezeichnet den gleich breiten Rand auf allen vier Seiten. Der Kachelabstand bezeichnet die Lücke zwischen benachbarten Kacheln. Bei einer 32-px-Kachel mit anschließendem 1-px-Abstand beginnt der nächste Zuschnitt 33 px weiter, exportiert wird aber weiterhin ein 32-px-Bild.
Prüfe die Quelle in Originalgröße in einem Editor mit Pixelkoordinaten. Schätze nicht anhand eines skalierten Browser-Vorschaubilds. Dieser Teiler hat einen Randwert und einen Abstandswert. Asymmetrische Ränder oder unterschiedliche horizontale und vertikale Lücken erfordern deshalb Vorverarbeitung oder manuelles Ausschneiden.
Eine Quelle mit 135 × 102 durcharbeiten
- Lade ein PNG oder WebP mit vier Spalten und drei Zeilen aus 32 × 32 großen Kacheln.
- Setze Kachelbreite auf 32, Kachelhöhe auf 32, Außenrand auf 2 und Kachelabstand auf 1.
- Lasse Überspringen und Duplikaterkennung für den ersten Test deaktiviert. Die erwartete Ausgabe sind dann zwölf Dateien.
- Extrahiere, prüfe die Vorschau und öffne dann die ZIP-Datei, um die letzte Spalte und die unterste Reihe zu kontrollieren. Die Vorschau zeigt nur die ersten sechzehn exportierten Kacheln.
Die Breite beträgt 2 × 2 + 4 × 32 + 3 × 1 = 135. Die Höhe beträgt 2 × 2 + 3 × 32 + 2 × 1 = 102. Die X-Positionen der Zuschnitte sind 2, 35, 68 und 101; die Y-Positionen sind 2, 35 und 68. Mit diesen Zahlen kannst du die Einstellungen konkret prüfen, ohne zu raten.

Fehlermuster erkennen, bevor du Einstellungen änderst
| Muster | Wahrscheinliches Messproblem | Prüfen |
|---|---|---|
| Alle Kacheln gleichmäßig verschoben | Falscher Außenrand | Koordinate der ersten Kachel |
| Zunehmende horizontale Verschiebung | Falsche Breite oder falscher Zwischenabstand | Abstand zwischen Spaltenanfängen |
| Zunehmende vertikale Verschiebung | Falsche Höhe oder falscher Zwischenabstand | Abstand zwischen Zeilenanfängen |
| Letzte Reihe oder Spalte fehlt | Unvollständige Schlusszellen | Tatsächliche Bildabmessungen und Rand |
Es werden nur vollständige Zellen extrahiert. Wenn du einen größeren Rand eingibst, als tatsächlich vorhanden ist, kann die letzte Kachel außerhalb des zulässigen Rasters liegen. Das Werkzeug streckt keinen unvollständigen Rest, um daraus eine vollständige Kachel zu machen. Korrigiere die Maße oder bereite die Quelle entsprechend vor, statt den Fehler durch eine andere, unpassende Abmessung auszugleichen.
Überspringen und Duplikaterkennung erst bei richtigem Raster aktivieren
Eine übersprungene leere Zelle hat überall Alpha 0. Ein einziges schwaches Pixel reicht aus, damit sie erhalten bleibt. Die Duplikaterkennung prüft die exakte RGBA-Gleichheit, einschließlich der unter Alpha 0 verborgenen RGB-Werte. Ähnliche Texturen werden nicht zusammengefasst, und zwei optisch identische transparente Bilder können getrennt bleiben.
Nach dem Aktivieren dieser Optionen müssen Dateinummer und Nummer der Quellzelle nicht übereinstimmen. Behalte tilemap.json: Die Zellen darin erfassen Zeilen- und Spaltenpositionen, mit einer Kachel-ID für eine erhaltene Ressource oder null für eine übersprungene leere Zelle. Duplizierte Positionen können auf dieselbe ID verweisen. Das Manifest ist eine Übersicht dieser Extraktion, keine fertige Tilemap für eine Engine.
Zuschnittfehler von Nähten in der Engine unterscheiden
Wenn das exportierte PNG bereits den Rand einer Nachbarkachel enthält, korrigiere die Zuschnitteinstellungen. Sind die PNGs sauber, aber im Spiel erscheinen beim Bewegen der Kamera dünne Linien, prüfe Filterung, Skalierung, Texturabstand und Importkonfiguration der Engine. Saubere Kacheln mit beliebigen zusätzlichen Pixeln erneut auszuschneiden, verdeckt den Unterschied und kann die Grafik beschädigen.
Arbeitsablauf ausprobieren
Stelle Kachelbreite, Höhe, Außenrand und Zwischenabstand ein und exportiere anschließend PNG-Kacheln und ein Positionsmanifest.
Tileset-Teiler öffnen →