JeuTropFacile - WayTooEasyGame: 3 stappe

2024 Outeur: John Day | [email protected]. Laas verander: 2024-01-30 07:25

Dit is 'n spel wat volledig op HTML en JavaScript gemaak is met die biblioteek P5js. Daar is 2 lêers met die naam index.html en sketch.js. Ek is baie beginner in kode, so ek is jammer as dit onduidelik is.

U kan die speletjie speel met hierdie skakel

Jy beheer 'n wit bal met die pyltjie sleutels en jy moet die rooi bal vermy (tans is daar net een).

Ek het 2 veranderlikes geskep: posX = 200 en posY = 200

Op sketch.js het ek 'n canva in die funksie -opstelling geskep met 640x by 480y met 'n grys agtergrond in die funksie -teken, en dan het ek 'n wit sirkel gemaak met posisie op posX, posY, 75, 75.

Stap 1: Beweeg die sirkel

Soos ek al voorheen gesê het, kan u die sirkel met die pyltjie sleutels gebruik.

Om dit te kan doen, het ek 'n funksie updatePositionEllipse () geskep.

Ek het hierdie voorwaarde gebruik om dit te laat werk: if (keyIsDown (DOWN_ARROW)) {

posY += 5;

}

As die af -sleutel ingedruk word, beweeg die sirkel af.

Ek het dit op elke ander sleutel gebruik, sodat u links, regs, op en af kan beweeg.

Stap 2: Skep limietgrense

Om die wit bal aan die einde van die canva te laat stop, het ek die funksie testOutOfScreen gebruik.

Binne het ek die toestand gebruik as (posX> 600) {

posX = 600; beroertegewig (6); beroerte ('blou'); reël (637, 0, 637, 480); }

as posisie van x hoër is as 600: dit blokkeer die bal en trek 'n blou lyn met 'n rand 6 aan die regterkant van die canva.

Ek doen dit vir elke grens.