Spel Zwaartekracht
Sommige spellen hebben krachten die het spelonderdeel in één richting trekken, zoals de zwaartekracht objecten naar de grond trekt.
Zwaartekracht
Om deze functionaliteit aan onze componentconstructor toe te voegen, voegt u eerst een gravityeigenschap toe die de huidige zwaartekracht instelt. Voeg vervolgens een gravitySpeedeigenschap toe, die elke keer dat we het frame bijwerken toeneemt:
Voorbeeld
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;
}
}
Raak de bodem
Om te voorkomen dat het rode vierkant voor altijd valt, stop het vallen wanneer het de onderkant van het spelgebied raakt:
Voorbeeld
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;
}
}
Versnellen
Als je in een spel een kracht hebt die je naar beneden trekt, zou je een methode moeten hebben om het onderdeel te laten versnellen.
Activeer een functie wanneer iemand op een knop klikt en laat het rode vierkant de lucht in vliegen:
Voorbeeld
<script>function accelerate(n) {
myGamePiece.gravity = n;
}</script>
<button onmousedown="accelerate(-0.2)" onmouseup="accelerate(0.1)">ACCELERATE</button>
Een spel
Maak een spel op basis van wat we tot nu toe hebben geleerd: