Use .setCollideWorldBounds() on generated shapes in Phaser 3

user_11848187 0
Viewed 805

I am trying to make a simple pong clone to learn the Phaser 3 framework.

However, I cannot seem to call the .setCollideWorldBounds() function on some generated rectangles I am using for paddles.

Here is some of my code

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;
    }
};

This throws

TypeError: gameState.compPaddle.setCollideWorldBounds is not a function

I assume this is because I am using a shape instead of a sprite, but is there any way to have a similar functionality on a Phaser generated shape? I couldn't find anything in the docs.

phaser-framework javascript
1 Answers

Turns out I forgot to add the physics object in my config.

Example:

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