diff --git a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js index 91697b7..6d1787b 100644 --- a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js +++ b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js @@ -52,6 +52,7 @@ } tex.transform.update(); + this.uniforms.npmAlpha = tex.baseTexture.premultiplyAlpha ? 0.0 : 1.0; this.uniforms.mask = tex; this.uniforms.otherMatrix = filterManager.calculateSpriteMatrix(this.maskMatrix, maskSprite) .prepend(tex.transform.mapCoord); diff --git a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js index 91697b7..6d1787b 100644 --- a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js +++ b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js @@ -52,6 +52,7 @@ } tex.transform.update(); + this.uniforms.npmAlpha = tex.baseTexture.premultiplyAlpha ? 0.0 : 1.0; this.uniforms.mask = tex; this.uniforms.otherMatrix = filterManager.calculateSpriteMatrix(this.maskMatrix, maskSprite) .prepend(tex.transform.mapCoord); diff --git a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag index 0e4aef8..40c1549 100644 --- a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag +++ b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag @@ -4,6 +4,7 @@ uniform sampler2D uSampler; uniform sampler2D mask; uniform float alpha; +uniform float npmAlpha; uniform vec4 maskClamp; void main(void) @@ -16,8 +17,9 @@ vec4 original = texture2D(uSampler, vTextureCoord); vec4 masky = texture2D(mask, vMaskCoord); + float alphaMul = 1.0 - npmAlpha * (1.0 - masky.a); - original *= (masky.r * masky.a * alpha * clip); + original *= (alphaMul * masky.r * alpha * clip); gl_FragColor = original; } diff --git a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js index 91697b7..6d1787b 100644 --- a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js +++ b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js @@ -52,6 +52,7 @@ } tex.transform.update(); + this.uniforms.npmAlpha = tex.baseTexture.premultiplyAlpha ? 0.0 : 1.0; this.uniforms.mask = tex; this.uniforms.otherMatrix = filterManager.calculateSpriteMatrix(this.maskMatrix, maskSprite) .prepend(tex.transform.mapCoord); diff --git a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag index 0e4aef8..40c1549 100644 --- a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag +++ b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag @@ -4,6 +4,7 @@ uniform sampler2D uSampler; uniform sampler2D mask; uniform float alpha; +uniform float npmAlpha; uniform vec4 maskClamp; void main(void) @@ -16,8 +17,9 @@ vec4 original = texture2D(uSampler, vTextureCoord); vec4 masky = texture2D(mask, vMaskCoord); + float alphaMul = 1.0 - npmAlpha * (1.0 - masky.a); - original *= (masky.r * masky.a * alpha * clip); + original *= (alphaMul * masky.r * alpha * clip); gl_FragColor = original; } diff --git a/packages/core/src/mask/MaskSystem.js b/packages/core/src/mask/MaskSystem.js index 99174c2..ae563f8 100644 --- a/packages/core/src/mask/MaskSystem.js +++ b/packages/core/src/mask/MaskSystem.js @@ -113,7 +113,7 @@ // TODO - may cause issues! target.filterArea = maskData.getBounds(true); - this.renderer.filterSystem.pushFilter(target, alphaMaskFilter); + this.renderer.filter.push(target, alphaMaskFilter); this.alphaMaskIndex++; } @@ -124,7 +124,7 @@ */ popSpriteMask() { - this.renderer.filterSystem.popFilter(); + this.renderer.filter.pop(); this.alphaMaskIndex--; } diff --git a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js index 91697b7..6d1787b 100644 --- a/packages/core/src/filters/spriteMask/SpriteMaskFilter.js +++ b/packages/core/src/filters/spriteMask/SpriteMaskFilter.js @@ -52,6 +52,7 @@ } tex.transform.update(); + this.uniforms.npmAlpha = tex.baseTexture.premultiplyAlpha ? 0.0 : 1.0; this.uniforms.mask = tex; this.uniforms.otherMatrix = filterManager.calculateSpriteMatrix(this.maskMatrix, maskSprite) .prepend(tex.transform.mapCoord); diff --git a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag index 0e4aef8..40c1549 100644 --- a/packages/core/src/filters/spriteMask/spriteMaskFilter.frag +++ b/packages/core/src/filters/spriteMask/spriteMaskFilter.frag @@ -4,6 +4,7 @@ uniform sampler2D uSampler; uniform sampler2D mask; uniform float alpha; +uniform float npmAlpha; uniform vec4 maskClamp; void main(void) @@ -16,8 +17,9 @@ vec4 original = texture2D(uSampler, vTextureCoord); vec4 masky = texture2D(mask, vMaskCoord); + float alphaMul = 1.0 - npmAlpha * (1.0 - masky.a); - original *= (masky.r * masky.a * alpha * clip); + original *= (alphaMul * masky.r * alpha * clip); gl_FragColor = original; } diff --git a/packages/core/src/mask/MaskSystem.js b/packages/core/src/mask/MaskSystem.js index 99174c2..ae563f8 100644 --- a/packages/core/src/mask/MaskSystem.js +++ b/packages/core/src/mask/MaskSystem.js @@ -113,7 +113,7 @@ // TODO - may cause issues! target.filterArea = maskData.getBounds(true); - this.renderer.filterSystem.pushFilter(target, alphaMaskFilter); + this.renderer.filter.push(target, alphaMaskFilter); this.alphaMaskIndex++; } @@ -124,7 +124,7 @@ */ popSpriteMask() { - this.renderer.filterSystem.popFilter(); + this.renderer.filter.pop(); this.alphaMaskIndex--; } diff --git a/packages/display/src/DisplayObject.js b/packages/display/src/DisplayObject.js index 7f45a81..ef4f0d7 100644 --- a/packages/display/src/DisplayObject.js +++ b/packages/display/src/DisplayObject.js @@ -582,6 +582,8 @@ * PIXI.Graphics or a PIXI.Sprite object. This allows for much faster masking in canvas as it * utilises shape clipping. To remove a mask, set this property to null. * + * For sprite mask both alpha and red channel are used. Black mask is the same as transparent mask. + * * @todo For the moment, PIXI.CanvasRenderer doesn't support PIXI.Sprite as mask. * * @member {PIXI.Graphics|PIXI.Sprite}