Group World Bounds Event

Demonstrates how to listen for collision events when objects hit the edge of the physics world. This example enables 'onWorldBounds' for a group of sprites and uses a global listener to change their frame upon impact.

800 × 600

GitHub

class Example extends Phaser.Scene
{
    preload ()
    {
        this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
        this.load.image('bg', 'assets/skies/space2.png');
        this.load.spritesheet('ball', 'assets/sprites/balls.png', { frameWidth: 17, frameHeight: 17 });
    }

    create ()
    {
        this.add.image(400, 300, 'bg');

        const balls = this.physics.add.group({
            key: 'ball',
            frameQuantity: 48,
            bounceX: 1,
            bounceY: 1,
            collideWorldBounds: true,
            velocityX: 200,
            velocityY: 150
        });

        Phaser.Actions.RandomRectangle(balls.getChildren(), this.physics.world.bounds);

        for (const ball of balls.getChildren())
        {
            ball.body.onWorldBounds = true;
        }

        this.physics.world.on('worldbounds', (body) =>
        {
            const ball = body.gameObject;

            ball.setFrame((ball.frame.name + 1) % 5);
        });
    }
}

const config = {
    scale: { mode: Phaser.Scale.FIT },
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    parent: 'game-container',
    physics: {
        default: 'arcade',
        arcade: {
            debug: false,
            gravity: {
                y: 200
            }
        }
    },
    scene: Example
};

const game = new Phaser.Game(config);

More in Arcade132 examples

Immovable Arcade Physics BodyDemonstrates how an immovable body remains unaffected by collisions with other objects while still being able to move via its own velocity.

Interpolate VelocityUse linear interpolation (lerp) on Arcade Physics velocities to create a smooth follow-the-leader movement effect among a group of sprites.

Interpolate Velocity Towards TargetDemonstrates how to move an Arcade Physics body toward a target and use velocity interpolation to smoothly decelerate as it arrives.

Larger Bounding BoxShows how to increase an Arcade Physics body size beyond the sprite's texture dimensions and center the body on the object.