Algunos juegos tienen fuerzas que arrastra el componente de juego en una dirección, como la gravedad atrae los objetos al suelo.
Gravedad
Para agregar esta funcionalidad a nuestro constructor de componente, primero agregar una gravity
propiedad, que establece la gravedad actual. A continuación, añadir un gravitySpeed
propiedad, lo que aumenta cada vez que la actualización del marco:
Ejemplo
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 ;
}
}
Inténtalo tú mismo " Tocado fondo
Para evitar el cuadrado rojo de caer para siempre, detener la caída cuando llega a la parte inferior del área de juego:
Ejemplo
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;
}
}
Inténtalo tú mismo " Subir rápido
En un juego, cuando se tiene una fuerza que tira hacia abajo, usted debe tener un método para forzar el componente de acelerar hacia arriba.
Desencadenar una función cuando alguien hace clic en un botón, y hacer que el cuadrado rojo vuela en el aire:
Ejemplo
<script>function accelerate(n) {
myGamePiece.gravity = n;
}</script>
<button onmousedown="accelerate(-0.2)"
onmouseup="accelerate(0.1)">ACCELERATE</button>
Inténtalo tú mismo " Un juego
Hacer un juego basado en lo que hemos aprendido hasta ahora: