Trò chơi Gravity
Một số trò chơi có các lực kéo thành phần trò chơi theo một hướng, giống như lực hấp dẫn kéo các vật thể xuống đất.
Trọng lực
Để thêm chức năng này vào hàm tạo thành phần của chúng tôi, trước tiên hãy thêm một gravitythuộc tính, thuộc tính này thiết lập lực hấp dẫn hiện tại. Sau đó, thêm một gravitySpeedthuộc tính, thuộc tính này sẽ tăng lên mỗi khi chúng tôi cập nhật khung:
Thí dụ
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;
}
}
Nhấn vào đáy
Để ngăn hình vuông màu đỏ không rơi mãi mãi, hãy dừng rơi khi nó chạm đáy khu vực trò chơi:
Thí dụ
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;
}
}
Tăng tốc
Trong một trò chơi, khi bạn có một lực kéo bạn xuống, bạn nên có một phương pháp để buộc thành phần đó tăng tốc.
Kích hoạt một chức năng khi ai đó nhấp vào một nút và làm cho hình vuông màu đỏ bay lên trong không trung:
Thí dụ
<script>function accelerate(n) {
myGamePiece.gravity = n;
}</script>
<button onmousedown="accelerate(-0.2)" onmouseup="accelerate(0.1)">ACCELERATE</button>
Một trò chơi
Tạo trò chơi dựa trên những gì chúng tôi đã học được cho đến nay: