| |
Spieleprogrammierung mit ActionScript
Kennenlernen
einiger Grundfunktionen
Ein erstes Spiel soll dazu dienen einige Funktionen, die in
Spielen häufig benötigt werden zu demonstrieren. Im
folgenden Beispiel soll ein Wichtel in einer vorgegebenen
Zeit möglichst viele Päckchen einsammeln. Dabei kommen
Funktionen wie Tastatursteuerung, Kollisionsabfrage oder
Timer zum Einsatz, deren Realisierung Schritt für Schritt
erklärt wird.
ansehen
Vorbereitung
Zuerst legen Sie die Bühnengröße auf 500x400 Pixel fest und
setzten die Bildrate auf 24 Bilder pro Sekunde. Beide
Einstellungen können Sie in den Dokumenteigenschaften
vornehmen.

Filmeigenschaften
festlegen Wieso 24 BpS?
Grundsätzlich gilt: Je höher die Bildrate eines Films desto
schneller und flüssiger scheinen die Bewegungen abzulaufen,
was gerade bei Spielen von Vorteil zu sein scheint.
Allerdings sorgen aufwendige Skripte in Verbindung mit
langsamen Prozessoren dafür, dass die Bildrate während des
Spiels stark verringert wird. Die Erfahrung zeigt, dass eine
Bildrate von 24 BpS für Flash-Spiele am besten geeignet ist.
Im Folgenden benötigen Sie diese 4 Ebenen:
-> Skript
-> Textfelder
-> Spielfigur
-> Hintergrund

Ebenen
des Spiels
Um die vorgegebenen Elemente, zum Beispiel die Spielfigur
nutzen zu können, öffnen Sie nun noch die Datei
„elemente_01.fla“ als Bibliothek.
(Datei -> als Bibliothek öffnen)
Download elemente_01.fla (27KB)
Die Spielfigur
Erstellen Sie im zweiten Bild der Ebene Spielfigur ein
leeres Schlüsselbild (rechte Maustaste -> leeres
Schlüsselbild einfügen) und ziehen Sie den Movieclip „figur“
aus der Elemente-Bibliothek auf die Bühne. Achten Sie
darauf, dass Sie sich noch im besagten Schlüsselbild
befinden. Geben Sie der Figur im Eigenschafteninspektor den
Instanznamen „figur“.
Im Spiel soll es so aussehen, als ob die Spielfigur läut.
Aus diesem Grund soll der Movieclip figur nun animiert
werden. Öffnen Sie den Symbolbearbeitungsmodus des
Movieclips (Doppelklick auf den Movieclip) und fügen Sie in
den beiden „Bein-Ebenen“ drei weitere Schlüsselbilder hinzu
(rechte Maustaste -> Schlüsselbild einfügen). Jetzt
verändern Sie die Position der beiden Beine von Bild zu
Bild, damit es den Eindruck erweckt, als würde die Figur
laufen. Dies erreichen Sie zum Beispiel wenn Sie die die
Beine in verschiedene Richtungen neigen (Modifizieren ->
Transformieren -> Drehen und Neigen).

Animation
der Spielfigur
Danach verlängern Sie die Ebene „Koerper“ auf vier Bilder,
indem Sie im Bild 4 besagter Ebene ein Schlüsselbild
einfügen (rechte Maustaste -> Schlüsselbild einfügen).

Zeitleiste
Movieclip „figur“ Nun belegen Sie noch das erste Bild
der Ebene Skript in der Movieclip-Zeitleiste mit folgendem
Skript:
stop();
Die Figur soll ihre Füße ja nur bewegen, wenn Sie vom
Spieler über die Bühne bewegt wird.
Verlassen Sie den Symbolbearbeitungsmodus wieder. (Klick auf
Szene 1 unter der Zeitleiste)
Möchten Sie Ihre eigene Spielfigur erstellen, erzeugen Sie
einfach einen neuen Movieclip (Einfügen -> Neues Symbol, als
Verhalten Movieclip auswählen) und entwerfen Sie Ihre Figur.
Die beschriebene Animation können Sie auf Ihre eigene Figur
genauso anwenden. Tastatursteuerung
Während des Spiels soll die Figur mit den Pfeiltasten der
Tastatur über die Bühne bewegt werden. Da der Mauszeiger
dabei nicht benötigt wird, blenden wir diesen zunächst
einmal aus.
Klicken Sie in die Ebene Skript des Films und geben Sie im
Aktionen-Fenster folgende Zeile ein:
Mouse.hide();
Jetzt erstellen Sie in Bild 2 der Ebene Skript ein
Schlüsselbild, geben diesem den Namen „spiel“ und fügen im
Aktionen-Fenster die Anweisung stop(); hinzu.

Bildname
vergeben
Das Arbeiten mit Bildnamen anstelle von Bildnummern
erleichtert die Übersicht.
Bevor wir mit der eigentlichen Tastatursteuerung beginnen
können, müssen wir noch eine Vorbereitung für die
Kollisionsabfrage treffen. Später soll unser Wichtel
Päckchen in seinen Sack einsammeln. Damit sich die
Kollisionskontrolle aber nicht auf die gesamte Figur
bezieht, sondern nur auf den Sack, erstellen wir einen
weiteren Movieclip, der den Sack abdeckt und später nicht zu
sehen ist.
Zeichnen Sie neben die Figur ein Rechteck, welches in etwa
die Größe des Sackes hat. Markieren Sie das gesamte Rechteck
und wandeln Sie es in einen Movieclip namens „hitTest“ um.
(Einfügen -> In Symbol konvertieren, Verhalten: Movieclip)
Geben Sie ihm im Eigenschafteninspektor ebenfalls den
Instanznamen „hitTest“. Ziehen Sie nun das Rechteck auf die
Figur, sodass der Sack nahezu verdeckt wird.

