Phaser3入门教程：第一个Phaser3游戏（中文版）（九）

• 记分牌

 

游戏还有两个要点需完成：会干掉玩家的敌人，以及显示玩家抓到星星的分数牌子。我们先来完成记分牌。

我们需要制作一个文本对象。为此，我们创建了两个变量，一个用来计分，另一个是分数的文本内容：

var score = 0; var scoreText;

scoreText在create函数中设置：

scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });

16,16是文本显示的坐标。‘score:0’是初始显示的内容，后面的对象定义了文字的大小和颜色。这里不设置字体，我们使用Phaser默认的Courier字体。

下一步我们要修改collectStar函数，让玩家在抓到星星后加分，并显示实时的分数。代码更新如下：

function collectStar (player, star) {     star.disableBody(true, true);       score += 10;     scoreText.setText('Score: ' + score); }

每拿到一个星星会加10分，并更新记分牌scoreText的内容。运行part9.html可看到计分效果：

在最后一节，我们还会加入敌人的部分。