Ich bin es leid, GameDev -Prozesse mit Dreiecken und Rechtecken zu testen. Es ist langweilig und uninteressant, also ist es an der Zeit, etwas in die Luft zu jagen. Aber wo fängt man an? - du fragst. Und meine Antwort ist, Sie müssen eine Sprite Explosion zeichnen, um genau zu sein, und dann ein Sprite Sheet für die Explosion zeichnen, das die Explosionsanimation darstellt.
Aber wie geht das? - Diese Frage hat mich verwirrt. Nachdem ich mehrere Foren und Video-Tutorials studiert hatte, beschloss ich, die erhaltenen Informationen in einer Lektion auf meiner Website zu sammeln. Wir haben also die folgende technische Aufgabe für diese Lektion:
- Zeichne einige Sprite Bilder, aus denen wir ein Sprite Sheet für die Explosionsanimation erstellen;
- Erstellen Sie das Sprite-Sheet selbst und speichern Sie es als PNG -Datei;
- Machen Sie alles mit der Software Adove Illustrator .
Sprite-Bilder Schritt für Schritt zeichnen
Hinweis Auch wenn Sie nicht daran interessiert sind, die Schritt-für-Schritt-Anleitung zu lesen, schlage ich vor, sofort auf das Video-Tutorial am Ende des Artikels zu verweisen, alles wird anschaulich beschrieben, gezeigt und erklärt.
Schritt eins
Erstellen Sie eine Canvas-Datei für Sprite-Bilder mit den Parametern 20 x 20 Pixel. Dies sind die Bilder, die wir in den nächsten Tutorials zu GameDev in Qt verwenden werden, um Kugelexplosionen zu implementieren. Wir werden Explosionen zeichnen.
Schritt zwei
Erstellen Sie nun ein rechteckiges Netz auf der Leinwand, das unsere Pixel trennt. In diesem Fall müssen die Rasterparameter so eingestellt werden, dass Breite und Höhe der Breite und Höhe des Sprites entsprechen, und die Anzahl der vertikalen und horizontalen Teiler sollte der Anzahl der Pixel in Höhe und Breite entsprechen , bzw. Vergessen Sie auch nicht, den Strich zu entfernen und den Hintergrund transparent zu machen, wir brauchen keine zusätzliche weiße Farbe im Sprite-Bild.
Schritt drei
Wählen Sie das Werkzeug Live Paint Bucket und klicken Sie mit der linken Maustaste auf eine Live Paint Fill-Gruppe in einem rechteckigen Raster. Live Paint füllt mit der ausgewählten Farbe den durch Trennzeichen begrenzten Bereich sowie eine Kontur oder einen Strich. Da das Raster die Leinwand Pixel für Pixel teilt, ist jedes Rechteck ein Pixel, das wir mit Fast Fill mit Farbe füllen.
Schritt vier
Nachdem wir alle 15 Sprite-Bilder gezeichnet haben, erstellen Sie in Adobe Illustrator ein neues Projekt, das alle 15 Sprite-Bilder enthält und 15 Bilder breit und ein Bild hoch ist. Das heißt, wir werden alle Bilder in einer Reihe zeichnen. Wir werden das Rechteck auch auf der gesamten Leinwand platzieren. Vergessen Sie nicht, den Strich zu entfernen und den Hintergrund transparent zu machen.
Schritt fünf
Als nächstes erstellen Sie ein Konturnetz im Rechteck, bestehend aus einer Zeile und 15 Spalten für alle Sprite Bilder.
Schritt sechs
Und jetzt, indem Sie zum Datei-Menüpunkt gehen, mit dem "Platzieren" -Punkt, fügen Sie alle vorbereiteten Sprites zum Projekt hinzu.
Schritt sieben
Jetzt beenden wir die Erstellung des Sprite Sheets , indem wir es als PNG Bild mit transparentem Hintergrund speichern. Nachdem wir das resultierende Bild gespeichert haben, überprüfen wir es, wie es in einem normalen Bildbetrachter aussieht.
Außerdem wird die gesamte Lektion im folgenden Video-Tutorial vorgestellt.