Rechteck-Movieclip
für Kollisionsabfrage
Damit das Rechteck im Spiel nicht zu sehen ist, markieren
Sie den Movieclip und versehen ihn im Aktionen-Fenster mit
folgendem Code:
onClipEvent(load){
this._visible=0;
}
_visible ist eine Movieclip-Eigenschaft, mit der sich die
Sichtbarkeit der vor dem Punkt angesprochenen
Movieclip-Instanz ein- und ausschalten lässt. False oder 0
stehen dabei für unsichtbar, true bzw. 1 stehen für
sichtbar.
This vor dem Punkt adressiert den aktuellen Movieclip.
Markieren Sie nun beide Movieclips („figur“ und „hitTest“)
und konvertieren Sie diese in einen gemeinsamen Movieclip
(Einfügen -> In Symbol konvertieren, Verhalten: Movieclip),
dem Sie den Namen „spielfigur“ geben. Vergeben Sie im
Eigenschafteninspektor als Instanzname den gleichen Namen.
Nun kommen wir zur eigentlichen Tastatursteuerung. Markieren
sie den Movieclip „spielfigur“ und versehen Sie ihn im
Aktionen-Fenster mit folgendem Skript:
onClipEvent(enterFrame){
if(Key.isDown(Key.LEFT) && this._x >= 30){
this._xscale = -100;
this.figur.play();
this._x = this._x-5;
}
else if(Key.isDown(Key.RIGHT) && this._x <= 470){
this._xscale = 100;
this.figur.play();
this._x = this._x+5;
}
}
Erklärung:
onClipEvent(enterFrame)
Jedes Mal wenn der Movieclip abgespielt wird, wird das
Skript ausgeführt. Bei einer Bildrate von 24 BpS wäre das 24
Mal in einer Sekunde.
if(Key.isDown(Key.LEFT) && this._x >=
30)
Das Skript beginnt mit einer if-Abfrage mit zwei
und-verknüpften Bedingungen. Key.isDown(Key.LEFT) prüft ob
die [Pfeil-links]-Taste gedrückt wurde und this._x >= 30
prüft ob die Instanz spielfigur 30 oder mehr Pixel vom
linken Bildschirmrand entfernt ist. So kann die Spielfigur
nicht über den Bildschirmrand hinaus bewegt werden. Erst
wenn beide Bedingungen erfüllt sind wird der folgende
Anweisungsblock ausgeführt.
this._xscale = -100;
Die Eigenschaft _xscale bestimmt die horizontale Skalierung
des aktuellen Movieclips. Durch den Wert -100 wird der
Movieclip horizontal gespiegelt, damit die Figur nicht
rückwärts läuft.
this.figur.play();
Der in den aktuellen Movieclip „spielfigur“ eingebundene
Movieclip „figur“ wird abgespielt, das heißt die
Bewegungsanimation des Wichtels läuft ab.
this._x = this._x-5;
Jedes Mal wenn das Bild abgespielt wird, also 24 Mal in der
Sekunde wird die Instanz der „spielfigur“ um 5 Pixel nach
links verschoben, indem die X-Koordinate (_x) um 5
verringert wird.
Ist eine der beiden Bedingungen der If-Anweisung nicht
erfüllt, wird der Anweisungsblock übersprungen und mit else
if fortgefahren. Der Rest funktioniert analog zum ersten
Teil:
Es wird geprüft ob die [Pfeil-rechts]-Taste gedrückt wird
und die Instanz des Movieclips 30 Pixel vom rechten
Bildschirmrand entfernt ist. Danach wird die Spielfigur
horizontal skaliert, die Animation abgespielt und die Figur
um 5 Pixel nach rechts bewegt.
Werden weder die If noch die If else Bedingungen erfüllt,
wird keiner der beiden Anweisungsblöcke ausgeführt und die
Figur bleibt wo sie ist.
Kollisionsabfrage
Um überhaupt eine Kollisionsabfrage durchführen zu können
brauchen wir noch das Objekt mit dem die Kollision geprüft
werden soll. In unserem Fall wären das die Päckchen, die der
Wichtel einsammeln muss. In der Elemente-Bibliothek gibt es
bereits den movieclip „geschenk“. Diesen Movieclip ziehen
Sie auf die Bühne und entfernen ihn gleich wieder, da wir
ihn nur in unsere Bibliothek importieren wollen. Jetzt
klicken sie doppelt auf den „geschenk“-Movieclip in Ihrer
eigenen Bibliothek um den Symbolbearbeitungsmodus zu öffnen.
Fügen Sie in Ebene 1 des Movieclips drei weitere
Schlüsselbilder hinzu (rechte Maustaste -> Schlüsselbild
einfügen). Dem dritten der nun insgesamt vier
Schlüsselbilder geben Sie im Eigenschafteninspektor den
Namen „getroffen“.
Dem ersten Schlüsselbild fügen Sie folgendes Skript hinzu:
this._y = this._y+3;
if(this.hitTest(_root.spielfigur.hitTest)){
gotoAndPlay("getroffen");
}
if(this._y > 400){
this.removeMovieClip();
}
Erklärung:
this._y = this._y+3;
Die Eigenschaft _y des Movieclips, also die vertikale
Position, wird bei jedem Abspielen des Schlüsselbildes um 3
Pixel erhöht. Das heißt, der Movieclip bewegt sich
kontinuierlich von oben nach unten.
if(this.hitTest(_root.spielfigur.hitTest))
Die If-Anweisung prüft die Kollision zwischen this, dem
aktuellen Movieclip „geschenk“, und _root.spielfigur.hitTest,
dem Movieclip „hitTest“ der im Movieclip „spielfigur“
enthalten ist.
gotoAndPlay("getroffen");
Diese Anweisung wird ausgeführt wenn die Bedingung in der
if-Anweisung erfüllt ist. Es wird in das dritte
Schlüsselbild gesprungen, dem wir den Namen „getroffen“
gegeben haben. Ab dort wird der Film weiter abgespielt.
if(this._y > 400){
this.removeMovieClip();
}
Eine weitere If-Anweisung prüft ob die Y-Position der
aktuellen Movieclips größer als 400 ist. Wenn dies der Fall
ist wäre der Movieclip außerhalb der Bühne und wird durch
this.removeMovieClip(); gelöscht.
hitTest() ist eine Methode des MovieClip-Objekts. Sie gibt
true zurück, wenn sich der Movieclip und das angegebene
Zielobjekt überschneiden. Für die Syntax gibt es zwei
Möglichkeiten:
-> meinMovieclip.hitTest(ziel), wobei ziel den Zielpfad des
Bereiches angibt, mit dem die Überschneidung geprüft werden
soll.
-> meinMovieclip.hitTest(x, y, formkennzeichen), wobei x und
y die Koordinaten des Kollisionsbereichs auf der Bühne
angeben und der Parameter formkennzeichen (boolescher Wert)
festlegt, ob die reale Form des Movieclips (true) oder nur
seine Begrenzungsbox (false) verwendet werden soll.
Dem zweiten Schlüsselbild fügen sie folgende Zeile hinzu:
gotoAndPlay(1);
So erzeugen wir eine Schleife, indem wir von Bild 2 wieder
ins Bild 1 springen. Lediglich wenn eine Kollision zwischen
dem Movieclip „geschenk“ und dem Movieclip „hitTest“
eintritt gelangen wir ins dritte Schlüsselbild.
Das dritte Schlüsselbild versehen Sie mit folgendem Skript:
_root.punktestand = _root.punktestand + 10;
_root.punkteausgabe = _root.punktestand + " Punkte";
Pro gefangenes Päckchen erhält der Spieler 10 Punkte. Die
Variable „punktestand“ wird um 10 erhöht, die Variable „punkteausgabe“
dient zur Formatierung der Ausgabe des Punktestandes.
Um dem Fangen eines Päckchens noch ein Geräusch hinzuzufügen
markieren Sie Schlüsselbild 3 und ziehen den Sound „Book
Drops“ aus der Elemente-Bibliothek auf die Bühne. Jetzt
sollte im Eigenschafteninspektor als Ton: „Book Drops“
erscheinen.

Eigenschaften
Bild 3 – Ton: „Book Drops“
Wurde ein Päckchen gefangen soll es natürlich von der Bühne
verschwinden. Zu diesem Zweck fügen Sie in das letzte
Schlüsselbild folgende Zeile ein:
this.removeMovieClip();
Durch diese Zeile wird die Instanz des aktuellen Movieclips
gelöscht.
removeMovieClip() ist eine Methode des MovieClip-Objekts,
die eine Movieclip Instanz entfernt. Sie funktioniert
allerdings nur, wenn die Instanz des Movieclips mit
attachMovie(), loadMovie() oder duplicateMovieClip() der
Bühne hinzugefügt wurde.
In diesem Fall wird die Instanz durch attachMovie()erzeugt,
dem wir uns jetzt zuwenden werden. Doch vorher schließen Sie
den Symbolbearbeitungsmodus.
attachMovie( )
Um dem Movieclip mit attachMovie() auf die Bühne zu holen
müssen Sie ihm einen eindeutigen Bezeichner geben. Wählen
sie den Movieclip „geschenk“ in ihrer Bibliothek mit der
rechten Maustaste aus und geben unter Verknüpfung… als
Bezeichner „geschenk“ ein. Dazu müssen Sie einen Hacken vor
„Export für ActionScript“ setzten, damit das Eingabefeld
freigegeben wird.

