Jan 042013
 

Stunde #2-9: Erstellen der Spielfigur

Nun, da wir unser Grundgerüst gebaut haben, werden wir unseren Hauptcharakter in das Spiel einbinden.

Um dies zu tun, werden wir eine neue Klasse erstellen, in welche wir die folgenden Dinge einarbeiten:

1. Verwalten der X- und Y-Koordinaten und der Geschwindigkeit.

2. Aktualisierungen vornehmen, um die Geschwindigkeit und Position anzupassen.

3. Andere Klassen können die Variablen X und Y abrufen.

Daher werden die Methoden dieser Klasse in folgende Kategorien eingeteilt:

1. Ständig aktualisierte Methoden, die bei jedem Durchlauf der Spielschleife aufgerufen werden.

2. Methoden, die nur bei Spielereingaben gebraucht werden.

3. Hilfsmethoden, welche die Werte der Variablen in der Klasse abrufen und ändern.

Wir fangen damit an, eine neue Klasse in unserem Basteldroid Paket zu erstellen. Wir nennen diese Klasse Robot und fügen den folgenden Code ein:

 Was heißt das?

1. centerX und centerY ist der Mittelpunkt unserer Spielfigur

2. speedX und speedY ist die Geschwindigkeit, in welcher diese X- und Y-Koordinaten sich ändern

3. jumped ändert sich zu true, wenn die Spielfigur in der Luft ist, und wird false, wenn sie am Boden ist

Die genutzten Methoden werden wir nun nach und nach durchgehen.

1. Ständig aktualisierte Methoden:

update(): Diese Methode wird bei jedem Durchlauf der Methode aufgerufen. Dies ist eine sehr wichtige Methode, daher werden wir auch etwas mehr Zeit damit verbringen. Bitte seht euch diese Methode genauer an, um zu verstehen, was genau jede einzelne Variable bedeutet. Beim Durchlesen der update() Methode sollten wir folgendes immer bedenken:

1. Die Geschwindigkeit kann auch negativ sein. Das negative Vorzeichen der X-Variable bewirkt, dass die Figur sich nach links bewegt.

2. Der Ursprung (X = 0, Y = 0) ist immer oben links (siehe Abbildung unten). Ein positiver Y-Wert bewirkt demnach, dass die Figur sich auf dem Bildschirm nach unten bewegt.

1

 

3. x += 1; bedeutet das Selbe wie x = x + 1;.

4. Wir werden unseren Boden bei 440 Pixeln setzen. Das bedeutet, dass in Y-Richtung bei 382 Pixeln die Mitte unseres Roboters ist.

5. Wenn unsere Spielfigur näher als 60 Pixel am linken Rand ist, wird seine Hand außerhalb sein.

2

Also lasst uns nochmal den Code von der update() Methode anschauen:

Was bedeutet: // Bewegt den Roboter oder passt den Hintergrund an.

1. Das erste If Statement ist dafür da, unsere Spielfigur immer an der gewünschten Stelle darzustellen. Die Variable centerX muss immer kontrolliert und einem Update unterzogen werden, solange sich die Figur bewegt. Sollte die Figur jedoch stehen, also speedX = 0 sein, muss centerX nicht verändert werden.

2. Schaut euch als Beispiel einen Teil dieses Spiels an (Ich möchte mich hier nur auf die Grafik des Spiels beziehen).

In diesem Spiel kann dies die Figur frei bewegen auf der linken Hälfte des Bildschirms, wenn die Spielfigur aber anfängt, sich nach rechts zu bewegen, bleibt diese immer auf der selben Position stehen und der Hintergrund fängt an sich zu bewegen. Genau das versuchen wir auch zu erreichen. Solange speedX = 0 ist, werden wir den Hintergrund nicht verändern. Solange die Spielfigur sich zwischen 60 und 150 Pixeln der X-Koordinate bewegt, kann sie sich frei bewegen. Anderenfalls werden wir die Spielfigur stehen lassen und der Hintergrund soll sich bewegen.

Was bedeutet: // Update der Y-Position und // Hier wird das Springen kontrolliert.

Die Schwerkraft ist allgegenwärtig, daher wird unsere Spielfigur auch immer in die Richtung des Bodens gezogen. Wir haben angenommen, dass der Boden bei ungefähr 440 Pixeln von oben ist. Wenn unsere Spielfigur springt, wird sie automatisch wieder Richtung Boden gezogen, die Position der Mitte unserer Figur kann aber niemals unter 382 gehen, da diese sonst unterhalb des Bodens ist.

