Alpha masks disable additive blending mode

It appears that applying an alpha mask to a Pixi object will disable the additive blending mode.

var imageEntity = new PIXI.Sprite(this.imageTexture);
imageEntity.blendMode = PIXI.BLEND_MODES.ADD;

var mask = new PIXI.Sprite(this.maskTexture);
imageEntity.addChild(mask);
imageEntity.mask = mask;

stage.addChild(imageEntity);

I seem to remember this having been reported in the past but was unable to find it.

We are using Pixi V.4.0.0.

[ivanpopelyshev]

You are already at the point where docs are useless, you have to clone the repo.

https://github.com/pixijs/pixi.js/blob/dev/src/core/renderers/webgl/filters/spriteMask/SpriteMaskFilter.js

Assume we have alphaSprite and mySprite

var spriteMaskFilter = new PIXI.filters.SpriteMaskFilter();
spriteMaskFilter.glShaderKey = 'uniqueMaskKey'; // ask filterManager to cache filter shader, handy if you use many of them

spriteMaskFilter.sprite = alphaSprite;
alphaSprite.renderable = false;

mySprite.filters = [spriteMaskFilter];

[chesovnik]

Maybe, I have the same problem. If I create mask from Graphics and apply it to Graphics it works fine. If I apply blend mode to these Graphics everything is okey too. But if I apply blend mode and then make mask — blend mode doesn’t work.

let overlay = new Graphics(); overlay.lineStyle(5,0xFF3300,1); overlay.beginFill(0x66CCFF); overlay.drawRect(window.innerWidth / 2, 0, window.innerWidth / 2, window.innerHeight); overlay.endFill();

let rectangle = new Graphics(); rectangle.lineStyle(5,0xFF3300,1); rectangle.drawRect(window.innerWidth / 3, window.innerHeight / 3, 500, 500);

overlay.blendMode = PIXI.BLEND_MODES.MULTIPLY; overlay.mask = rectangle; app.stage.addChild(overlay); app.stage.addChild(rectangle);

PixiJS 4.7.3 - ✰ WebGL ✰