Verknüpfungseigenschaften
Erstellen Sie nun einen neuen Movieclip mit dem Namen „dummy“.
(Einfügen -> Neues Symbol, Verhalten: Movieclip) Lassen Sie
den Movieclip leer und schließen Sie den
Symbolbearbeitungsmodus wieder.
Ziehen Sie eine Instanz des Dummy-Movieclips im zweiten Bild
auf die Bühne und geben Sie ihm im Eigenschafteninspektor
den Namen „geschenk“. Fügen Sie ihm folgendes Skript hinzu:
onClipEvent(enterFrame){
anzahl=Math.round(Math.random()*30);
if(anzahl==1){
zaehler++;
_root.attachMovie("geschenk","geschenk"+zaehler, zaehler);
setProperty("_root.geschenk"+zaehler,_x, Math.random()*500);
setProperty("_root.geschenk"+zaehler,_rotation, Math.random()*360);
}
}
Erklärung:
anzahl=Math.round(Math.random()*30);
Durch Math.random() wird eine Zufallszahl zwischen 0 und 1
ermittelt. Diese wird mit 30 multipliziert und durch die
Methode Math.round() auf einen ganzen Wert gerundet. Durch
den Zahlenwert der multipliziert wird lässt sich die Anzahl
der einzufangenden Elemente auf der Bühne erhöhen und
verringern.
if(anzahl==1)
Wenn die ermittelte Zufallszahl 1 ist, dann wird der
folgende Anweisungsblock ausgeführt.
zaehler++;
Ein Zähler wird um 1 erhöht.
_root.attachMovie("geschenk","geschenk"+zaehler,
zaehler);
Es wird eine Instanz des Movieclips „geschenk“ an die
Hauptzeitleiste angehängt. Der Instanzname setzt sich aus „geschenk“
und der Zählervariablen zusammen. Die Stufe in die die
Instanz geladen wird ergibt sich ebenfalls aus der
Zählervariablen.
So entstehen neue Instanzen wie z.B. geschenk1, geschenk2…
Durch die verschiedenen Stufen wird verhindert, dass eine
Instanz eine andere überschreibt.
setProperty("_root.geschenk"+zaehler,_x, Math.random()*500);
Die Elemente sollen zufällig über die gesamte Breite
verstreut auftauchen.
"_root.geschenk"+zaehler bezeichnet den Instanznamen, der
zweite Parameter bezeichnet die zu ändernde Eigenschaft,
hier die X-Position. Der dritte Parameter ist der neue Wert
für die X-Position, eine Zufallszahl zwischen 0 und 500
(Bühnenbreite).
setProperty("_root.geschenk"+zaehler,_rotation, Math.random()*360);
Diesmal ist _rotation (Drehung) die zu ändernde Eigenschaft
und wird mit einer Zufallszahl zwischen 0 und 360 (Grad)
belegt.
Nun sollten die Päckchen in zufälliger Anzahl über die Bühne
verstreut und in verschiedenen Neigungen von oben nach unten
fallen.
Punktestand
Den aktuellen Punktestand ermitteln wir schon im Movieclip „geschenk“
im Schlüsselbild „getroffen“, wir müssen ihn nur noch
ausgeben.
Erstellen Sie im Bild 2 der Ebene Textfelder ein
Schlüsselbild.
Fügen Sie ein Textfeld zur Anzeige der Punkte ein. Wählen
Sie im Eigenschafteninspektor als Texttyp Dynamischer Text
und geben Sie in das Feld Var: _root.punkteausgabe ein.
Diese Variable wird dann im Textfeld ausgegeben.

Eigenschaften
Textfeld
Start und Game Over
Jetzt fehlt uns noch ein Hintergrund. Markieren Sie das
erste Schlüsselbild der Ebene Hintergrund und ziehen Sie den
Hintergrund aus der Elemente-Bibliothek auf die Bühne,
sodass er sie vollständig bedeckt. Fügen Sie ein weiteres
Schlüsselbild im Bild 3 dieser Ebene ein.
Vervollständigen Sie den Code im Bild 1 der Ebene Skript
durch die Anweisung stop(); damit unser Spiel nicht gleich
beginnt, wenn den Film gestartet wird.
Zum Starten des Spiels brauchen wir jetzt eine Schaltfläche.
Erzeugen Sie eine neue Schaltfläche (Einfügen -> Neues
Symbol, Verhalten: Schaltfläche) und nennen diese „start“.
Im Symbolbearbeitungsmodus fügen Sie nun ein Schlüsselbild
im Bild „Aktiv“ ein und zeichnen dort ein beliebiges
Rechteck. Die restlichen drei Bilder bleiben leer, sodass
eine unsichtbare Schaltfläche entsteht.
Nachdem Sie den Symbolbearbeitungsmodus verlassen haben,
ziehen Sie eine Instanz der Schaltfläche im Bild 1 der Ebene
Skript auf die Bühne. Die Schaltfläche wird jetzt
halbtransparent dargestellt. Richten Sie nun die
Schaltfläche so aus, dass die Bühne komplett bedeckt ist.
Wählen Sie die Schaltfläche aus und versehen Sie diese mit
folgendem Skript:
on(release, keyPress "<Space>"){
gotoAndStop("spiel");
}
Wenn nun die Leertaste oder die unsichtbare Schaltfläche
gedrückt wird springt der Film ins Bild „spiel“ und unser
Spiel beginnt.
Timer
Damit unser Spiel auch ein Ende bekommt, soll eine Spielzeit
von 30 Sekunden vorgegeben werden.
Fügen Sie im Bild 3 der Ebene Skript ein leeres
Schlüsselbild ein und benennen Sie es mit „ende“.
Fügen Sie auch im Bild 3 der Ebene Textfelder ein
Schlüsselbild ein, damit beim Spielende der Punktestand zu
sehen ist.
Kopieren Sie die Start-Schaltfläche und fügen Sie diese ins
Bild 3 der Ebene Skript ein.
Erstellen Sie im Bild 2 der Ebene Textfelder ein zweites
dynamisches Textfeld und versehen Sie es mit der Variablen
„_root.zeitausgabe“. In diesem Feld soll später die
verbleibende Spielzeit ausgegeben werden.
Für den Timer ziehen Sie eine weitere Instanz der
Dummy-Movieclips im Bild 2 auf die Bühne und vergeben den
Instanznamen „zeitmesser“. Diese Instanz bekommt nun
folgendes Skript:
onClipEvent(load){
gesamtZeit=30000+getTimer();
}
onClipEvent(enterFrame){
_root.zeit = int((gesamtZeit - getTimer())/1000);
_root.zeitausgabe = "noch " + _root.zeit + " sec";
if(_root.zeit==0){
_root.gotoAndStop("ende");
}
}
Erklärung:
onClipEvent(load)
Die folgenden Anweisungen werden einmalig ausgeführt wenn
der Movieclip geladen ist.
gesamtZeit=30000+getTimer();
Die Variable gesamtZeit wird definiert als 30000+getTimer()
wobei getTimer() die Anzahl der Millisekunden zurückgibt,
die seit Abspielbeginn vergangen sind.
onClipEvent(enterFrame)
Die folgenden Anweisungen werden jedes Mal ausgeführt, wenn
das Bild abgespielt wird.
_root.zeit=int((gesamtZeit-getTimer())/1000);
Die vergangenen Millisekunden werden von der vorher
bestimmten Gesamtzeit abgezogen. Der ermittelte Wert wird
durch 1000 geteilt um Sekunden zu erhalten.
_root.zeitausgabe="noch "+_root.zeit+" sec";
Die Zeitausgabe wird formatiert.
if(_root.zeit==0){
_root.gotoAndStop("ende");
}
Eine If-Anweisung prüft ob die Variable zeit==0 ist. Ist
dies der Fall, springt der Film ins Bild „ende“.
Damit beim Begin eines neuen Spiels der Punktestand wieder
bei 0 beginnt müssen Sie noch im zweiten Bild der Ebene
Skript folgende Zeilen einfügen:
_root.punktestand = 0;
_root.punkteausgabe = _root.punktestand + " Punkte";
Jetzt sind alle Funktionen des Spiels komplett. Entwerfen
Sie noch einen Start- und Endbildschirm oder verändern Sie
das Spiel nach Ihren Vorstellungen.
Download spiel_01.fla (35KB)
Ein einfaches
Labyrinth-Spiel
Das Labyrinth
ansehen
Zunächst brauchen wir ein Labyrinth. Hierzu bedienen wir uns
einem Labyrinthgenerator aus dem Internet. Unter
http://plink.sonic.net/mazegenerator/
können Sie sich ein Labyrinth beliebiger Größe und
Schwierigkeitsstufe erstellen lassen. Für dieses Beispiel
empfehle ich 50x50 Pixel. Speichern Sie das erhaltene GIF
(rechte Maustaste -> Bild speichern unter…).
Öffnen Sie einen neuen Flash-Film mit einer Bildrate von 24
BpS , erzeugen Sie einen neuen Movieclip und nennen Sie
diesen „labyrinth“. Im Symbolbearbeitungsmodus importieren
(Datei -> Importieren) Sie nun die vorhin gespeicherte
Grafik. Lassen Sie diese markiert und wählen Sie im Menü
Modifizieren -> Bitmap nachzeichnen. Im folgenden Dialogfeld
übernehmen Sie die Einstellungen aus der folgenden Abbildung und
bestätigen mit OK.

