Gravité de jeu

Dans certains jeux, il existe une force qui tire les composants du jeu vers une direction, par exemple, la gravité tire les objets vers le sol.

gravité

Pour ajouter cette fonctionnalité à notre constructeur de composant, veuillez d'abord ajouter une gravity Propriété, cette propriété réglée la gravité actuelle. Ensuite, ajoutez un gravitySpeed Les propriétés, qui augmentent à chaque fois que nous mettons à jour le cadre :

Exemple

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;
  }
}

Essayez-le vous-même

Toucher le sol

Pour éviter que la boîte rouge ne tombe éternellement, nous devons arrêter la chute lorsqu'elle atteint le bas de la zone de jeu :

Exemple

  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;
    }
  }

Essayez-le vous-même

Accélérer

Dans le jeu, lorsque une force tire le bloc vers le bas, vous devez concevoir une méthode pour forcer le composant à accélérer.

Un fonction est déclenchée lorsque quelqu'un clique sur le bouton, permettant à la boîte rouge de voler dans les airs :

Exemple

<script>
function accelerate(n) {
  myGamePiece.gravity = n;
}
</script>
<button onmousedown="accelerate(-0.2)" onmouseup="accelerate(0.1)">Accélérer</button>

Essayez-le vous-même

Un jeu

Construisez un jeu en fonction des connaissances que nous avons acquises jusqu'à présent :

Exemple

Essayez-le vous-même

Cliquez sur le bouton d'accélération pour commencer le jeu.

Combien de temps vivrez-vous ? Utilisez le bouton d'accélération pour rester en l'air.