Adding glow by stacking phaser shapes?

Phaser 3
1

Certain graphics in my game are simple phaser shapes. For the shapes, to add more depth I want to give each one a glow, like a scaled-up version of the shape but behind it and slightly transparent.

This is an example function of how I generate circles:

    _genCircle(x, y, fillColor) {
    let cir = this.level.add.circle(x, y, 55, fillColor);
    // let glow = this.level.add.circle(x, y, 60, 0xFFFFFF);
    cir.setStrokeStyle(3, 0xFFFFFF);
    return cir;
}

These functions return full, single circles. Is there a solution to also give it a glow? If not, what is another way of going about it? I don’t want to draw sprites for all the shapes I want to have a glow, but is that the only way?

2

Just create another circle as you describe (scaled up version with a lower alpha). If by glow you mean you need it blurred as well, you would need to create texture assets or use a shader.

1 Like