Überblick
Sprite-Sheets und Bildraster lokal öffnen, präzise ausrichten, gewünschte Zellen auswählen und als PNG-Dateien exportieren.
Funktionen
- Lokale Bildverarbeitung
- Präzise Rasterausrichtung
- Mehrfachauswahl
- PNG-Export
Anleitung
Diese Betriebsanleitung beschreibt jedes Bedienelement der individuellen Arbeitsoberfläche. Die eingebetteten Bedienelemente sind sichere, nicht verdrahtete Kopien der AT-Komponenten; sie zeigen den realen Aufbau, lösen in der Dokumentation aber keine Bildbearbeitung aus.
Quellbilder
| Element | Wirkung |
|---|---|
| Repository | Öffnet die Repository-Subview. Aktivieren oder Doppelklicken lädt das gewählte PNG-, JPEG- oder WebP-Bild. |
| Grid | Öffnet die Rastereigenschaften. |
| Alle kompatiblen Bilder anzeigen | Hebt den Standardfilter sprite-sheet auf und zeigt alle kompatiblen Bildressourcen. |
| Nur Sprite Sheets anzeigen | Aktiviert den Filter sprite-sheet wieder. |
| Listenansicht / Rasteransicht | Wechselt die Darstellung der Repository-Ergebnisse. |
| Repository aktualisieren | Liest die Repository-Ergebnisse erneut. |
| Sidebar schließen / öffnen | Klappt linke oder rechte Sidebar ein beziehungsweise wieder auf. |
| Sidebar-Trenner ziehen / Pfeiltasten / Doppelklick | Ändert die Breite der jeweiligen Sidebar; Doppelklick stellt die Standardbreite wieder her. |
| Bild direkt hierher ziehen | Lädt eine lokale PNG-, JPEG- oder WebP-Datei. Ein bereits geladenes Bild wird erst nach Bestätigung ersetzt. |
| Abbrechen | Behält im Dialog „Quellbild ersetzen?“ das aktuelle Bild. |
| Ersetzen | Lädt das neu gewählte Bild; Raster und Zellkorrekturen bleiben erhalten. |
Repository-Subview – visueller Ausschnitt
Die Instanz zeigt Standardfilter und Ansichtsaktionen. In der echten Subview erscheinen an dieser Stelle die geladenen Vorschaubilder.
Haupttoolbar
| IconButton | Button | Wirkung |
|---|---|---|
| Crop-Konfiguration übernehmen | Öffnet die Exportansicht. Ohne gültiges Quellbild und gültige Zellen bleibt der Button deaktiviert. | |
| Rückgängig | Stellt den letzten Raster-, Zell-, Sperr- oder Erkennungsschritt wieder her. | |
| Grid zurücksetzen | Setzt Rastergeometrie, Zellversätze, Auswahl, Sperren und Alpha-Schwelle auf die gespeicherte Ausgangskonfiguration zurück. | |
| Ansicht einpassen | Zentriert und skaliert das Quellbild erneut in den verfügbaren Canvas. | |
| Alpha 32 / 64 / 128 / 192 / 224 | Startet die automatische Rastererkennung mit der angegebenen Sichtbarkeitsschwelle. Hohe Werte ignorieren schwache Alphapixel stärker. | |
| Raster manuell auswählen | Aktiviert oder beendet die Bearbeitung des gesamten Rasterrahmens auf dem Canvas. | |
| X fixieren | Sperrt oder entsperrt die horizontale Bewegung der gewählten Zelle. | |
| Y fixieren | Sperrt oder entsperrt die vertikale Bewegung der gewählten Zelle. | |
| Alle Slices am sichtbaren X-Inhalt des markierten Masters ausrichten | Überträgt die gemessene sichtbare linke Kante der Masterzelle auf alle Zellen. | |
| Alle Slices an der sichtbaren unteren Y-Kante des markierten Masters ausrichten | Überträgt die gemessene sichtbare Unterkante der Masterzelle auf alle Zellen. | |
| Zelle zentrieren | Entfernt den individuellen X-/Y-Versatz der gewählten Zelle. |
Grid-Eigenschaften und Canvas
Property Grid – visueller Ausschnitt
Die Zahlen sind ein Dokumentationsbeispiel. In der echten Property Box werden Änderungen unmittelbar auf Raster und Vorschauen übertragen.
| Element | Wirkung |
|---|---|
| Zeilen / Spalten | Ändert die Anzahl der Rasterzellen; vorhandene Zellversätze werden soweit möglich übernommen. |
| Zellbreite / Zellhöhe | Ändert die Größe jedes Ausschnitts. |
| Abstand X / Abstand Y | Ändert den Abstand zwischen den Zellen. |
| Offset X / Offset Y | Verschiebt den Startpunkt des gesamten Rasters. |
| Mausrad | Vergrößert oder verkleinert die Canvasansicht. |
| Leertaste und Ziehen | Verschiebt die Ansicht, ohne Bildkoordinaten zu verändern. |
| Pfeiltasten | Verschieben das ausgewählte Raster oder die ausgewählte Zelle pixelweise in Pfeilrichtung; Shift verwendet Zehnerschritte. Gehaltene Tasten enden beim Loslassen und bilden gemeinsam einen Undo-Schritt. |
| Rasterrahmen oder Raster-Verschiebegriff ziehen | Verschiebt das gesamte Raster direkt in Bildkoordinaten. |
| Raster-Größengriff ziehen | Ändert Zellbreite und Zellhöhe des gesamten Rasters. |
| Zelle am Mittelpunkt ziehen | Verschiebt nur die ausgewählte Zelle. Aktive Achsensperren werden berücksichtigt. |
Slice-Vorschau und Zoom
Vorschaukarte und Zoomtoolbar – visuelle Ausschnitte
| Element | Wirkung |
|---|---|
Vorschaukarte Rxx · Cxx | Wählt die Zelle als Master und scrollt sie in den sichtbaren Bereich. Ungültige Ausschnitte werden gekennzeichnet. |
Rxx · Cxx vergrößern | Öffnet die vergrößerte Einzelansicht; der Button bleibt solange markiert. |
| Pfeiltasten in der Einzelansicht | Bewegen das sichtbare Quellbild in Pfeilrichtung unter dem festen Ausschnitt; die Box und die Scrollposition bleiben ruhig. |
| Slice direkt ziehen | Verschiebt das sichtbare Quellbild unter dem festen Ausschnitt und aktualisiert denselben Zellversatz wie die Tastatur. |
| Mausrad in der Einzelansicht | Zoomt zwischen 100 und 400 Prozent. |
| Verkleinern / Vergrößern | Ändert den Slice-Zoom zwischen 100 und 400 Prozent. |
| Zoom zurücksetzen | Setzt den Slice-Zoom auf 100 Prozent. |
| Zoom schließen | Schließt die Einzelansicht. |
| Lineal und Messwerte | Zeigen Zellkoordinaten und transparente Abstände entlang des Mittelfadenkreuzes; zu dichte Zahlen werden automatisch ausgeblendet. |
| Sidebar schließen | Klappt die Vorschau-Sidebar ein. |
Export
Exportansicht – visueller Ausschnitt
Die echte Exportansicht ergänzt darunter die auswählbaren Slice-Karten und je Frame das editierbare Dateinamensuffix.
| Element | Wirkung |
|---|---|
| Export schließen | Schließt die Exportansicht ohne Ausführung. |
| Movement-ID | Bestimmt ID, Name und Dateinamenspräfix des Movement-Containers. |
| Frame-Dauer (ms) | Legt die Dauer jedes Frames zwischen 16 und 60000 ms fest. |
| Bewegung wiederholen | Schaltet die Loop-Eigenschaft des Movements um. |
| Beim Speichern Größe ändern | Aktiviert die Skalierung der exportierten Frames. |
| Modus Original / Prozent / Absolut | Behält die Zellgröße bei oder berechnet eine prozentuale beziehungsweise feste Zielgröße. |
| Seitenverhältnis beibehalten | Koppelt Breite und Höhe bei absoluter Skalierung. |
| Breite / Höhe / Prozent | Legt die Zielgröße innerhalb der erlaubten Grenzen fest. |
| Interpolation | Wählt Nearest, mittlere oder hohe Glättungsqualität. |
| Slice-Vorschau anklicken | Nimmt den Frame in die Exportauswahl auf oder entfernt ihn. |
| Dateiname | Ändert den individuellen Suffix eines Frames. |
| Im Repository speichern | Erzeugt lokal den Movement-Container und speichert ihn mit typisierten Metadaten über den Repository-Host. Ohne ausgewählte gültige Zelle bleibt der Button deaktiviert. |
Automatische Speicherung
Jede Änderung der Raster- und Exportkonfiguration wird unmittelbar persistent gespeichert. Repository-Quelle, Auswahl, Sperren und Sidebarzustände werden zusätzlich im ToolStorage gespeichert. Ein lokal abgelegtes Bild wird nicht ohne ausdrückliche Repository-Ablage dupliziert.
Voraussetzungen
Ein unterstütztes PNG-, JPEG- oder WebP-Bild ist erforderlich. Die Webversion benötigt einen aktuellen Browser mit Canvas- und Download-Unterstützung.
Schritte
Bild öffnen, Alpha-Preset ausführen, Raster prüfen, gewünschte Zelle wählen und das Ergebnis speichern beziehungsweise herunterladen.
Parameter
Zeilen, Spalten, Zellbreite, Zellhöhe, Abstände, Offsets und Alpha-Schwelle bestimmen die Rastergeometrie.
Ergebnis
Die Desktopversion erzeugt eine Sprite-Bewegung; die Webversion lädt die gewählte Zelle als PNG herunter.
Typische Fehler
Ein unregelmäßiges Raster oder zu schwache Trennbereiche können eine manuelle Korrektur erfordern.
Fehlerbehebung
Ein anderes Alpha-Preset wählen, Rasterwerte korrigieren und prüfen, ob das Quellbild Transparenz besitzt.
Datenquellen
akyao.graphics.image-crop-grid
Keine eingebettete externe Datenquelle. Eingegebene Dokumente und Bilder stammen vom Benutzer.
Runtime-Abhängigkeiten nach Tool
- @codemirror/autocomplete 6.20.3: MIT
- @codemirror/commands 6.10.4: MIT
- @codemirror/language 6.12.4: MIT
- @codemirror/lint 6.9.7: MIT
- @codemirror/merge 6.12.2: MIT
- @codemirror/search 6.7.1: MIT
- @codemirror/state 6.7.1: MIT
- @codemirror/view 6.43.8: MIT
- @lezer/common 1.5.2: MIT
- @lezer/highlight 1.2.3: MIT
- @lezer/lr 1.4.10: MIT
- @marijn/find-cluster-break 1.0.3: MIT
- @tabler/icons-react 3.47.0: MIT
- @tabler/icons 3.47.0: MIT
- codemirror 6.0.2: MIT
- crelt 1.0.7: MIT
- react-dom 19.2.8: MIT
- react 19.2.8: MIT
- scheduler 0.27.0: MIT
- style-mod 4.1.3: MIT
- w3c-keyname 2.2.8: MIT