Einstellungen
für Vektorisierung
Bei unserem Labyrinth handelt es sich jetzt um eine
Vektorgrafik. Markieren Sie jetzt nur den weißen Bereich im
Labyrinth und entfernen Sie diesen ([Entf]-Taste).
Verlassen Sie den Symbolbearbeitungsmodus.
Benennen Sie die bereits vorhandene Ebene in „Labyrinth“ um
und ziehen Sie den erstellten Movieclip auf die Bühne.
Diesen skalieren (Modifizieren -> Transformieren ->
Skalieren) Sie nun so, dass von der Bühne noch ein Rand zu
sehen ist.
Die Spielfigur
Erstellen Sie eine neue Ebene namens „Figur“. Zeichnen Sie
als Spielfigur ein kleines Quadrat und wandeln Sie dieses in
einen Movieclip um (Einfügen -> In Symbol konvertieren,
Verhalten: Movieclip, Name: figur). Geben Sie der Instanz
dieses Movieclips den Instanznamen „figur“ und skalieren
(Modifizieren -> Transformieren -> Skalieren) Sie diese so,
dass sie in die Gänge des Labyrinths passt.
Tastatursteuerung, Kollisionskontrolle und Timer
Markieren Sie das Labyrinth auf der Bühne und geben Sie im
Aktionen-Fenster folgendes Skript ein:
onClipEvent(load){
gesamtZeit=120000+getTimer();
}
onClipEvent(enterFrame){
//Timer
_root.zeit = int((gesamtZeit - getTimer()) / 1000);
_root.zeitausgabe = "Noch " + _root.zeit + " Sekunden";
if(_root.zeit == 0){
_root.gotoAndStop("abgelaufen");
}
//Tastatursteuerung
with(_root.figur){
if(Key.isDown(Key.DOWN)){
_y += 1;
}
else if(Key.isDown(Key.UP)){
_y -= 1;
}
else if(Key.isDown(Key.RIGHT)){
_x += 1;
}
else if(Key.isDown(Key.LEFT)){
_x -= 1;
}
//Kollisionsabfrage
if(this.hitTest(getBounds(_root).xMax, _y, true)){
_x -= 1;
}
if(this.hitTest(getBounds(_root).xMin, _y, true)){
_x += 1;
}
if(this.hitTest(_x, getBounds(_root).yMax, true)){
_y -= 1;
}
if(this.hitTest(_x, getBounds(_root).yMin, true)){
_y += 1;
}
}
}
Erklärung:
Der Timer und die Tastatursteuerung funktionieren wie im
ersten Beispiel, deshalb sind die Erklärungen etwas kürzer
gefasst.
onClipEvent(load){
gesamtZeit=120000+getTimer();
}
Die Variable gesamtZeit wird einmalig definiert wenn der
Movieclip geladen wurde.
onClipEvent(enterFrame){
//Timer
_root.zeit=int((gesamtZeit-getTimer())/1000);
_root.zeitausgabe="Noch "+_root.zeit+" Sekunden";
if(_root.zeit==0){
_root.gotoAndStop("abgelaufen");
}
Die Variablen „zeit“ und „zeitausgabe“ werden bestimmt und
wenn zeit == 0 ist wird ins Bild „abgelaufen“ gesprungen. Um
dieses Bild kümmern wir uns allerdings erst später.
//Tastatursteuerung
with(_root.figur){
if(Key.isDown(Key.DOWN)){
_y+=1;
}
else if(Key.isDown(Key.UP)){
_y-=1;
}
else if(Key.isDown(Key.RIGHT)){
_x+=1;
}
else if(Key.isDown(Key.LEFT)){
_x-=1;
}
In vier If-Anweisungen wird geprüft, welche der Pfeil-Tasten
gedrückt wurde. Entsprechend dem Ergebnis wird entweder die
X- oder die Y-Koordinate der Instanz „figur“ um 1 verringert
oder erhöht.
//Kollisionsabfrage
if(this.hitTest(getBounds(_root).xMax,_y,true)){
_x-=1;
}
if(this.hitTest(getBounds(_root).xMin,_y,true)){
_x+=1;
}
if(this.hitTest(_x,getBounds(_root).yMax,true)){
_y-=1;
}
if(this.hitTest(_x,getBounds(_root).yMin,true)){
_y+=1;
}
}
}
Bei dieser Kollisionsabfrage wird folgende Syntax der
hitTest()-Methode verwendet: meinMovieclip.hitTest(x, y,
formkennzeichen)
this entspricht dem Labyrinth-Movieclip, die X- und
Y-Koordinaten entsprechen denen der Instanz „figur“ und
formkennzeichen ist true, sodass die reale Form des
Labyrinths als Kollisionsbereich dient.
getBounds() ist eine Methode des Movieclip-Objekts, die den
jeweils kleinsten und größten Wert für die X- und
Y-Koordinaten eines Movieclips in einem bestimmten
Koordinatensystem zurückgibt.
Syntax:
meinMovieclip.getBounds(zielkoordinatensystem)
Der Parameter Zielkoordinatensystem gibt den Zielpfad der
Zeitleiste an, deren Koordinatensystem Sie als Bezugspunkt
verwenden möchten. Die Methode gibt die Eigenschaften xMin,
xMax, yMin und yMax zurück, auf die Sie wie folgt zugreifen
können:
clipBounds = clip.getBounds(_root);
clip2._x = clipBounds.xMax;
oder :
clip2._x = clip.getBounds(_root).xMax;
Start und Ziel
Erstellen Sie eine neue Ebene und nennen Sie diese
“Meldung”. Fügen Sie im zweiten und dritten Bild jeweils ein
Schlüsselbild ein und benennen Sie das zweite „geschafft“
und das dritte „abgelaufen“. Das Bild „geschafft“ bekommt
der Spieler zu sehen, wenn er das Labyrinth in der
vorgegebenen Zeit durchquert hat und das Bild „abgelaufen“
wenn die Zeit vorüber ist. Gestalten Sie in den beiden
Bildern entsprechende Meldungen. Verwenden Sie möglichst die
Geräteschrift _sans, da wir später die Qualität unseres
Films herunter setzten wollen, damit er nur wenig
Speicherplatz benötigt und schnell lädt.
Erzeugen Sie eine neue Ebene namens „Neustart“ und fügen Sie
in die Bilder 2 und 3 ein Schlüsselbild ein. Erstellen Sie
eine unsichtbare Schaltfläche (wie im ersten Spiel
beschrieben) und ziehen Sie diese im zweiten und dritten
Schlüsselbild der Ebene „Neustart“ auf die Bühne, sodass
diese vollständig bedeckt ist. Geben Sie der Schaltfläche
folgendes Skript:
on(release, keyPress "<Enter>"){
gotoAndStop(1);
}
So beginnt das Spiel von vorn beim Drücken der Schaltfläche
oder der [Enter]-Taste.
Fügen Sie nun in den Bildern 2 und 3 der „Labyrinth“-Ebene
ein Schlüsselbild ein.
In beiden Schlüsselbildern teilen Sie den Movieclip
(Modifizieren -> Teilen), damit er zu einen einfachen
Zeichnungselement wird. Dadurch geht für diese zwei Bilder
auch das Movieclip-Skript verloren, womit die Spielfigur
stehen bleibt.
Geben Sie dem Labyrinth in diesen beiden Bildern eine
hellgraue Füllung, damit es nur schwach im Hintergrund zu
sehen ist. Verlängern Sie die Ebene „Figur“ indem Sie im
Bild 3 ein Schlüsselbild einfügen, damit die Spielfigur bei
Spielende nicht verschwindet.
Zudem brauchen wir noch eine Ebene namens „Skript“ mit
ebenfalls drei Schlüsselbildern. In alle drei Bilder muss
eine stop();-Anweisung, damit der Film nicht weiterläuft.
Außerdem muss im ersten Schlüsselbild der Ebene „Skript“ die
Position der Spielfigur festgelegt werden, damit sie sich
nach einem Neustart wieder am Eingang des Labyrinthes
befindet.
figur._x = 82;
figur._y = 187;
Die Werte die Sie hier angeben müssen entnehmen Sie dem
Eigenschafteninspektor des Movieclips „figur“.
Jetzt hat unser Spiel zwar ein Ende wenn die Zeit abläuft,
allerdings noch nicht wenn wir das Labyrinth durchquert
haben. Dazu benötigen wir eine weitere Ebene, die Sie
„Pfeile“ nennen. Am Eingang und am Ausgang des Labyrinths
soll jeweils ein Pfeil positioniert werden. Diese Pfeile
dienen zum einen dem besseren Überblick, zum anderen können
wir sie zur Kollisionsabfrage nutzen. Erstellen Sie also
zwei Movieclips, einen als Startpfeil und einen als
Zielpfeil, und ziehen Sie beide im Bild 1 der Ebene „Pfeile“
auf die Bühne.

