Phaser 041 – Boot, Preload & Co (Phaser States)

Mein UFO-Minigame ist bekannt, ich überspringe es bewusst, damit es gut überschaubar bleibt. Hier soll es vorrangig um die boot.js, preload.js, gametitle.js und gameover.js gehen. Aus den vielen Einzelteilen wird langsam ein komplettes Game.

Im Prinzip bleibt vieles gleich, zumindest wird der ein oder andere Teile wieder erkennen. Arbeitet man mit Phaser-States wird auf mehrere Scripte verteilt. Das eine Script gibt an das nächste weiter. Das bedeutet, am Ende eines jeden Script wird das jeweils nächste gestartet.

Hier geht es zu dem Beispiel, ohne Game im Mittelteil.

Das Wechseln/Starten der States geschieht durch Ereignisse. Ein Ereignis wäre z.B. wenn der Preloader fertig geladen hat, ein Start-Button gedrückt wird, oder das Spiel beendet ist.

Bitte achtet auf die Kommentare im Quelltext, die bei JacaScript durch die beiden Schrägstriche // gesetzt werden.

index.html

Die index.html kennen wir schon aus dem vorherigen Kapitel. Ab jetzt ändert sich der Code in dieser Datei.

boot.js

Die erste „Klinke“ wurde schon in der index.html weitergegeben. Dort wurde die boot.js gestartet.

Nun folgen Anweisungen für weitere Schritte. Die boot.js startet inder letzten Zeile den Preloader this.game.start(„Preload“);

preload.js

Wird die preload.js abgearbeitet, erscheint auf dem Bildschirm der Ladebalken. Wurde alles aufgelistete geladen, übergibt die letzte Zeile an die nächste „Station“ weiter. Der GameTitle.

Die preload.js lädt alle Dateien/Bilder und Spritesheets die im Script aufgelistet wurden. Vergisst man Bilder aufzuführen wird das später im Spiel, als gün umrandetes Kästchen mit Schrägstrich angezeigt.

gametitle.js

Der Gametitle kann animiert, oder ein sogenanntes Still (statisches Bild) sein. Man kann es sich wie den Verpackungskarton zu einem Spiel vorstellen. Der GameTitel sollte immer Action vermitteln.

Es geht hier nicht mit dem Game weiter (siehe letzte Zeile im Script), sondern gleich mit dem GameOver.

game.js

Das Game überspringe ich hier wie gesagt bewusst. Zusätzlicher Game-Quellcode ist für das Beispiel, an dieser Stelle nicht wirklich wichtig. Die Funktionsweise der States kann auch ohne das Game veranschaulicht werden.

gameover.js

In der gameover.js geschieht nicht viel überraschendes. Es werden wieder Bilder angezeigt, aber auch ein Schalter zum GameTitle um das Spiel,wenn gewünscht, von neuem zu beginnen.

 

Das könnte Dich auch interessieren...

Translate »