javascript - 如何让 Phaser 游戏自动填满窗口？

Question

如何让 Phaser 游戏自动填满浏览器窗口？ (理想情况下，如果窗口大小发生变化，则自动重新填充。)我知道有一个 ScaleManager class。但文档不清楚如何使用它。我还找到了 other instructions但他们没有指出在哪里添加他们建议的代码，并且在创建 Game 类后立即运行它似乎没有做任何事情。

我目前正在使用找到的基本代码 in this tutorial ，但我愿意彻底改变这一点。

Answer 1

事实证明非常简单，您只需要在预加载或创建函数中运行此代码(而不是像我一直在尝试的那样在创建游戏实例后立即运行)。

this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
//this.scale.pageAlignHorizontally = true;
this.scale.pageAlignVertically = true;
this.scale.setScreenSize( true );

请注意，如果您让游戏全屏显示，将 this.scale.pageAlignHorizo​​ntally 设置为 true 实际上会弄乱水平对齐方式。相反，您可以使用 css 将 Canvas 居中:

canvas { margin: 0 auto; }