/

Phaser: 遊戲迴圈

Phaser: 遊戲迴圈

本文章是 Phaser 系列文章的一部分。點擊這裡查看系列文章的第一篇。

在 Phaser 中，除了 preload() 和 create() 這兩個場景外，我們還有第三個場景，被稱為 update()。

在這裡，一切事情都會發生。

preload() 和 create() 只會執行一次。

update() 會一直被呼叫，成為一個無窮迴圈，直到遊戲結束。

在這個例子中，我們創建了一個文字，它慢慢地移動到畫布的右下角：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
let text

function create() {
 text = this.add.text(100, 100, 'test')
}

function update() {
 text.x += 1
 text.y += 1
}

const game = new Phaser.Game({
 width: 400,
 height: 400,
 scene: {
 create,
 update
 }
})

注意我在頂部添加了 let text，這樣我們可以在 create() 和 update() 中引用它。

在 update() 中，我修改了 x 和 y 屬性。您還可以修改其他屬性，例如可以修改 angle 以旋轉物體：

1
2
3
function update() {
 text.angle += 2
}

您可以使物體從特定的速度開始運動。

調用 setVelocity()，並傳遞一個數字作為 X 軸的速度，另外還可以選擇性地傳遞 Y 軸的速度：

1
text.setVelocity(20, 20)

或者使用 setVelocityX() 和 setVelocityY() 只設置其中一個軸的速度。

tags: [“game development”, “Phaser”, “game loop”, “JavaScript”]