Screenshot Labyrinth-Spiel
Der Startpfeil bekommt folgendes Skript:
onClipEvent(enterFrame){
if(this.hitTest(_root.figur)){
_root.figur._x = _root.figur._x + 1;
}
}
Sobald die Spielfigur den Startpfeil berührt wird die
X-Koordinate um eins erhöht. So kann die Spielfigur das
Labyrinth nicht verlassen.
Das Skript des Zielpfeils sieht folgendermaßen aus:
onClipEvent(enterFrame){
if(this.hitTest(_root.figur)){
_root.gotoAndStop("geschafft");
}
}
Wenn die Spielfigur diesen Pfeil berührt ist Sie am Ziel
angekommen und der Film springt ins Bild „geschafft“. Dort
hatten Sie die Erfolgsmeldung ja schon vorbereitet.
In einer weiteren Ebene („Textfelder“) können Sie ein
dynamisches Textfeld erzeugen, in welchem durch die Variable
_root.zeitausgabe die noch verbleibende Zeit ausgegeben
wird.
Da wir im ganzen Spiel nur einfache Formen und Schriften
verwendet haben können wir nun noch ohne Verluste die
Qualität herabsetzen. Fügen Sie den Skript im ersten
Schlüsselbild der Ebene „Skript“ folgende Zeile hinzu:
_quality="LOW";
Damit haben Sie Ihr erstes Labyrinth-Spiel fertiggestellt.
Download spiel_02.fla (7KB)
Pacman
Im Unterschied zum vorhergehenden Spiel ist dieses ein
Labyrinth mit Gegnern. Aus diesem Grund sollte das Labyrinth
sehr einfach sein und Möglichkeiten bieten den Gegnern zu
entkommen.
ansehen

Einfache Variante von „Pacman“
Vorbereitung
Erstellen Sie einen neuen Film der Größe 550x400 Pixel und
einer Bildrate von 24 Bildern pro Sekunde. Als
Hintergrundfarbe wählen Sie am Besten ein dunkles Grau.

