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>