Particle Bring To Top
Demonstrates how to toggle whether newly emitted particles are rendered on top of or behind older particles using the particleBringToTop property.
800 × 600
class Example extends Phaser.Scene
{
preload ()
{
this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
this.load.atlas('blocks', 'assets/sprites/blocks.png', 'assets/sprites/blocks.json');
}
create ()
{
const emitter = this.add.particles(100, 300, 'blocks', {
frame: 'redmonster',
lifespan: 5000,
angle: { min: -30, max: 30 },
speed: 150,
frequency: 200
});
const text = this.add.text(10, 10, 'Click to change. bringToTop: true');
this.input.on('pointerdown', () => {
if (emitter.particleBringToTop)
{
emitter.particleBringToTop = false;
}
else
{
emitter.particleBringToTop = true;
}
text.setText(`Click to change. bringToTop: ${emitter.particleBringToTop}`);
});
}
}
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);