Hintergrundfarbe einstellen
Um die vorgegebenen Objekte zu nutzen öffnen Sie die Datei
„elemente_03.fla“ als Bibliothek. (Datei -> Als Bibliothek
öffnen)
Download elemente_03.fla (18KB)
Wir benötigen 7 Ebenen, die Sie folgendermaßen benennen:
-> Skript
-> Spielfigur
-> Monster
-> Punkte
-> Text
-> Labyrinth
-> Wendepunkte
Die Spielfigur und deren Steuerung
Zuerst ziehen Sie den Movieclip „labyrinth“ aus der
Elemente-Bibliothek in der Ebene „Labyrinth“ auf die Bühne.
Positionieren Sie das Labyrinth so, dass noch Platz für die
Ausgabe der Zeit und der Punkte bleibt.
Den Movieclip „spielfigur“ ziehen Sie in der Ebene
„Spielfigur“ auf die Bühne und positionieren ihn in einer
Ecke des Labyrinths. Skalieren Sie die Instanz auf 25x25
Pixel.
Geben Sie der Spielfigur den Instanznamen „pacman“ und dem
Labyrinth den Instanznamen „labyrinth“.
Das Skript für die Tastatursteuerung der Spielfigur bringen
wir im Labyrinth-Movieclip unter. Markieren Sie das
Labyrinth auf der Bühne und geben Sie im Aktionen-Fenster
folgenden Code ein:
onClipEvent(enterFrame){
with(_root.pacman){
//Tastatursteuerung
if(Key.isDown(Key.DOWN)){
_y += 4;
_rotation = 90;
}
if(Key.isDown(Key.UP)){
_y -= 4;
_rotation = 270;
}
if(Key.isDown(Key.RIGHT)){
_x += 4;
_rotation = 0;
}
if(Key.isDown(Key.LEFT)){
_x -= 4;
_rotation = 180;
}
}
}
Dieses Skript sollte Ihnen mittlerweile bekannt vorkommen.
Es wird jedes Mal ausgeführt, wenn der Movieclip abgespielt
wird. Bei unserer Bildrate von 24 BpS ist das 24 Mal in
einer Sekunde. Durch die Anweisung with(_root.pacman)
beziehen sich die Eigenschaften die danach geändert werden
alle auf die Instanz „pacman“ des Movieclips „spielfigur“.
In den vier If-Anweisungen wird ermittelt, welche der vier
Pfeiltasten gedrückt wird. Je nach dem welche Taste gedrückt
wurde wird die Instanz „pacman“ um vier Pixel auf der X-
bzw. Y-Achse verschoben und durch die Movieclip-Eigenschaft
_rotation in Bewegungsrichtung gedreht. Die Zahlenangaben
für die Eigenschaft _rotation sind in Grad (°) und beziehen
sich auf den Ausgangszustand des Movieclips so wie er in der
Bibliothek abgelegt ist. Die Drehung erfolgt im
Uhrzeigersinn.
Kollision mit dem Labyrinth
Auch dieses Skript ist Ihnen nicht neu. Fügen Sie es unter
die Tastatursteuerung im Labyrinth-Movieclip ein. Achten Sie
darauf, dass es sich noch innerhalb der with()-Anweisung
befindet!
//Kollisionsabfrage Wände
if(this.hitTest(getBounds(_root).xMax, _y, true)){
_x -= 4;
}
if(this.hitTest(getBounds(_root).xMin, _y, true)){
_x += 4;
}
if(this.hitTest(_x, getBounds(_root).yMax, true)){
_y -= 4;
}
if(this.hitTest(_x, getBounds(_root).yMin, true)){
_y += 4;
}
Bei dieser Kollisionsabfrage wird geprüft ob die Instanz
„pacman“ mit dem Labyrinth zusammenstößt.
„this“ entspricht dem Labyrinth-Movieclip, die X- und
Y-Koordinaten der Instanz „pacman“ werden über getBounds()
und die Eigenschaften _x bzw. _y des Movieclips ermittelt.
Formkennzeichen ist true, sodass die reale Form des
Labyrinths als Kollisionsbereich dient. Jedes Mal wenn die
Spielfigur nun auf eine Labyrinthwand triff bewegt sie sich
um vier Pixel in die entgegengesetzte Richtung.
Punkte einsammeln
Pacman soll auf seinem Weg durchs Labyrinth Punkte
einsammeln. Erzeugen Sie einen neuen Movieclip und nennen
Sie diesen „punkt“. Zeichnen Sie in diesem Movieclip einen
Kreis der ca. 10x10 Pixel groß ist. Schließen Sie den
Symbolbearbeitungsmodus und verteilen Sie beliebig viele
Instanzen dieses Movieclips auf der Bühne. Achten Sie
darauf, dass die Ebene „Punkte“ markiert ist. Es wird Ihnen
leichter fallen die Punkte regelmäßig zu positionieren, wenn
Sie die Funktion „Am Raster ausrichten“ einschalten.
(Ansicht -> Raster -> Raster einblenden, Ansicht -> Raster
-> Am Raster ausrichten)
Geben Sie nun jedem einzelnen Punkt auf der Bühne einen
eigenen Instanznamen. Der erste Punkt bekommt den Namen
„futter1“, der zweite heißt „futter2“ usw. Der letzte Punkt
trägt den Namen „futter79“, wobei es dazu 79 Punkte sein
müssen.
Das Skript zum einsammeln der Punkte fügen wir ebenfalls dem
Labyrinth-Movieclip hinzu. Wieder ist darauf zu achten, dass
der Code innerhalb der with()-Anweisung eingefügt werden
soll.
//Kollision mit "Futterpunkten"
for(i=1;i<80;i++){
if(hitTest(_root["futter"+i]) &&
_root["futter"+i]._visible==true){
_root.plopp.Start();
_root["futter"+i]._visible=false;
_root.punkte+=1;
_root.punktausgabe=_root.punkte+" Punkte";
}
}
Erklärung:
for(i=1;i<80;i++){
Eine for-Schleife mit der Zählervariablen i. Die folgenden
Anweisungen werden ausgeführt wenn i kleiner als 80 ist,
wobei i bei jedem Schleifendurchlauf um eins erhöht wird.
if(hitTest(_root["futter"+i]) &&
_root["futter"+i]._visible==true){
Eine If-Anweisung mit zwei und-Verknüpften Bedingungen. Es
wird geprüft ob die Instanz „pacman“ mit einem Futterpunkt
zusammengestoßen ist und ob dieser Punkt sichtbar ist. Der
Instanzname des Futterpunktes wird dabei mittels eines
Array-Zugriffsoperators angegeben. Der Instanzname wird aus
dem String futter und der Zählervariablen i zusammengesetzt.
So wird in 79 Schleifendurchläufen jeder Futterpunkt auf die
Bedingung der If-Anweisung geprüft.
Sind beide Bedingungen wahr werden folgende Zeilen
ausgeführt:
_root.plopp.Start();
Der Sound „plopp“ wird abgespielt.
_root["futter"+i]._visible=false;
Die aktuelle Instanz des Futterpunktes wird unsichtbar
gesetzt.
_root.punkte+=1;
Die Variable „punkte“ wird um eins erhöht.
_root.punktausgabe=_root.punkte+" Punkte";
Die Punkteausgabe wird formatiert.
}
}
Um die Punkte und den Sound kümmern wir uns jetzt.
Ziehen Sie den Sound „Brick Drops“ aus der
Elemente-Bibliothek im ersten Bild der Ebene „Skript“ auf
die Bühne. Wenn Sie nun das erste Bild der Ebene „Skript“
markieren sollte im Eigenschafteninspektor als Ton „Brick
Drops“ erscheinen.

Eigenschafteninspektor
Geben Sie dem Sound „Brick Drops“ in Ihrer Bibliothek den
Bezeichner „plopp“. (rechte Maustaste auf dem Sound ->
Verknüpfung… , Hacken vor Export für ActionScript)

