Phaser 3 创建带有分秒的游戏时钟

Question

我正在使用 Phaser 3.24.1 开发一款游戏，想创建一个游戏时钟。时钟应设置在 00:00 或零分零秒，并在比赛开始时开始计时。我希望游戏在时钟到达 99:99 或恰好 1 小时 40 分钟时停止。我可以使用以下代码创建一个从零开始的简单计时器：

timedEvent = this.time.addEvent({ delay: 6000000, callback: this.onClockEvent, callbackScope: this, repeat: 1 }); 
text.setText('Game Clock: ' + timedEvent.getElapsedSeconds().toString().substr(0, 4));

此代码将创建一个计时器事件并获取经过的时间（以秒为单位）。我想要的是时钟显示分钟和秒。我该怎么做？

Answer 1

如果 getElapsedSeconds() 提供了秒数，您只需要做一些数学运算就可以得到分钟数：

let elapsedTime = timedEvent.getElapsedSeconds();
let minutes = Math.floor(elapsedTime / (minutes * 60));
let seconds = Math.floor(time - minutes);

您现在可以提取分钟和秒，确保在秒小于 10 时添加 '0'。

但是，如果您运行这样做，您将永远不会在冒号后看到大于“59”的数字，因为您要显示分钟和秒。

let elapsedTime = 72.99;
let minutes = Math.floor(elapsedTime / 60);
let seconds = Math.floor(elapsedTime - (minutes * 60));
document.getElementById('result').innerText = minutes + ':' + seconds;

<div id="result"></div>

所以您可能想要的只是显示秒数：

let elapsedTime = 172.99;
// You could deal with adding zeros, or just add a number to the seconds, and then skip it when you pull it for display.
let displayTime = (10000 + elapsedTime).toString().substr(1, 4);
document.getElementById('result').innerText = displayTime.substr(0, 2) + ':' + displayTime.substr(2, 2);

<div id="result"></div>

Phaser 3 创建带有分秒的游戏时钟

Phaser 3 Create A Game Clock With Minutes And Seconds

javascript

phaser-framework