Desweiteren wird hier geschaut, ob unsere Spielfigur am Boden steht oder gerade einen Sprung ausführt.

Was bedeutet: // Verhindert, dass unsere Spielfigur einen gewissen Punkt in X-Richtung überschreitet.

Hier wird überprüft, ob unsere Spielfigur versucht, nach links aus dem Bildschirm zu laufen und hält immer automatisch einen Mindestabstand von 61 Pixeln.

Das sollte die update() Methode ausführlich erläutert haben, gehen wir nun weiter zu den anderen Methoden:

2. Methoden die nur bei Spielereingaben gebraucht werden.

moveRight(), hier wird die Geschwindigkeit der Spielfigur auf 6 Pixel gesetzt und der Spieler bewegt sich nach rechts
moveLeft(), hier wird die Geschwindigkeit der Spielfigur auf -6 Pixel gesetzt  und der Spieler bewegt sich nach links
stop(), hier wird die Spielfigur angehalten, speedX = 0
jump(), hier wird gesprungen, speedY = -15, also nach oben.

3. Hilfsmethoden

Diese werden wir weiter unten hinzufügen.

Stunde #2-10: Grundlagen der Graphik

Um ein wenig Klarheit in die speed-Variablen und Pixel zu bekommen, werden wir diese nun etwas genauer betrachten.

Pixel sind kleine Quadrate auf unseren Bildschirmen (picture elements – Bildelemente). Diese sind die kleinsten Einheiten und sind entweder an oder aus und haben eine Farbe.

Bildschirmauflösung ist die Angabe der Anzahl der horizontalen und vertikalen Pixel. Zum Beispiel: eine Bildschirmauflösung von 1920 x 1080 bedeutet, dass 1920 horizontale Pixel und 1080 vertikale Pixel auf dem Bildschirm vorhanden sind.

Wenn wir nun auf unserem Bildschirm eine Koordinate angeben, tun wir das wie folgt: (x, y). Die obere linke Ecke ist dabei immer der Start, also (0, 0). Die untere rechte Ecke unseres Beispiels wäre dann (1919, 1079), da wir bei 0 anfangen zu zählen, nicht bei 1.

Dieses Wissen werden wir nun dazu verwenden, um eine Illusion von Bewegung im Spiel unterzubringen. In der StartingClass Klasse werden wir die paint Methode schreiben, welche so ähnlich aussieht wie: drawRobot(centerX, centerY). Dies wird einen Roboter mit den Koordinaten (x, y) zeichnen.

Wenn wir nun sagen moveRight(), also bewege dich nach rechts, wird ein horizontaler Wert von 6 Pixeln, speedX = 6, zur Berechnung hinzugefügt. In unserem Fall wird die 6 zu centerX addiert, was zur Folge hat, dass sich der Mittelpunkt unseres Roboters um 6 Pixel nach rechts verschiebt. Wenn dies schnell genug passiert, erzeugt dies beim Betrachter die Illusion einer Bewegung.

Erstellen eines Roboters

Nun, da wir unsere Roboter Klasse erstellt und bearbeitet haben, gehen wir in unsere StartingClass Klasse. Direkt unter public class StartingClass extends Applet implements Runnable, KeyListener { werden wir folgendes hinzufügen, um unsere Roboter Klasse aufrufbar zu machen: private Robot robot;

Damit unsere Roboter Klasse auch gestartet werden kann, werden wir nun robot = new Robot(); in die start() Methode aufnehmen. Jetzt können wir die Roboter Klasse jederzeit aufrufen, wenn wir einfach schreiben robot.methodenName().

Keine Angst, das war es noch nicht mit Lektion 4 – Spielfigur einbinden. Aufgrund der Übersichtlichkeit und der Länge der Lektion, habe ich diese in zwei Teile geteilt.

Falls ihr Fragen habt, immer raus damit, ich helfe euch sehr gerne. Hinterlasst bitte einfach einen Kommentar.

Teilt diese Seite mit euren Freunden und besucht uns mal auf Facebook und auf Google+, das würde dieser Seite wirklich weiterhelfen, danke sehr. Auch ein Klick auf die Werbung hilft dabei, diese Seite am Laufen zu halten.

Quelle: Original Anleitung auf englisch von Kilobolt Studios

Lektion 3 – Input des Benutzers Lektion 4 – Spielfigur einbinden Teil 2