Bezeichner vergeben
Im ersten Bild der Ebene Skript fügen Sie folgende Zeilen
ein:
stop();
_root.punkte = 0;
_root.punktausgabe = _root.punkte + " Punkte";
plopp = new Sound();
plopp.attachSound("plopp");
_root.plopp.Stop();
Die ersten Zeilen sollten bekannt sein. Der Film wird
gestoppt, die Punkte werden auf null gesetzt und die
Punkteausgabe wird formatiert.
Danach wird mit den new-Konstruktor eine Instanz des
Sound-Objekts erzeugt. Dieser Instanz wird mittels
attachSound(„plopp“) der Sound mit dem Bezeichner „plopp“
hinzugeführt. Dieses Sound-Objekt ermöglicht es uns den
Sound „plopp“ im Film zu steuern. Zunächst wird der Sound
mit plopp.Stop() angehalten.
Durch dieses Objekt kann der Sound nun jedes Mal abgespielt
werden, wenn pacman auf einen sichtbaren Punkt trifft.
Erstellen Sie nun noch ein dynamisches Textfeld, in dem Sie
die Variable _root.punkteausgabe ausgeben.
Timer
In diesem Spiel wollen wir kein Zeitlimit vorgeben sondern
die Sekunden seit Spielbeginn ausgeben. So kann sich der
Spieler anhand der Zeit mit anderen Spielern messen.
Wählen Sie den Labyrinth-Movieclip auf der Bühne aus und
fügen Sie im Aktionen-Fenster den folgenden Code ein.
Dieser Teil des Skripts soll ganz an den Anfang:
onClipEvent(load){
_root.zeit = 0;
_root.zeitausgabe = _root.zeit + " Sekunden";
}
Hier wird die Variable „zeit“ auf null gesetzt und die
Zeitausgabe formatiert.
Diese Zeilen fügen Sie vor der letzten schließenden Klammer
des enterFrame-Events ein:
//Timer
if(_root.punkte<79){
sekunden++;
if(sekunden == 24){
_root.zeit += 1;
sekunden = 1;
_root.zeitausgabe = _root.zeit + " Sekunden";
}
}
else{
_root.gotoAndStop(10);
}
In diesem Fall nutzen wir nicht die Funktion getTimer().
Zuerst wird geprüft ob die Anzahl der Punkte kleiner als 79
ist. Da wir für jeden Futterpunkt einen Punkt vergeben,
können wir davon ausgehen, dass das Spiel erst zuende ist
wenn die Anzahl der Punkte der Anzahl der Futterpunkte
entspricht. Ist das nicht der Fall, wird die Variable
„sekunden“ um eins erhöht. In der folgenden If-Anweisung
wird geprüft ob die Variable „sekunden“ 24 ist. Ist die
Bedingung wahr, wird die Variable „zeit“ um eins erhöht und
die Variable „sekunden“ wieder auf 1 gesetzt. Danach wird
die Zeitausgabe neu formatiert. Diese Methode ist möglich
weil uns bekannt ist, dass das Skript genau 24 Mal pro
Sekunde ausgeführt wird. Die Variable „sekunden“ wird also
24 Mal pro Sekunde erhöht und wenn sie den Wert 24 erreicht
ist eine Sekunde vergangen.
Ist die Bedingung der ersten If-Anweisung falsch, wird nur
der else-Zweig ausgeführt, bei dem der Film ins Bild 10
springt.
Erzeugen Sie nun ein dynamisches Textfeld für die Variable
„_root.zeitausgabe“ und erstellen Sie im Bild 10 eine
Meldung an den Spieler, dass er gewonnen hat.
Das Textfeld und die Meldung bringen Sie bitte in der Ebene
„Text“ unter. Erstellen Sie in diesem Bild ebenfalls eine
Schaltfläche zum neustarten.
Der Code für die Schaltfläche ist folgender:
on(release){
gotoAndStop(1);
}

Erfolgsmeldung
Die Monster
Auch der Moster-Movieclip ist schon vorbereitet. Ziehen Sie
ihn aus der Elemente-Bibliothek auf die Bühne. Dabei sollte
Bild 1 der Ebene „Monster“ markiert sein. Skalieren Sie die
Instanz auf 15x20 Pixel und platzieren Sie sie im Labyrinth.
Lassen Sie die Instanz ausgewählt und öffnen Sie das
Aktionen-Fenster. Geben Sie hier die folgenden Zeilen ein:
onClipEvent(load){
xGeschwindigkeit=4;
yGeschwindigkeit=0;
}
Wenn der Movieclip geladen ist werden die Variablen
„xGeschwindigkeit“ und „yGeschwindigkeit“ gesetzt. Wozu
diese beiden Variablen dienen sehen Sie im nächsten Skript.
Aber vorher kopieren Sie die Instanz des Movieclips
„monster“ und fügen diese an einer anderen Stelle im
Labyrinth ein. Kopieren Sie das Monster noch zwei Mal,
sodass sich nun vier Monster im Labyrinth befinden. Alle
Monster sollten sich in der Ebene „Monster“ befinden.
Doppelklicken Sie eines der Monster um in den
Symbolbearbeitungsmodus zu gelangen.
Zuerst erzeugen wir eine Schleife innerhalb des Movieclips.
Fügen Sie in Bild 2 ein Schlüsselbild ein, und belegen es
mit folgender Zeile:
gotoAndPlay(1);
So wird von Bild 2 immer wieder ins Bild 1 gesprungen.
Bild 1 belegen Sie mit folgendem Skript:
_x = _x + xGeschwindigkeit;
_y = _y + yGeschwindigkeit;
//Kollisionsabfrage
if(_root.labyrinth.hitTest(getBounds(_root).xMax, _y,
true)){
_x = _x - 55;
xGeschwindigkeit = xGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(getBounds(_root).xMin, _y,
true)){
_x = _x + 55;
xGeschwindigkeit = xGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(_x, getBounds(_root).yMin,
true)){
_y = _y + 55;
yGeschwindigkeit = yGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(_x,getBounds(_root).yMax, true)){
_y = _y - 55;
yGeschwindigkeit = yGeschwindigkeit * -1;
}
Erklärung:
_x = _x + xGeschwindigkeit;
_y = _y + yGeschwindigkeit;
Die Eigenschaften _x und _y des Movieclips stehen für seine
X- und Y-Koordinaten. Diese werden neu berechnet, indem zum
aktuellen Wert die Variablen „xGeschwindigkeit“ bzw.
„yGeschwindigkeit“ hinzuaddiert werden.
Das passiert jedes Mal wenn Bild 1 betreten wird, sodass
sich der Movieclip kontinuierlich bewegt.
//Kollisionsabfrage
if(_root.labyrinth.hitTest(getBounds(_root).xMax, _y,
true)){
_x = _x - 55;
xGeschwindigkeit = xGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(getBounds(_root).xMin, _y,
true)){
_x = _x + 55;
xGeschwindigkeit = xGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(_x, getBounds(_root).yMin,
true)){
_y = _y + 55;
yGeschwindigkeit = yGeschwindigkeit * -1;
}
if(_root.labyrinth.hitTest(_x,getBounds(_root).yMax, true)){
_y = _y - 55;
yGeschwindigkeit = yGeschwindigkeit * -1;
}
Die Kollisionsabfrage ist die gleiche wie beim Pacman. Wenn
ein Monster mit einer Mauer kollidiert, dann prallt es 55
Pixel von ihr ab und bewegt sich in die entgegengesetzte
Richtung weiter. Die Zahl der Pixel ist so hoch gewählt,
damit das Monster nicht gleich nach dem Abprallen in einem
Wendepunkt landet. Um diese Wendepunkte kümmern wir uns
später. Verlassen Sie zunächst den Symbolbearbeitungsmodus.
Geben Sie den Monstern im Eigenschafteninspektor die
Instanznamen „gegner1“, „gegner2“, „gegner3“ und „gegner4“.
Öffnen Sie nun das Skript des Labyrinth-Movieclips und fügen
Sie noch innerhalb der with()-Anweisung folgende Zeilen ein:
//Kollision mit Monstern
for (i=1;i<5;i++){
if(hitTest(_root["gegner"+i])==true){
_root.gotoAndPlay(20);
}
}
Es wird geprüft, ob die Instanz „pacman“ mit einem der
Gegner kollidiert ist. Das ganze läuft wieder in einer
for-Schleife ab und der Zugriff auf die Instanzen „gegner1“
bis „gegner4“ erfolgt wieder über ein Array. Ist die
If-Bedingung wahr, wird ins Bild 20 gesprungen und das Spiel
ist verloren.
Fügen Sie im Bild 20 der Ebene „Text“ ein Schlüsselbild ein
und gestalten Sie die Meldung für das verlorene Spiel.
Vergessen Sie nicht auch hier eine Schaltfläche zum
neustarten einzufügen. Versehen Sie das Bild 10 und das Bild
20 mit einer stop()-Anweisung, damit der Film in diesen
Bildern anhält.

