在 Phaser 3 中对生成的形状使用 .setCollideWorldBounds()

Use .setCollideWorldBounds() on generated shapes in Phaser 3

我正在尝试制作一个简单的 pong 克隆来学习 Phaser 3 框架。

但是,我似乎无法在我用于桨的一些生成的矩形上调用 .setCollideWorldBounds() 函数。

这是我的一些代码

function create() {

    gameState.playerPaddle = this.add.rectangle(50, 400, 50, 200, 0x000000);
    gameState.compPaddle = this.add.rectangle(950, 400, 50, 200, 0x000000);

    gameState.cursors = this.input.keyboard.createCursorKeys();

    // makes paddles interactive
    gameState.playerPaddle.setInteractive();
    gameState.compPaddle.setInteractive();

    // Should stop the shapes from leaving the screen but doesn't
    gameState.compPaddle.setCollideWorldBounds(true);
    gameState.playerPaddle.setCollideWorldBounds(true);

};

function update() {
    if (gameState.cursors.down.isDown){
        gameState.playerPaddle.y += 10; 
    }
    if (gameState.cursors.up.isDown) {
        gameState.playerPaddle.y -= 10;
    }
};

这会引发

TypeError: gameState.compPaddle.setCollideWorldBounds is not a function

我想这是因为我使用的是形状而不是精灵,但是有什么方法可以在 Phaser 生成的形状上具有类似的功能吗?我在文档中找不到任何内容。

原来我忘了在我的配置中添加物理对象。

示例:

physics: {
    default: 'arcade',
    arcade: {
      gravity: { y: 200 },
      enableBody: true,
    }
}