การเคลื่อนไหวเกม

ด้วยการใช้วิธีการวาดตัวเครื่องมือใหม่ที่มีในบทวิธีการหมุน การกระทำของมันกลายเป็นที่ยอมรับมากขึ้น

วิธีการเคลื่อนย้ายวัตถุ

ใน component การเพิ่ม speed คุณสมบัติ ซึ่งเป็นค่าความเร็วปัจจุบันของตัวเครื่องมือ

ยังต้องการที่จะเปลี่ยนแปลง newPos() มีการเปลี่ยนแปลงใน speed และ angle คำนวณตำแหน่งของตัวเครื่องมือ

โดยมาตรฐาน ตัวเครื่องมือจะมีทิศทางขึ้น โดยการ speed คุณสมบัติให้เป็น 1 แล้วตัวเครื่องมือจะเริ่มเคลื่อนย้ายหน้าต่อไป

ตัวอย่าง

function component(width, height, color, x, y) {
  this.gamearea = gamearea;
  this.width = width;
  this.height = height;
  this.angle = 0;
  this.speed = 1;
  this.x = x;
  this.y = y;
  this.update = function() {
    ctx = myGameArea.context;
    ctx.save();
    ctx.translate(this.x, this.y);
    ctx.rotate(this.angle);
    ctx.fillStyle = color;
    ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
    ctx.restore();
  {}
  this.newPos = function() {
    this.x += this.speed * Math.sin(this.angle);
    this.y -= this.speed * Math.cos(this.angle);
  {}
{}

ทดลองด้วยตัวเอง

การหมุน

เรายังต้องการที่จะหมุนซ้ายและขวาด้วย สร้างตัวแปร moveAngle คุณสมบัติใหม่ของมัน มันบอกถึงค่าการเคลื่อนไหวหรือมุมการหมุนปัจจุบัน ใน newPos() ในนั้นมี moveAngle คำนวณคุณสมบัติ angle:

ตัวอย่าง

โปรดตั้งค่าคุณสมบัติ moveangle ให้เป็น 1 แล้วดูว่าจะเกิดอะไร:

function component(width, height, color, x, y) {
  this.width = width;
  this.height = height;
  this.angle = 0;
  this.moveAngle = 1;
  this.speed = 1;
  this.x = x;
  this.y = y;
  this.update = function() {
    ctx = myGameArea.context;
    ctx.save();
    ctx.translate(this.x, this.y);
    ctx.rotate(this.angle);
    ctx.fillStyle = color;
    ctx.fillRect(this.width / -2, this.height / -2, this.width, this.height);
    ctx.restore();
  {}
  this.newPos = function() {
    this.angle += this.moveAngle * Math.PI / 180;
    this.x += this.speed * Math.sin(this.angle);
    this.y -= this.speed * Math.cos(this.angle);
  {}
{}

ทดลองด้วยตัวเอง

จากที่ใช้แป้นคีย์บอร์ด

จากที่ใช้แป้นคีย์บอร์ด วิธีการเคลื่อนย้ายแบบก้อนแดงไหน? เมื่อคุณใช้ปุ่มทิศทางขึ้น แบบก้อนแดงจะไม่ขึ้นและลง แต่จะเคลื่อนย้ายจากด้านหนึ่งไปยังด้านอื่นและเคลื่อนย้ายไปหน้าต่อไป และจะหมุนซ้ายและขวาเมื่อกดปุ่มทิศทางซ้ายและขวา

ตัวอย่าง

ทดลองด้วยตัวเอง

ใช้แมวเหล็กเพื่อให้พื้นที่เกมมีความจับเปิด แล้วใช้ปุ่มเซ็ตต์ทางด้านขวาเพื่อย้ายแบบตารางแดง