Spielende
Der Zufall
Kommen wir nun zu unseren Wendepunkten. An diesen Stellen
soll das Monster zufällig die Richtung wechseln.
Erzeugen Sie einen neuen Movieclip mit dem Namen
„wendepunkt“ und zeichnen Sie einen Kreis der Größe 6x6
Pixel. Fügen Sie in Bild 2 ein Schlüsselbild ein. Geben Sie
dem ersten Schlüsselbild folgendes Skript:
this._visible = false;
for(i=1;i<=4;i++){
if(this.hitTest(_root["gegner"+i])){
//Zufallszahlen
neueRichtung=Math.ceil(Math.random()*4);
//neue Richtung der Monster
with(_root["gegner"+i]){
if(neueRichtung==1){
//abstoßen
_x = _x - 10;
//geraderichten
_y = this. _y;
//bewegen
xGeschwindigkeit = -4;
yGeschwindigkeit = 0;
}
if(neueRichtung==2){
//abstoßen
_x=_x+10;
//geraderichten
_y=this._y;
//bewegen
xGeschwindigkeit=4;
yGeschwindigkeit=0;
}
if(neueRichtung==3){
//abstoßen
_y=_y-10;
//geraderichten
_x=this._x;
//bewegen
xGeschwindigkeit=0;
yGeschwindigkeit=-4;
}
if(neueRichtung==4){
//abstoßen
_y=_y+10;
//geraderichten
_x=this._x;
//bewegen
xGeschwindigkeit=0;
yGeschwindigkeit=4;
}
}
}
}
gotoAndPlay(2);
Eklärung:
this._visible = false;
Die Wendepunkte werden unsichtbar gesetzt.
for(i=1;i<=4;i++){
Eine for-Schleife mit der Zählervariablen i,die bei jedem
Schleifendurchlauf um eins erhöht wird. Die folgenden
Anweisungen werden ausgeführt, solange i kleiner als 4 ist.
if(this.hitTest(_root["gegner"+i])){
Diese If-Anweisung prüft, ob der Wendepunkt mit einem der
Monster zusammenstößt.
//Zufallszahlen
neueRichtung=Math.ceil(Math.random()*4);
Da jeder Wendepunkt vier mögliche Richtungen bietet wird
hier eine Zufallszahl aus der Menge {1, 2, 3, 4} ermittelt.
Math.random() ermittelt einen Zufallswert zwischen 0 und 1.
Math.ceil() rundet immer auf die nächst höhere ganze Zahl.
//neue Richtung der Monster
with(_root["gegner"+i]){
Diese with()-Anweisung wird aufgrund des Arrays für jeden
einzelnen Gegner abgearbeitet.
if(neueRichtung==1){
Die folgenden Zeilen werden ausgeführt für den Fall, dass
die ermittelte Zufallszahl 1 ist.
//abstoßen
_x = _x - 10;
Das Monster bewegt sich um 10 Pixel nach links.
//geraderichten
_y = this. _y;
Das Monster wird mit dem Wendepunkt vertikal zentriert
aneinander ausgerichtet.
//bewegen
xGeschwindigkeit = -4;
yGeschwindigkeit = 0;
Diese Variablen legen die Bewegungsgeschwindigkeit und die
Bewegungsrichtung fest. In diesem Fall bewegt sich das
Monster kontinuierlich um vier Pixel nach links.
}
Für die Fälle dass die ermittelte Zufallszahl 2, 3 oder 4
ist funktionieren die If-Anweisungen analog zur
beschriebenen.
Nach dem alle Anweisungen abgearbeitet sind springt der Film
ins Bild 2 und von dort aus beginnt der Film von vorn. Es
ist wieder eine Schleife entstanden.
Schließen Sie nun den Symbolbearbeitungsmodus und verteilen
einige Instanzen des Movieclips „wendepunkt“ auf der Bühne.
Wo Sie diese günstig positionieren sehen Sie in dieser
Abbildung.

mögliche Positionen der Wendepunkte
Damit wäre unser Pacman-Spiel voll funktionsfähig. Testen
Sie ihr Spiel, und verschieben Sie gegebenenfalls ein paar
Wendepunkte um den Schwierigkeitsgrad zu variieren.
Zur besseren Übersicht finden Sie hier noch einmal das
vollständige Skript für den Labyrinth-Movieclip:
onClipEvent(load){
_root.zeit=0;
_root.zeitausgabe=_root.zeit+" Sekunden";
}
onClipEvent(enterFrame){
with(_root.pacman){
//Tastatursteuerung
if(Key.isDown(Key.DOWN)){
_y +=4;
_rotation=90;
}
if(Key.isDown(Key.UP)){
_y -=4;
_rotation=270;
}
if(Key.isDown(Key.RIGHT)){
_x +=4;
_rotation=0;
}
if(Key.isDown(Key.LEFT)){
_x -=4;
_rotation=180;
}
//Kollisionsabfrage Wände
if(this.hitTest(getBounds(_root).xMax,_y,true)){
_x-=4;
}
if(this.hitTest(getBounds(_root).xMin,_y,true)){
_x+=4;
}
if(this.hitTest(_x, getBounds(_root).yMax,true)){
_y-=4;
}
if(this.hitTest(_x,getBounds(_root).yMin,true)){
_y+=4;
}
//Kollision mit "Futterpunkten"
for(i=1;i<80;i++){
if(hitTest(_root["futter"+i]) &&
_root["futter"+i]._visible==true){
_root.plopp.Start();
_root["futter"+i]._visible=false;
_root.punkte+=1;
_root.punktausgabe=_root.punkte+" Punkte";
}
}
//Kollision mit Monstern
for (i=1;i<5;i++){
if(hitTest(_root["gegner"+i])==true){
_root.gotoAndPlay(20);
}
}
}
//Timer
if(_root.punkte<79){
sekunden++;
if(sekunden==24){
_root.zeit+=1;
sekunden=1;
_root.zeitausgabe=_root.zeit+" Sekunden";
}
}
else{
_root.gotoAndStop(10);
}
}
Download spiel_03.fla (24KB)
|