Wie gehe ich mit Sprite-Blättern mit ungleichmäßigen Sprite-Abmessungen um?

Wie kann ich für ein Spritesheet mit ungleichmäßigen Sprite-Abmessungen die Begrenzungsrechtecke für jedes einzelne Sprite ermitteln (dh die blauen Kästchen in der folgenden Abbildung / ich habe nur einige Beispiele gezeichnet)?

Was ich feststellen möchte, sind: offset_x, offset_y, width, height

Bisher habe ich nur Spritesheets verwendet, auf denen alle Sprites identische Abmessungen haben. In diesem Fall müssen Sie lediglich den x- und den y-Versatz angeben, um ein bestimmtes Sprite zu erhalten. Bei Spritesheets mit ungleichmäßigen Abmessungen funktioniert dies jedoch nicht.

EDIT: Nachdem ich die Kommentare und Antworten gelesen hatte, formulierte ich meine Frage neu, um sie umfassender zu gestalten. der eigentliche Prozess der Verwendung eines Spritesheets in einem Spiel. Zuvor enthielt die Frage die Punkte, warum Spritesheets mit ungleichmäßigen Abmessungen erstellt werden und wie ich damit umgehen kann.

Die meisten Sprite-Sheets mit nicht identischen Dimensionen haben normalerweise eine Art Metadaten mit dem Anker des Sprites. Es gibt viele Tools, mit denen Sie beispielsweise vollständige Alpha-Pixel entfernen und die benötigten Daten bereitstellen können, damit diese Daten nicht manuell generiert werden.

Wenn Sie diese Metadaten nicht haben, müssen Sie sie selbst verfassen. Der genaueste Weg ist der, den Sie in Ihrer Frage gesagt haben, und zwar einfach von Hand. Es kann eine Weile dauern, ist aber wahrscheinlich schneller als das Erstellen neuer Sprites.

Sie können das Bild analysieren, um die Begrenzungsrechtecke der einzelnen Sprites zu lokalisieren, diese Begrenzungsrechtecke zu sortieren (möglicherweise durch Erhöhen von mindestens X, dann Y), und Sie erhalten eine Reihe von Begrenzungsbereichen, die den Rahmen des Sprite-Blatts entsprechen.

Da dieser Vorgang relativ teuer sein kann, möchten Sie ihn wahrscheinlich offline ausführen, z. B. als Teil des Erstellungsprozesses für Ihr Spiel. Anschließend können Sie die Informationen zum Begrenzungsbereich in eine Datei serialisieren, die Sie mit dem entsprechenden Sprite-Sheet-Bild speichern. Zur Laufzeit laden Sie sowohl das Bild als auch die Grenzdefinitionsdatei und verfügen über die Informationen, die Sie für den Zugriff auf jedes einzelne Sprite benötigen.

Das ist aber leichter gesagt als getan. Im Wesentlichen sollten Sie die Feature-Erkennung und speziell die Blob-Erkennung durchführen, bei denen es sich um Bildverarbeitungsprobleme handelt. Sie können das Bild auch mit einem Schwellenwert versehen (Schwarzweiß) und eine Kantenerkennungstechnik verwenden . Die relevante Mathematik, die hinter diesen Techniken steckt, wird in diesen Links viel besser erklärt als ich, und falls Sie nicht in der Lage sind, diese Mathematik selbst zu implementieren, stehen Ihnen einige Bibliotheken zur Verfügung, die Sie unterstützen können. Die folgenden Links schienen mir am vielversprechendsten zu sein:

• AForge hat eine Bildverarbeitungskomponente (für C #); Hier ist ein relevantes Anwendungsbeispiel
• OpenCV (eine C ++ Bibliothek mit einem C # Wrapper )
• Dieser Thread stellt eine Blob-Erkennungsbibliothek für den C # -Wrapper für OpenCV bereit.

Ich habe mein eigenes Tool für diese Art von uneinheitlichem Spritesheet erstellt. Es ermöglicht das Bearbeiten von Offsets und so weiter. Hier ist ein Screenshot, um Ihnen eine Idee zu geben:

Schauen Sie sich den Texturepacker an

http://www.texturepacker.com/

Es gibt eine Datei wie diese aus (abhängig von Ihren bevorzugten Einstellungen)

    {
    "filename": "image_front_1",
    "frame": {"x":1,"y":160,"w":34,"h":52},
    "rotated": false,
    "trimmed": false,
    "spriteSourceSize": {"x":0,"y":2,"w":36,"h":40},
    "sourceSize": {"w":36,"h":40}
},
{
    "filename": "image_front_2.png",
    "frame": {"x":36,"y":160,"w":34,"h":52},
    "rotated": false,
    "trimmed": false,
    "spriteSourceSize": {"x":0,"y":0,"w":36,"h":42},
    "sourceSize": {"w":36,"h":42}
},
{
    "filename": "image_front_3.png",
    "frame": {"x":71,"y":160,"w":34,"h":52},
    "rotated": false,
    "trimmed": false,
    "spriteSourceSize": {"x":0,"y":0,"w":34,"h":52},
    "sourceSize": {"w":36,"h":42}
},
{
    "filename": "image_front_4.png",
    "frame": {"x":106,"y":160,"w":34,"h":52},
    "rotated": false,
    "trimmed": false,
    "spriteSourceSize": {"x":0,"y":0,"w":34,"h":52},
    "sourceSize": {"w":36,"h":42}
}

Mit diesen Daten können Sie einfach die einzelnen Rechtecke aus dem Bild ziehen.

spritebuddy.com hat für mich großartig funktioniert. Auf der Website selbst konnte keine Hilfe gefunden werden, in diesem Google Groups-Beitrag wird dies jedoch sehr gut erläutert. Die Grenzen für Ihre Sprites werden automatisch erraten, Sie können sie anpassen UND Sie können sie in Animationssequenzen anordnen. Anschließend wird eine Metadatendatei für all dies entweder in JSON oder XML ausgegeben. Dann müssen Sie nur noch diese Datendatei in Ihrem Spiel analysieren, um die richtigen Begrenzungsrechtecke zu erhalten.