Question

这似乎是一个简单的问题，但我无法解决它：

我正在将Phaser.io 3 HTML5游戏框架与ES6类一起使用，并尝试找出实际的“游戏大小”（或画布/视口大小），以便可以将对象放在屏幕上居中：

class Scene1 extends Phaser.Scene {
    constructor(config) {
        super(config);
    }

    preload() {
        this.load.image('ship', 'assets/spaceship3.png');
    }

    create() {

        let ship = this.add.sprite(160,125, 'ship');
        // Here I need to figure out the screen width / height:
        // ---> How do I achieve that?
        ship.setPosition(width / 2, height / 2);
    }
}

我找不到读取或计算实际视口/画布大小的方法。有提示吗？

Answer 1

在场景中，可以使用preload()访问create()和this.sys.game.canvas方法（构造函数中为 not ）。因此，要获得画布大小，可以执行以下操作：

create() {
    let { width, height } = this.sys.game.canvas;
}

就我而言，我想添加以下代码来简化对画布的访问：

preload() {
    this.canvas = this.sys.game.canvas;
}

Answer 2

您可以使用默认相机：

ship.setPosition(this.cameras.main.centerX, this.cameras.main.centerY);

来自the Phaser 3 API Documentation on Camera：

默认情况下，相机的创建尺寸与您的游戏相同，但是可以将其位置和尺寸设置为任意值。

Answer 3

以下方法应该起作用：

scene.sys.game.scale.gameSize

Phaser.io 3：获取场景中的游戏大小

3 个答案: