Inhaltsverzeichnis:
Video: JeuTropFacile - WayTooEasyGame - Gunook
2024 Autor: John Day | [email protected]. Zuletzt bearbeitet: 2024-01-30 07:18
Dies ist ein Spiel, das vollständig auf HTML und JavaScript mit der Bibliothek P5js erstellt wurde. Es gibt 2 Dateien namens index.html und sketch.js. Ich bin sehr Anfänger im Code, daher tut es mir leid, wenn es unklar ist.
Sie können das Spiel mit diesem Link spielen
Du steuerst mit den Pfeiltasten einen weißen Ball und musst dem roten Ball ausweichen (derzeit gibt es nur einen).
Ich habe 2 Variablen erstellt: posX = 200 und posY = 200
Auf sketch.js habe ich im Funktionssetup eine Leinwand mit 640x x 480y mit grauem Hintergrund in der Funktion draw erstellt, dann habe ich einen weißen Kreis mit Position auf posX, posY, 75, 75 erstellt.
Schritt 1: Verschieben des Kreises
Wie ich bereits sagte, können Sie den Kreis mit den Pfeiltasten verschieben.
Dazu habe ich eine Funktion updatePositionEllipse() erstellt.
Ich habe diese Bedingung verwendet, damit es funktioniert: if (keyIsDown(DOWN_ARROW)) {
PosY += 5;
}
Wenn die Abwärtstaste gedrückt wird, bewegt sich der Kreis nach unten.
Ich habe es für alle anderen Tasten verwendet, damit Sie sich nach links, rechts, oben und unten bewegen können.
Schritt 2: Erstellen von Limitgrenzen
Um die weiße Kugel am Ende der Leinwand stoppen zu lassen, habe ich die Funktion testOutOfScreen verwendet.
Darin habe ich die Bedingung if (posX > 600) {
PosX = 600; Strichgewicht(6); Strich('blau'); Zeile(637, 0, 637, 480); }
Wenn die Position von x höher als 600 ist, wird der Ball blockiert und eine blaue Linie mit einer Umrandung 6 auf der rechten Seite der Leinwand gezeichnet.
Ich mache das für jede Grenze.