Spiel-Gewicht

有些游戏中存在将游戏组件拉向一个方向的力，例如重力将物体拉向地面。

重力

如需将此特性添加到我们的组件构造函数中，请首先添加一个 gravity 属性，该属性设置当前的重力。然后添加一个 gravitySpeed Eigenschaften, die bei jeder Aktualisierung des Frames erhöht werden:

Beispiel

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

Probieren Sie es selbst aus

Bodenberührung

Um zu verhindern, dass der rote Quadrat ständig fällt, müssen wir den Fall stoppen, wenn es das untere Ende des Spielbereichs erreicht:

Beispiel

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

Probieren Sie es selbst aus

Beschleunigung

Wenn in einem Spiel eine Kraft den Quadrat nach unten zieht, sollten Sie eine Methode entwerfen, um die Komponente zu beschleunigen.

Wenn jemand auf den Knopf klickt, wird eine Funktion ausgelöst, die den roten Quadrat in die Luft schleudert:

Beispiel

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

Probieren Sie es selbst aus

Ein Spiel

Erstellen Sie ein Spiel basierend auf dem, was wir bisher gelernt haben:

Beispiel

Probieren Sie es selbst aus

Klicken Sie auf den Beschleunigungsknopf, um das Spiel zu starten.

Wie lange werde ich leben? Verwenden Sie den Beschleunigungsknopf, um im Luft zu bleiben.