Particle Emitter Start and End Properties

This example demonstrates how to animate particle properties over their lifespan by defining start and end values, including the use of easing functions for movement and scale.

Particle Emitter Start and End Properties, running
800 × 600
GitHub
class Example extends Phaser.Scene
{
    preload ()
    {
        this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
        this.load.image('bg', 'assets/tweens/sky.png');
        this.load.atlas('match3', 'assets/atlas/match3.png', 'assets/atlas/match3.json');
    }

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

        this.add.particles(0, 0, 'match3', {
            frame: 'Match3_Icon_04',
            scale: { start: 0.3, end: 0 },
            x: { min: 100, max: 700 },
            y: { start: 100, end: 500, ease: 'bounce.out' },
            lifespan: 2000
        });
    }
}

const config = {
    scale: { mode: Phaser.Scale.FIT },
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    backgroundColor: '#000',
    parent: 'game-container',
    scene: Example
};

const game = new Phaser.Game(config);

More in Particle Emitter44 examples