JeuTropFacile - WayTooEasyGame - Ajarnpa

2024 Auteur: John Day | [email protected]. Laatst gewijzigd: 2024-01-30 11:16

Dit is een spel dat volledig is gemaakt op HTML en JavaScript met de bibliotheek P5js. Er zijn 2 bestanden genaamd index.html en sketch.js. Ik ben erg beginner in code, dus het spijt me als het onduidelijk is.

Je kunt het spel spelen via deze link

Je bestuurt een witte bal met de pijltjestoetsen en je moet de rode bal ontwijken (momenteel is er maar één).

Ik heb 2 variabelen gemaakt: posX = 200 en posY = 200

Op sketch.js heb ik een canva gemaakt in de functie-setup met 640x bij 480y met een grijze achtergrond in de functie-tekening, daarna heb ik een witte cirkel gemaakt met positie op posX, posY, 75, 75.

Stap 1: De cirkel verplaatsen

Zoals ik al eerder zei, kun je de pijltjestoetsen gebruiken om de cirkel te verplaatsen.

Om dat te doen heb ik een functie gemaakt updatePositionEllipse().

Ik heb deze voorwaarde gebruikt om het te laten werken: if (keyIsDown(DOWN_ARROW)) {

posY += 5;

}

Wanneer de omlaag-toets wordt ingedrukt, gaat de cirkel naar beneden.

Ik heb het op alle andere toetsen gebruikt, zodat je naar links, rechts, omhoog en omlaag kunt bewegen.

Stap 2: Grensgrenzen maken

Om de witte bal aan het einde van het canvas te laten stoppen, heb ik de functie testOutOfScreen gebruikt.

Binnenin gebruikte ik de voorwaarde if (posX> 600) {

posX = 600; slagGewicht (6); beroerte('blauw'); lijn (637, 0, 637, 480); }

als de positie van x groter is dan 600: het blokkeert de bal en tekent een blauwe lijn met een rand 6 aan de rechterkant van het canvas.

Ik doe dit voor elke grens.