起因：做一个小游戏需要用到毫秒级的计时，画面上也需要在每一帧都更新毫秒级的计时显示，如下图：
screenshot_20200623_145404.png
问题：
1. 使用 schedule 精度不足。
2. 单纯的按update显示帧去刷新，计时的滚动效果又不好。
解决：
- 自己使用setInterval实现一个计时方法，在需要开启计时的场合调用。
// 计时
tick() {
var lastUpdateTime = Date.now();
var elapsedTime = 0;
var updateFrequency = 1; //ms
setInterval(() => {
var currentTime = Date.now();
var deltaTime = currentTime - lastUpdateTime;
elapsedTime += deltaTime;
if (elapsedTime >= updateFrequency) {
elapsedTime -= updateFrequency;
lastUpdateTime = currentTime;
// 更新计时显示
this.updateTimerDisplay(elapsedTime);
}
});
},
- 在计时每次刷新的时刻对画面进行更新。
// 更新计时显示
updateTimerDisplay(elapsedTime) {
// cc.log("elapsedTime = " + elapsedTime);
this.time = elapsedTime;
this.timerLabel.string = this.getFormatTime(this.time);
},
// 获取格式化后的时间
getFormatTime(time) {
// return Math.floor(time * 1000) / 1000 + "\""
return (time / 1000).toFixed(3) + "\""
},
补充：
- 使用 toFixed 方法可以直接在保留小数时补0.
- 由于字体宽度的问题，可以考虑 将显示计时 Label 的Anchor为（0, 0）， Horizontal Align 设为 LEFT。
