Construct2 Jump and Run

Aus Debacher-Wiki
Zur Navigation springenZur Suche springen

Die beliebten Jump&Run-Spiele sind mit Construct2 relativ einfach zu realisieren. Der folgende Text beschreibt den Aufbau eines derartigen Spieles und benutzt dabei Abbildungen aus dem Mediabundle von Scirra, das jeder User einer bezahlten Version herunterladen kann. Daher werde ich die Abbildungen hier nicht zum Download anbieten und mich bei den Pfaden zu den Grafikdateien auf das Mediabundle beziehen.

spielbare Version

.capx Datei

Derartige Spiele werden bei Scirra meistens als Platform-Games bezeichnet, was sicher mit dem Behavior zu tun hat.

Wir legen also wieder ein neues Projekt an und nennen es Jump&Run. Für das Projekt sollten wir die Property Window Size gleich etwas erhöhen, 800x600 ist ein sinnvoller Wert.

Der Hintergrund

Für das Spiel benötigen wir ein sehr breites Hintergrundbild, oder eines, welches sich horizontal kacheln lässt. Im Ordner \Sprites\Jungle Platformer\Background Image\ befindet sich eine passende Abbildung.

Jumpandrun1.png

Dies Abbildung laden wir als TiledBackground, nennen sie TiledBackground und geben als Größe an 4000x2048. Damit wiederholt sich die Abbildung knapp viermal. Die gleiche Größe geben wir für das Layout an. Beim Hintergrund achten wir darauf, dass seine Position 0,0 ist.

Nun geht es weiter im Reiter Layers, hier nennen wir den aktuellen Layer in Background um, setzen seine Property Parallax auf 80,100 dann sichern wir die Ebene und fügen einen neuen Layer Main ein, den wir aktiv setzen. Die Eigenschaft Parallax legt fest, wie stark die Ebene dem Spieler folgt. In X-Richtung also deutlich langsamer, dadurch wirkt der Hintergrund tiefer. In Y-Richtung bleiben wir bei 100, ansonsten klappt das mit dem Untergrund nicht so richtig. Wer keinen Untergrund nutzt, sondern nur Plattformen kann auch hier neu setzen.

Für den nächsten Schritt sollten wir gleiche wieder im Menü unter View die Funktion Snap to grid aktivieren.

Der Untergrund

Wir brauchen jetzt festen Boden unter den Spielfiguren, auch wenn es nur einen Plattform ist. Dafür steht ein sehr umfangreicher Sprite-Strip zur Verfügung unter \Sprites\Jungle Platformer\Tiles\.

Jumpandrun2.png

Also ein Doppelklick in den Arbeitsbereich, Sprite auswählen und dann im Fenster Animation frames über Import sprite strip diese Abbildung auswählen. Die Abmessungen sind 12x12, das Einladen dauert also etwas. Wir löschen gleich wieder den leeren Frame mit der Nummer 0. Nach dem Schließen des Editors benennen wir die Abbildung in Tiles um.

Nun ist eine Instanz von Tiles im Arbeitsbereich zu sehen. Wir ergänzen das Behavior namens Solid, und setzen die Animation speed auf 0, wir wollen ja keine Animation.

Mit zwei weiteren Instanzen dieses Tiles lässt sich dann eine Plattform erzeugen, die zugehörigen Inital frames sind der Reihe nach 1, 10, 13. Setzt man die drei passend nebeneinander, dann ergibt sich eine Plattform. Diese Plattform kann man dann als Ganzes Markieren und beliebig oft kopieren.

Jumpandrun3.png

Bei den meisten Spielen, die man beschrieben findet, kann der Spieler nur auf den Plattformen laufen, nicht auf dem Untergrund. Um ihm dies zu ermöglichen benötigt man ein Sprite mit dem Solid Behavior, welches den Untergrund bildet. Im einfachsten Fall ist das eines der Tiles, die Frame Nummer spielt keine Rolle, man muss es nur auf etwas über 4000 Pixel strecken und unsichtbar machen. Wer möchte kann natürlich auch zwei Elemente nehmen und dazwischen eine Lücke lassen, durch die der Spieler herunterfallen kann.

Jumpandrun4.png

Das Spielfeld kann man nun natürlich beliebig gestalten.

Der Spieler

Für die Spielfigur stellt Scirra sehr viele Animationen zur Verfügung. Das ist zwar sehr schön, aber nicht unbedingt notwendig. Wir laden also ein Sprite und wählen im Animation frame die Funktion Import sprite strip. Als Datei nehmen wir den Streifen Idle.PNG aus dem Verzeichnis \Sprites\Jungle Platformer\Player\Idle\. Wir nennen die Animation Idle und stellen die Speed auf 9 und Loop auf Yes ein.

Jumpandrun5.png

Die Animation muss jetzt nachbearbeitet werden. Um die meisten Abbildungen herum ist noch zuviel Leerraum. Um den zu beseitigen, benutzt man die Funktion Crop, die sich gleich auf alle Abbildungen einer Animation anwenden lässt, wenn man die Shift-Taste gedrückt hält.

Jumpandrun6.png

