如何获取 Phaser 3 中加载过程的百分比信息？

Question

我正在尝试为我的移相器游戏添加一个加载动画，这里是模拟加载过程的代码

this.load.spritesheet('brawler', 'assets/animations/brawler48x48.png', {
  frameWidth: 48,
  frameHeight: 48
});
this.load.audio('goldrunner', 'assets/audio/Scyphe-Goldrunner_(Maccie_Pimp_Me Up_Remix).mp3');
this.load.image('taikodrummaster', 'assets/pics/taikodrummaster.jpg');
this.load.image('sukasuka-chtholly', 'assets/pics/sukasuka-chtholly.png');
this.load.video('chrome', 'assets/video/chrome.webm');

共有 5 个资产。

我知道我可以使用 this.load.on('complete', function() {}) 之类的东西来检查整个加载过程是否完成。

我只想知道如何获取加载过程的百分比信息，以提示玩家游戏加载资产需要多长时间。

类似于以下内容

Answer 1

可以使用事件progress，这里是link到phaser documentation

只需在场景的 preload 方法中添加一行：

this.load.on('progress', function (progress) {
    // progress is a value between 0 and 1
    let percentage = parseInt(progress * 100);
    // Set here the label with the precentage
    ...
});

Extra: If you want to track the progress of the file itself you could use the event fileprogress. The callback of that specific event returns two parameters, on the file loaded and one with the percentage of the file that has been loaded.
If you want a more fine grade result / information.

如何获取 Phaser 3 中加载过程的百分比信息？

How do I get the percentage info of the loading process in Phaser 3?

javascript

phaser-framework