Mask for mask

[ashenemy]

Hello,
Can I use a mask for a mask?

That is, I have a mask that interacts with the sprite
I would like to use another mask that would cut the mask itself, which will already cut the sprite already
 

 

[ivan.popelyshev]

Learn how to use RenderTexture and then use SpriteMaskFilter with a texture that is combined from to others.

[ashenemy]

21 hours ago, ivan.popelyshev said:

Learn how to use RenderTexture and then use SpriteMaskFilter with a texture that is combined from to others.

Thanks for your reply
I tried, but I did not succeed, you can tell me where I'm wrong
I give an approximate code

var objectTexture = new PIXI.Texture.fromCanvas(canvas);
var objectSprite = new PIXI.Sprite(objectTexture);

var maskTexture = new PIXI.Texture.fromCanvas(canvas);
var maskSprite =  new PIXI.Sprite(maskTexture);

var maskForMaskTexture = new PIXI.Texture.fromCanvas(canvas);
var maskForMaskSprite =  new PIXI.Sprite(maskForMaskTexture);

baseContainer.addChild(maskForMaskSprite);

var renderMaskTexture = new PIXI.RenderTexture(new PIXI.BaseRenderTexture(maskSprite.width, maskSprite.height));

var renderMaskSprite = new PIXI.Sprite(renderMaskTexture);
renderMaskSprite.filters = [ new PIXI.SpriteMaskFilter(maskForMaskSprite) ] 

app.render(renderMaskSprite, renderMaskTexture);

baseContainer.addChild(renderMaskSprite);

var maskFilters = new PIXI.SpriteMaskFilter(renderMaskSprite);
objectSprite.filters = [maskFilters];

baseContainer.addChild(objectSprite);

 

[ivan.popelyshev]

Actually, what if we just apply two SpriteMaskFilters to one container?

var container = new PIXI.Container();
var mask1 = new PIXI.Sprite(tex1);
var mask2 = new PIXI.Sprite(tex2);

mask1.renderable = false;
container.addChild(mask1);
mask2.renderable = false;
container.addChild(mask2);

container.filters = [ new PIXI.SpriteMaskFilter(mask1), new SpriteMaskFilter(mask2) ];

Or make a structure of two containers inside each other with these two masks?

Are you sure that "mask of a mask" doesn't mean "apply two masks"?

I'm too lazy right now to debug that renderTexture approach

[ashenemy]

10 minutes ago, ivan.popelyshev said:

Actually, what if we just apply two SpriteMaskFilters to one container?

var container = new PIXI.Container();
var mask1 = new PIXI.Sprite(tex1);
var mask2 = new PIXI.Sprite(tex2);

mask1.renderable = false;
container.addChild(mask1);
mask2.renderable = false;
container.addChild(mask2);

container.filters = [ new PIXI.SpriteMaskFilter(mask1), new SpriteMaskFilter(mask2) ];

Or make a structure of two containers inside each other with these two masks?

Are you sure that "mask of a mask" doesn't mean "apply two masks"?

I'm too lazy right now to debug that renderTexture approach

thanks for the answer
first need to apply the mask to the mask itself, then what happened, apply to the sprite

[ivan.popelyshev]

You sure its not the same as two masks on sprite? Its kinda multiplication of colors.