Jump to content

PIXI.Container as mask


mcfly
 Share

Recommended Posts

Hi all. As you see my question is related to masking. Have you ever used PIXI.Container with a PIXI.Graphics child to mask PIXI.DisplayObject?

I.e. Pixi.DisplayObject.mask = PIXI.Container

I've noticed this approach in a project I'm inheriting. I've tested it and works as expected. However this is a bit strange technique for me as I've never seen this before.

Do you foresee any issues with that (i.e. any browser related issues etc.)?

Thank you for your time.

Link to comment
Share on other sites

Yeah, that's only for graphics masks, implemented through stencil.  It just renders all elements inside mask container to stencil.

Sprite masks (alpha-masks) cant work like that, it will require extra framebuffer operations. After recent mask refactoring its possible to implement it but we just dont have time :)

Link to comment
Share on other sites

Hi Ivan, thank you for your reply.

In my case I have only graphics in my container that is used as a mask.

But am I correct by assuming that approach is not supported by PIXI.CanvasRenderer or I'm missing something?

Thank you again.

Link to comment
Share on other sites

I have a special magic way to determine that: I look in sources.

https://github.com/pixijs/pixi.js/blob/c513e9287112ff8ed3f0326f700b731c204550b9/packages/canvas/canvas-renderer/src/utils/CanvasMaskManager.ts#L48

Here's recursive container walker, so it should support such mask.

Edited by ivan.popelyshev
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...