Slik kontrollerer du grenser i HTML5-spillet ditt - dummies

Når sprites begynner å bevege seg, er det alltid mulighet for at de forlater grensene på skjermen. Vanligvis svarer HTML5-spillutviklere på en av fem måter: vikle, hoppe, stopp, dø eller fortsett. SimpleGame-biblioteket har en grensekontrollrutine som lar deg spesifisere hvilken av disse standardoppføringene som skal brukes. Spriteens boundAction-egenskap indikerer hvilken handling som skal brukes. Du kan bruke grensekontrolleren til å gjøre følgende:

1. Bestem grensene.

   Grensene bestemmes av lerretets bredde.

2. Sjekk om brukeren er av en kantlinje.

   Deretter ble det laget en annen serie variabler som inneholder boolske verdier som angir om sprite er av en av kantene: OffRight, offLeft, offTop og offBottom. Bruk grunnleggende om setninger for å avgjøre om sprite er av skjermen på en av disse måtene.

3. Bestem grenseaksjonen.

   Bruk en enkel if-setning for å bestemme hvilken grensehandling som for øyeblikket er angitt for sprite.

4. Hvis boundAction er WRAP:

   Endre x eller y-variabelen til motsatt side, men la dx og dy-verdiene være alene.

5. Hvis boundAction er BOUNCE:

   Inverter dy hvis sprite hoppet av toppen eller bunnen, og dx hvis sprite sprang av venstre eller høyre. Det er ikke nødvendig å endre x eller y direkte.

6. Hvis boundAction er STOPP:

   Juster hastigheten til null uavhengig av hvilken grense som var avsluttet.

7. Hvis boundAction er DØD:

   Still hastigheten til null og påkall sprite's hide () -metoden. Dette vil føre til at sprite forsvinner og ikke lenger vurderes i kollisionsberegninger.

8. Enhver annen begrensning betraktes som FORTSATT.

   Ingen handling er nødvendig her fordi sprite vil fortsette å bevege seg selv om det ikke er synlig. Hvis dette er den ønskede effekten, bør du på en eller annen måte indikere for brukeren hvor sprite er, eller gi noen måte for sprite å returnere.

Her er en del av koden for kollisjonskontrollrutinen:

offRight = false; offLeft = false; offTop = false; offBottom = false; hvis (denne. x> rightBorder) {offRight = true;} hvis (denne. x bottomBorder) {offBottom = true;} hvis (denne. y <0) {offTop = true;} hvis (denne. boundAction == WRAP) {if (offRight) {this. x = leftBorder;} // end hvis hvis (offBottom) {this. y = topBorder;} // end hvis hvis (offLeft) {this. x = rightBorder;} // end hvis hvis (offTop) {this. y = bottomBorder;}} annet hvis (denne. boundAction == BOUNCE) {hvis (offTop || offBottom) {this.dy * = -1; dette. calcSpeedAngle (); dette. imgAngle = dette. moveAngle;} if (offLeft || offRight) {this. dx * = -1; dette. calcSpeedAngle (); dette. imgAngle = dette. moveAngle;}} annet hvis (denne. boundAction == STOP) {if (offLeft || offRight || offTop || offBottom) {this. setSpeed ​​(0);}} ellers hvis (dette. boundAction == DIE) {hvis (avLiv || avRett || avTop || avBottom) {dette. gjemme seg(); dette. setSpeed ​​(0);}} ellers {// fortsett å gå for alltid}} // End Checkbounds

Hvis du vil endre en Sprite grensehandling i SimpleGame, kan du bruke setBoundAction () -metoden til å gjøre det.

Vær oppmerksom på at enkelte situasjoner kan kreve forskjellig oppførsel. For eksempel kan det være lurt å vikle rundt sidene, men stopp oppe eller bunn. Hvis du trenger en mer spesifikk oppførsel, må du bare bygge en ny checkBounds () -metode for sprite. Du må imidlertid sjekke alle grenser fordi din nye checkBounds () vil overskrive den som er innebygd i simpleGame.