[PIXIJS] Pixi-Particles - White mask change blendMode to ADD

[Saqirm]

Hello pixijs users & devs

 

I encounter an issue using PIXI-Particles. For some reason my ParticleContainer changes blendMode for all particles if one of the particle is using MASK_0 (White mask taken from PIXI-Particle editor) 

1. screen particles looks like BlendMode = BLEND_MODE.ADD, (explosion particle is causing it).

 

    public particleContainer: ParticleContainer = new ParticleContainer(2500, {
        position: true,
        vertices: true,
        uvs: true,
        tint: true
    });
...
 Constructor: ...
 		this.container = SceneManager.scene.particleNormals;

        this.emitter = this._createEffect(json.data, img);

    private _createEffect(json: EmitterConfig, image: any[]): any {
        const emitter: Emitter  = new Emitter(
            this.container,
            image,
            json
        );

        // Start emitting
        emitter.emit = true;
        return emitter;
    }

Both JSONs have setted blendMode to NORMAL. This behaviour happens only if i use particleContainer (normal container works as expected)

 MASK_0

        MASK_1

Edited May 18, 2021 by Saqirm

[ivan.popelyshev]

ParticleContainer has two limitations:

1. all sprites need to have same texture

2. all sprites have common blendMode

Edited May 18, 2021 by ivan.popelyshev

[ivan.popelyshev]

Theoretically, its possible to modify ParticleContainer/ParticleRenderer that way it uploads zero-alpha for blendMode ADD, that way it can be emulated through NORMAL. Do you want to try it ?

[Saqirm]

6 minutes ago, ivan.popelyshev said:

ParticleContainer has two limitations:

1. all sprites need to have same texture

2. all sprites have common blendMode

Yeah it is using 2 masks so probably one mask override the second one in particle container, this is why that particles looks different for a time. So this is probably not BlendMode issue. It explains the issue. Thanks.

 

Is there a workaround to allow multiple textures? I am using same ParticleContainer which is grouping all particles / emitters in game. Particles could have own mask or multiple masks. 

 

5 minutes ago, ivan.popelyshev said:

Theoretically, its possible to modify ParticleContainer/ParticleRenderer that way it uploads zero-alpha for blendMode ADD, that way it can be emulated through NORMAL. Do you want to try it ?

It would be good, because PIXI-Particles supports BlendMode, option for ParticleContainer that allows you to change blend mode would be good. (like new ParticleContainer(2500, {blendMode: true... 

 

ParticleContainer is naturally for lot of sprites / objects to render it fast, best suits for PIXI-particles.

 

 

Edited May 18, 2021 by Saqirm

[ivan.popelyshev]

> Is there a workaround to allow multiple textures?

Nope, no one did multi-texture ParticleRenderer, you can try it but its more heavy task

> It would be good, because PIXI-Particles supports BlendMode

1. dont change blendMode at https://github.com/pixijs/pixi.js/blob/dev/packages/particles/src/ParticleRenderer.ts#L152 , always use normal

2. override this method of ParticleContainer, https://github.com/pixijs/pixi.js/blob/dev/packages/particles/src/ParticleRenderer.ts#L449  , see this "+alpha*255<<24" part? make it zero if sprite blendMode is ADD. 

How to override methods: copy method, do something like "PIXI.ParticleRenderer.prototype.method1 = myMethod"

 

Edited May 18, 2021 by ivan.popelyshev

[Saqirm]

> Nope, no one did multi-texture ParticleRenderer, you can try it but its more heavy task
I could but i have weak experiences in shaders etc.. Learning how rendering works in depth. 

 2. override this method of ParticleContainer, https://github.com/pixijs/pixi.js/blob/dev/packages/particles/src/ParticleRenderer.ts#L449  , see this "+alpha*255<<24" part? make it zero if sprite blendMode is ADD. 

 

I could possibly pass argument inside function which will ask emitter if it has blendMode setted to ADD or NORMAL. 

Edited May 18, 2021 by Saqirm

[Saqirm]

> Nope, no one did multi-texture ParticleRenderer, you can try it but its more heavy task

What approach could be better in term of performance, create particleContainer for each emitter or create normal container which contains all Emitters? 

 

Container -> [ParticleContainers0 -> Emitter, ParticleContainer2 -> Emitter.....]

Container -> [Emitter, Emitter, Emitter ]

[ivan.popelyshev]

maybe  i dont know about performance, honestly. just test it.