使用Phaser在游戏画布上显示绿色正方形

Question

有人能告诉我为什么我的Phaser游戏画布上会出现下面这个绿色方块吗？

- Richard Ansell

Answer 1

我可以告诉你，当Phaser框架无法加载图像时，您将看到此情况，而不需要查看任何代码。

在所选浏览器中打开开发者工具并打开网络选项卡后进行刷新。您应该会看到其中一个图像的404错误。

我认为，如果您查看标准浏览器控制台，您还可以看到有关未能加载资产名称的消息。

- James Skemp

---

好的，我认为问题可能出在这行代码上，因为我假设我需要设置飞船的起始位置：this.play = game.add.sprite(200, 245, 'play'); // 在x = 10和y = 245的位置显示飞船。控制台中显示：Phaser.Cache.getImage：键“play”在缓存中未找到。 - Richard Ansell

这意味着你没有使用关键字 play 加载任何内容。你应该在预加载中加入类似于 game.load.image('play', 'assets/play.png'); 的代码，就像你在加载太空飞船和小行星时所做的那样。 - James Skemp

谢谢你的回复 - 我在使用Phaser方面还是个新手，仍在学习中！ - Richard Ansell

很高兴能够帮忙。祝你在Phaser上好运；它是一个非常不错的框架 :) - James Skemp

Answer 2

我有一个略微不同的情况。图像在 init 函数中被加载，但显然这种方法不起作用。我将该函数重命名为 preload，然后绿色方块消失了，图像出现了。

- ubershmekel

Answer 3

我的情况也有些不同; 所有图像资源都加载了，但我认为我试图创建精灵的速度有点太快了 - 换句话说，在场景正确加载之前，我正在尝试创建和添加精灵到我的场景中。

我要尝试等待 'scene.scene.isActive(key);' 返回 true 的布尔值.....也许这就是解决我的问题的方法。如果失败，我可能会放入一些等待/等待 1 秒钟或其他时间的 promise（并不理想，但可能有效）

注意：我能够太快地创建精灵的部分原因是因为我是在自己的自定义函数中这样做的，而不是在典型的 create() 函数中。实际上，最好的解决方案可能是在 create() 函数中创建精灵而不是在自定义函数中...

- Jeff Moretti