_ok

GeometryMask: Children(sprites) of a container displayed inside a zone

Recommended Posts

I am trying to get all the children of a container displayed inside a zone.

    var container = this.add.container(200, 200);
    var sprite0 = this.add.sprite(0, 0, 'box');
    var sprite1 = this.add.sprite(0, 100, 'box');
    container.add([ sprite0, sprite1 ]);
    
    var graphics = this.add.graphics();
    var color = 0x00ffff;
    var thickness = 2;
    var alpha = 1;
    graphics.lineStyle(thickness, color, alpha);
    graphics.strokeRect(32, 32, 256, 256);
    graphics.fillStyle(color, 0);
    graphics.fillRect(32, 32, 256, 256);
    container.mask = new Phaser.Display.Masks.GeometryMask(this, graphics);

However when they are outside and overlapping is seems like they are blending on each other? How should I proceed?

children outside container overlap.png

Share this post


Link to post
Share on other sites

We figured out in discord that this definitely seems to be a bug in container masking; full repro case at https://jsfiddle.net/jdotrjs/59tc3gbu/

will try to update this thread when we get around to filing a bug on it

Share this post


Link to post
Share on other sites

Container's don't support nested masks. Not sure if this is what you are trying to do, but if so it isn't really a "bug".

https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.Container.html

Quote

Containers can have masks set on them and can be used as a mask too. However, Container children cannot be masked. The masks do not 'stack up'. Only a Container on the root of the display list will use its mask.

 

Share this post


Link to post
Share on other sites
28 minutes ago, snowbillr said:

Container's don't support nested masks. Not sure if this is what you are trying to do, but if so it isn't really a "bug".

https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.Container.html

 

In other words I've to set each children in that container to have that mask?

 

I've submitted an issue regardless:

https://github.com/photonstorm/phaser/issues/3746

Share this post


Link to post
Share on other sites

So my reading 

36 minutes ago, snowbillr said:

Container's don't support nested masks. Not sure if this is what you are trying to do, but if so it isn't really a "bug".

https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.Container.html

Quote

Containers can have masks set on them and can be used as a mask too. However, Container children cannot be masked. The masks do not 'stack up'. Only a Container on the root of the display list will use its mask.

Yea, I saw that as well. My reading was that you should be applying a mask to the container for all children instead of attempting to stack the container mask with a child mask and expecting a union of the two masks to be applied or something similar.

In any case there is no nested masking going on -- there is a single mask being applied to a container which (based on docs) I would expect to be used to determine which of it's children should be visible. Even if that isn't the case the existing behavior of displaying the children objects only when intersected seems weird and wrong:

Container with no mask: https://imgur.com/a/qAKnWM6

vs with a mask applied (as defined by the cyan rectangle): https://imgur.com/a/mk76UTa

In fact if you swap from a Geometry to a Bitmap mask it works as I would expect: https://imgur.com/a/KXIfTYJ (code at https://jsfiddle.net/jdotrjs/59tc3gbu/4/)

 

Still think it's a bug; now just with the stencil test for the geometry mask, but if not would be interested to see doc updates to make expected behavior more clear.

Share this post


Link to post
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...

  • Recently Browsing   0 members

    No registered users viewing this page.