Sådan tilføjes Træk effekter til dine HTML5 spil

Vektoren tilsætning princip kan være nyttigt at din HTML5 spil på mange måder. For én, kan det tilføje trække effekt og dermed føre til mere præcise adfærd jord-køretøj. Forestil dig din bil sidder fast i et dårligt kvarter midt i natten (igen). Man kan ikke blot ændre positionen af ​​bilen direkte. Du kan ikke engang ændre sin bevægelse.

Hvad du skal gøre i stedet er at tilføje en kraft. Når du tilføjer kraft, du langsomt tilføje til bevægelsesvektoren. Til sidst, bilen begynder at bevæge sig. Hvis du holder op med at anvende kraft, vil det i sidste ende stoppe som vindmodstand og rullemodstand bremse bilen ned.

Gaming drag racer

Den drag.html eksempel viser en realistisk bil, der accelererer langsomt og bremser til et stop, da speederen (i dette tilfælde, pil op) frigøres.

Sådan tilføjes Træk effekter til dine HTML5 spil

Du vil virkelig nødt til at se programmet i aktion for at sætte pris på dens opførsel.

<! DOCTYPE HTML>
<Html lang = "en-US">
<Head>
<Meta charset = "UTF-8">
<Title> Træk </ title>
<Script type = "text / javascript"
src = "simpleGame.js"> </ script>
<Script type = "text / javascript">
var vildt;
Var båd;
funktion Car () {
tCar = ny Sprite (spil, "car.png", 100, 50);

tCar.checkKeys = function () {
console.log (this.speed);
Hvis (keysDown [K_LEFT]) {
this.changeImgAngleBy (-5);
}

Hvis (keysDown [K_RIGHT]) {
this.changeImgAngleBy (5);
}

Hvis (keysDown [K_UP]) {
this.addVector (this.imgAngle, 2);
}
// Bevæge sig i den aktuelle retning
this.addVector (this.imgAngle, 2);
} // end checkKeys

tCar.checkDrag = function () {
hastighed = this.getSpeed ​​();
hastighed * = .95;
this.setSpeed ​​(hastighed);
} // Ende checkDrag
tilbage tCar;
} // Ende bil def
funktion init () {
spil = ny scene ();
game.setBG ("# 666666");
bil = ny bil ();
game.start ();
} // Ende init
funktion opdatering () {
game.clear ();

car.checkKeys ();
car.checkDrag ();
car.update ();
} // Ende opdatering
</ Script>
</ Head>
<Body onload = "init ()">
</ Body>
</ Html>

Hvordan til at gennemføre træk i dit spil

Denne version bruger en mere realistisk kraft-baserede bevægelse. Når brugeren trykker på pil op, bilen opbygger fart. Hvis brugeren forlader pil op presset, bilen når en tophastighed naturligt. Når brugeren frigiver pil op, bilen gradvist langsommere og til sidst stopper. Kraftvektorer er nøglen.

Det er sådan her det virker:

  1. Byg en grundlæggende køretøj.

    Opret en tilpasset sprite med en checkKeys () metode, og se efter alle de normale piletasterne. Koden til kontrol venstre og højre pile er præcis, hvad du forventer.
  2. Flyt frem med en kraft vektor.

    Koden til at komme videre er lidt anderledes. I stedet for blot at ændre den hastighed direkte, anvende en kraft i bilens aktuelle retning. Brug sprite s getImgAngle () metode til at bestemme, hvilken retning bilen peger, og tilføje en lille styrke i den retning.
  3. Opret en checkDrag () metode.

    Biler er ikke bare holde går uden strøm. Vind og jord modstand vil bremse dem ned, og i sidste ende vil de stoppe. Simulere forskellige trækkræfter ved at tilføje en checkDrag () metode til dit objekt.
  4. Gang hastighed ved et træk faktor.

    I dette eksempel er de forskellige trækkræfter vil berøve bilen af ​​5 procent af dets hastighed for hver ramme. Husk, at spillet kører på 20 frames per sekund, så trækkraften er ganske betydelige. Du kan opnå træk effekt på mange måder, men den nemmeste måde er at formere bilens hastighed ved en vis værdi er mindre end 1.
  5. Ingen bremser!

    Hvilken respekt for sig selv arcade bil har bremser? Seriøst, kan du ønsker at tilføje en pil ned input, men det burde ikke være nødvendigt, da bilen vil bremse på egen hånd.
  6. Smag til.

    Dette eksempel giver en rå skitse, men du kan ændre en række værdier for at få præcis den bil ydelse, du ønsker. Du kan simulere en kraftigere motor (eller en mindre masse) ved at øge kraftvektor når du trykker på speederen.

    Du kan simulere en mere lydhør suspension ved at ændre dreje sats, hvis brugeren trykker højre eller venstre pile. Man kan også simulere en mere eller mindre effektiv bil ved at modificere træk ratio. Lige nu, bilen vender ved enhver hastighed, men du kan forhindre venstre- og højre-pil-indgange, hvis bilen er under en vis hastighed.


© 2019 Zajacperrone.com | Contact us: webmaster# zajacperrone.com