Eine zweite Kleinigkeit besteht im Bezugspunkt (Origin), der normalerweise in der Mitte des Sprites liegt. Für unsere Anwendung sollte der Punkt aber unten zwischen den Füßen liegen. Dazu aktiviert man Image Points, klickt mit der rechten Maustaste auf Origin und kann dann auf Quick assign gehen und dort Bottom auswählen. Damit man das nicht für jeden Frame einzeln machen muss wählt man anschließend Apply to whole animation.

Jumpandrun7.png

Entsprechend laden wir jetzt die übrigen Animationen, im Animations-Fenster wählen wir aus dem Kontextmenü Add Animation und wählen dann im Animations Fenster die jeweilige Datei (Import sprite strip). Jede der Dateien muss dann wieder mit Crop und Origin bearbeitet werden.

Jumpandrun8.png

Zum Abschluss bekommt der Spieler noch folgende Behavior zugeordnet:

  • Platform
  • ScrollTo
  • Flash

Für das Platform Behavior setzen wir noch die Properties:

  • Jump strength: 1100
  • Gravity: 2500

Nun kann es an die Bewegung des Spielers gehen, die erfolgt wieder im Event sheet.

Bewegung des Spielers

Über das Platfom Behavior lässt sich der Spieler bereits steuern, das ist mit eingebaut. Was eigentlich nur noch beeinflusst werden muss sind die Animationen. Zusätzlich kann man die Animation noch Spiegeln, immer dann, wenn der Spieler nach Links gesteuert wird.

Platform1.png

Beim Landen des Spielers sind zwei Fälle zu unterscheiden, eineseits kann der Spieler nach oben gesprungen seine, andererseits kann er auch im Lauf von einer Plattform auf eine andere herunter gelaufen sein.

Das letzte Ereignis dient dazu das Spiel neu zu starten, wenn der Spieler das Layout verlassen hat, was in der Regel mit einem Absturz verbunden war.

Der Enemy

Ganz analog zum Spieler gibt es unter \Sprites\Jungle Platformer\Enemies\Snail\ einen Sprite strip namens Snail.PNG.

Jumpandrun10.png

Also wieder ein Sprite einfügen, im Animation frame über import sprite strip die Datei auswählen und Crop auf die Abbildungen anwenden. Auch hier sollte der Bezugspunkt nach unten gesetzt werden. Bei den Properties setzen wir Speed auf 15 und Loop auf Yes.

Wir benennen das Sprite Enemy und fügen ein Plattform Behavior hinzu. Bei den Properties setzen wir:

  • Max speed: 50
  • Acceleration: 100
  • Deceleration: 50
  • Default controls: No

Die letzte Einstellung ist wichtig, da wir die Schnecke nicht über die Tastatur kontrollieren wollen, sie soll sich ja eigenständig bewegen.

Dann fügen wir noch einen Instanzenvariable moveRight vom Typ Boolean hinzu.

Jumpandrun11.png

Bewegung des Enemy

Die Schnecke soll auf einer Plattform hin und her laufen. Dazu muss sie wissen, wann die Plattform zuende ist. Am einfachsten realisiert man das mit einem unsichtbaren Kollision-Sprite EdgeMarker.png, welches passend positioniert wird. Wir laden also die Grafik als Sprite, nennen sie EdgeMarker und setzen die Property Initial visibility auf Invisible.

Pro Plattform benötigen wir zwei Instanzen von diesem Marker.

Jumpandrun12.png

Nun gibt es noch ein paar Kleinigkeiten bei den Events zu tun.

Platform2.png Im Prinzip wird hier in Abhängigkeit von der Instanzenvariablen moveRight der passende Tastendruck simuliert und die Richtung der Grafik festgelegt. Bei einer Kollision mit einem EdgeMarker wird jeweils der Wert der Variablen geändert. Wichtig ist hier die Nutzung von System->Else, die Bedingung Is nicht moveRight wäre nämlich an dieser Stelle immer erfüllt.

Kollisionen

Wenn der Spieler mit der Schnecke kollidiert, dann sind zwei Fälle zu unterscheiden. Wenn der Spieler die Schnecke von Oben trifft, dann wird diese vernichtet. Ansonsten verliert im Prinzip der Spieler sein Leben. Im einfachsten Fall simuliert man den Tod durch ein Flashen. Dazu muss man das Flash-Behavior beim Spieler hinzufügen.

Platform3.png

Wenn der Spieler von Oben auf die Schnecke fällt, dann wird er anschließend noch einmal um 700 Punkte nach oben gehoben, was einen kleinen Hopser bewirkt.

Jumpthru

Wenn eine Plattform recht tief hängt oder an einem Objekt wie dem Baum kann es passieren, dass der Player nicht darunter durchkommt.

Jumpandrun13.png

Hier kann man das Behavior von Solid auf Jumpthru verändern. Dazu erstellt man sich eine Kopie der Klasse Tiles, unter Projects mit der rechten Maustaste auf Tiles und im Menü Clone wählen. Die Kopie heißt dann Tiles2. Mit dieser Kopie kann man dann z.B. den abgebildeten Baum erstellen. In diesen Baum kann der Spieler nun von unten hinein springen. Von Oben sind diese Elemente solid, von unten her durchlässig.