WebVision Canvas
เวิร์กโฟลว์

ตัวอย่าง Phaser JS สำหรับเวิร์กโฟลว์ของ Phaser Studio

03
แก้ Tilemap กระตุก

แก้ Tilemap กระตุกเมื่อกล้องติดตาม Sprite

Tilemap มักจะกระตุกเมื่อกล้องติดตาม Sprite สาเหตุอาจไม่ชัดเจน ตัวแทนจะอ่านโค้ดฉากและปรับการตั้งค่าการติดตามกล้อง จากนั้นจะรันคำสั่ง Build ของคุณเพื่อตรวจสอบว่าโปรเจกต์ยังสร้างได้สำเร็จ และคุณต้องตรวจสอบการกระตุกในเบราว์เซอร์ คุณตรวจสอบ Diff ก่อนยอมรับการเปลี่ยนแปลง

01

เปิดโฟลเดอร์โปรเจกต์

เปิดโฟลเดอร์ในหน้าต่างแชทของตัวแทน

02

แสดงรายการไฟล์ฉาก

ตัวแทนจะแสดงรายการไฟล์ฉากทั้งหมดในโฟลเดอร์

03

อ่านโค้ดฉาก

ตัวแทนจะอ่านไฟล์โค้ดฉากหลัก

04

รันคำสั่ง Build

ตัวแทนจะรันคำสั่ง Build เพื่อตรวจสอบข้อผิดพลาด

โครงสร้างเกมพื้นฐาน

src/main.js
class MainScene extends Phaser.Scene {
  constructor() {
    super('MainScene');
  }
  create() {
    this.add.text(400, 300, 'Hello World', {
      fontSize: '32px',
      fill: '#ffffff'
    });
  }
}
const config = {
  type: Phaser.AUTO,
  width: 800,
  height: 600,
  scene: MainScene
};
new Phaser.Game(config);

ตัวอย่าง JavaScript ธรรมดาแสดงคลาสฉากพื้นฐานพร้อมวัตถุข้อความ การกำหนดค่าตั้งค่าประเภทเกมเป็น AUTO และกำหนดความกว้างและความสูง

เวิร์กโฟลว์ Phaser TypeScript

วิเคราะห์โค้ดฉาก

ตัวแทนใช้ list_dir เพื่อทำแผนที่โครงสร้างโปรเจกต์และค้นหาไฟล์ฉาก จึงอ่านโค้ดหลักด้วย read_file เพื่อทำความเข้าใจเกม ทำงานในเครื่อง ค้นหาวัตถุเกมโดยใช้ grep เพื่อระบุข้อผิดพลาด อ่านเอกสาร Phaser ทางการด้วย web_search และ http_get เพื่อตรวจสอบลายเซ็นเมธอด คุณวางแผนในโหมด Plan only เพื่อดูการเปลี่ยนแปลง สามารถสลับเป็น Ask first เพื่ออนุมัติการแก้ไขแต่ละครั้ง ใช้การแก้ไขและแสดง Diff ให้คุณดูสำหรับทุกไฟล์ ทดสอบตัวอย่าง phaser js examples โดยตรวจสอบวิธีเปลี่ยนตำแหน่งพาธและสเกลในเบราว์เซอร์ของคุณ

แก้การกระตุกของกล้อง

ตัวแทนใช้ glob เพื่อค้นหาไฟล์ Tilemap และ Sprite ทั้งหมดในโปรเจกต์และอ่านตรรกะการติดตามกล้องในโค้ดฉากด้วย read_file ตรวจสอบ ตัวแทนค้นหาการตั้งค่ากล้องเฉพาะที่ทำให้เกิดเอฟเฟกต์กระตุก ตรวจสอบเอกสาร Phaser ทางการสำหรับตัวเลือกการทำให้เรียบของกล้อง แก้ไขการตั้งค่าการติดตามกล้องในไฟล์ฉากด้วย edit_file แก้ไข Tilemap กระตุกเมื่อกล้องติดตาม Sprite ได้โดยการปรับการตั้งค่าเหล่านี้ รันคำสั่งเซิร์ฟเวอร์ dev เพื่อเริ่มเซิร์ฟเวอร์การพัฒนาในเครื่อง Shell แสดงรหัสการออกจริงของคำสั่งและผู้ใช้ตรวจสอบผลลัพธ์ในเบราว์เซอร์

WebVision Canvas สำหรับ Windows

เริ่มโปรเจกต์ Phaser ของคุณวันนี้

ดาวน์โหลด WebVision Canvas ↗