Alcuni giochi hanno forze che tira il componente di gioco in una sola direzione, come la gravità tira oggetti a terra.
Gravità
Per aggiungere questa funzionalità al nostro costruttore di componenti, prima aggiungere una gravity proprietà, che stabilisce la gravità corrente. Quindi aggiungere un gravitySpeed proprietà, che aumenta ogni volta che aggiorna il telaio:
Esempio
function component(width, height, color, x, y,
type) {
this.type = type;
this.width = width;
this.height = height;
this.x = x;
this.y = y;
this.speedX = 0;
this.speedY = 0;
this.gravity = 0.05;
this.gravitySpeed = 0;
this.update =
function() {
ctx =
myGameArea.context;
ctx.fillStyle = color;
ctx.fillRect(this.x, this.y, this.width, this.height);
}
this.newPos = function() {
this.gravitySpeed += this.gravity;
this.x += this.speedX;
this.y
+= this.speedY + this.gravitySpeed ;
}
}
Prova tu stesso " Toccato il fondo
Per evitare che il quadrato rosso di cadere per sempre, fermare la caduta quando colpisce la parte inferiore dell'area di gioco:
Esempio
this.newPos = function() {
this.gravitySpeed += this.gravity;
this.x += this.speedX;
this.y
+= this.speedY + this.gravitySpeed;
this.hitBottom();
}
this.hitBottom = function() {
var rockbottom = myGameArea.canvas.height - this.height;
if (this.y > rockbottom) {
this.y = rockbottom;
}
}
Prova tu stesso " accelerare Up
In un gioco, quando si dispone di una forza che si tira giù, si dovrebbe avere un metodo per forzare il componente per accelerare fino.
Attivare una funzione quando un utente fa clic su un pulsante, e rendere il quadrato rosso volare in aria:
Esempio
<script>function accelerate(n) {
myGamePiece.gravity = n;
}</script>
<button onmousedown="accelerate(-0.2)"
onmouseup="accelerate(0.1)">ACCELERATE</button> Prova tu stesso " Un gioco
Fare un gioco basato su ciò che abbiamo imparato finora: