| |
Gäste Online: 5
Keine Mitglieder Online
Registrierte Mitglieder: 1,050
Neustes Mitglied: Hydralistika
|
|
|
| Teil 3: Serie zur Entwicklung eines Weltraumshooters |
Und noch einmal "Guten Morgen",
heute wollen wir uns damit beschäftigen wie wir unser kleines Raumschiff dazu bringen, dass es sich auf dem Bildschirm bewegt.
Dazu fangen wir erst einmal ganz einfach an und lassen unser Raumschiff an der Position unserer Mauszeigers zeichnen, was wirklich nicht gerade schwer ist. Doch zu allererst öffnen wir erst einmal wieder unser Projekt ;)
Dann fügen wir MouseState mouse; nach unserer Anweisung Texture2D raumschiff aus dem letzten Teil ein.
MouseState ist dafür zuständig die gesamten Daten der Maus zu fassen. Das wird mit der nächsten Codezeile deutlich, die wir in die Update-Methode schreiben: mouse = Mouse.GetState();
Hiermit übergeben wir unserem MouseState (mouse) die gerade aktuellen Daten der Maus, wie etwa, welche Taste gerade im Moment gedrückt wurde, und natürlich auch die Position der Maus.
Das benötigen wir dann im folgenden Codefragment, nämlich wenn wir jetzt unser Raumschiff bei der Position des Mauszeigers zeichnen lassen wollen. Dafür verädern wir unsere altbekannte Codezeile: spriteBatch.Draw(raumschiff, new Rectangle(0, 0, raumschiff.Width, raumschiff.Height), Color.White);
In die folgende um: spriteBatch.Draw(raumschiff, new Rectangle(mouse.X, mouse.Y, raumschiff.Width, raumschiff.Height), Color.White);
Nun wollen wir doch mal schauen, was wir da so alles angestellt haben und drücken einfach mal F5.
Und siehe da ... nach kurzer Zeit gibt sich uns das Bild, dass das Raumschiff tatsächlich an der Stelle angezeigt wird, wo sich der Mauszeiger befindet. Jedoch sehen wir leider den Mauszeiger nicht, also beenden wir einmal das Programm und fügen noch schnell in der LoadContent() Methode folgende Zeile ein: IsMouseVisible = true;
Dadurch wird der Mauszeiger in unserem Fenster angezeigt, wie wir nach erneutem drücken der F5 Taste feststellen können.
Das sind ja schon mal tolle Ergebnisse, die wir da erzielen, doch es ist nicht ganz das was wir ja eigentlich wollen. Wir wollen ja das Raumschiff mit den Cursortasten nach links und rechts bewegen können.
Also nochmal von vorne: Die vorher eingetippten Codezeilen löschen wir erst einmal wieder, sodass wir nun wieder den "ursprünglichen" Code haben.
Zur Abfrage der Tastatur gehen wir nahezu genauso vor wie zuvor bei der Maus. Jedoch geben wir nun anstatt MouseState mouse; KeyboardState keyState; ein, da wir ja die Tastatur abfragen wollen. Dann geben wir direkt danach noch folgende Codezeile ein: Point raumschiffPosition; Hiermit haben wir einen Punkt erstellt, der die linke obere Ecke unserer Raumschiffgrafik repreäsentieren soll.
Die Update() Methode ändern wir wie gefolgt ab: keyState = Keyboard.GetState();
if (keyState.IsKeyDown(Keys.Left)) raumschiffPosition.X -= 3; else if (keyState.IsKeyDown(Keys.Right)) raumschiffPosition.X += 3;
Hier können wir wieder sehen, das wir keyState die aktuellen Werte der Tastatur geben. Danach überprüfen wir anhand von if Schleifen ob die linke oder der rechte Cursortaste gedrückt ist. Wenn dem der Fall ist dann wir die Position des Raumschiffes dahingehen verändert.
Natürlich müssen wir jetzt noch unsere Draw() Methode ein bisschen anpassen; die sieht danach wie gefolgt aus: spriteBatch.Draw(raumschiff, new Rectangle(raumschiffPosition.X, raumschiffPosition.Y, raumschiff.Width, raumschiff.Height), Color.White);
Nun können wir das ganze natürlich schon einmal starten. Wir können sehen, dass beim drücken der linken und rechten Cursortaste das Raumschiff auch hin und her geht, doch es befindet sich noch nicht an der richtigen Position.
Das Raumschiff soll ja unten ganz kurz vor Ende des Bildschirms erscheinen und soll natürlich auch in der Mitte starten.
Dazu fügen wir ganz einfach in der LoadContent() Methode nach dem letzten Befehl folgende Zeile ein: raumschiffPosition = new Point(graphics.PreferredBackBufferWidth / 2-(raumschiff.Width/2), 450);
Durch diese wird dem Punkt die genaue Position mitgeteilt; und zwar das er bei der Hälfte der Fensterweite, abgezogen der Hälfte der Raumschiffgrafikweite sein soll. Wir bedenken, Point, repräsentiert den oberen linken Punkt der Grafik, also müssen wir die Hälfte der Grafikweite abziehen, das es schön mittig dargestellt wird. Und die 450 geben einfach nur die fixe Höhe an, auf der das Raumschiff, von der Y-Achse aus gesehen, sein soll. Wenn wir das Projekt nun kompilieren, dass sehen wir das es super funktioniert und auch genauso wie wir das wollen.
Doch es gibt noch einen kleinen Punkt, den wir bemängeln könnten. Und zwar verschwindet das Raumschiff am Rand wenn wir zu weit gehen:

Das ist natürlich nicht schön und das wollen wir noch schnell beheben. Dazu springen wir in die Update() Methode und fügen noch ein klein bisschen Code dort ein: if (keyState.IsKeyDown(Keys.Left) && raumschiffPosition.X > 0) raumschiffPosition.X -= 3; else if (keyState.IsKeyDown(Keys.Right) && raumschiffPosition.X < (graphics.PreferredBackBufferWidth - raumschiff.Width)) raumschiffPosition.X += 3;
Damit teilen wir den if-Schleifen mit, dass sie auch schauen sollen, ob die Positionen des Raumschiffes über dem Rand des Fenster liegen, falls dem der Fall sein sollte dann wird die raumschiffPosition.X einfach nicht weiter erhöht.
Nach erfolgreichem kompilieren und ausprobieren sehen wir dass das tatsächlich so funktioniert wie wir es wollen.

Hier finden Sie nun auch den kompletten Code aus diesem Beispiel: Code
Und hoffe das ihnen dieser Teil auch Spaß gemacht hat. Bei Fragen, Anregungen, Kritik, etc können sie sich gerne melden.
|
|
|
Es wurden keine Kommentare geschrieben.
|
|
|
Bitte einloggen, um einen Kommentar zu schreiben.
|
|
|
Die Bewertung ist nur für Mitglieder verfügbar.
Bitte loggen Sie sich ein oder registrieren Sie sich, um abzustimmen.
Keine Bewertung eingesandt.
|
|
|
Noch kein Mitglied? Klicke hier um dich zu registrieren.
Passwort vergessen? Fordere Hier ein neues an
|
|
|
|