Mask Motion best approach

Cocos Creator
#1

Hi,

As far as I know Mask-s in cocos creator are a parent node with a Mask component, which is actual mask of all children of that node. I have an example with filling up a progress bar and it’s not convenient for me to handle motions of mask, because all children are moving with the parent (mask). So the question is

  • Is there a better approach of working with Masks?

It would be great if one node with Mask component could be a Mask target of another Sprite Node
@slackmoehrle

#2

@jare can give us an answer.

#3

v2.0.4

1.Create a couple of containers with Mask component and a renderer(sprite or spine) child node for each one and make sure the renderers overlap each other with disabled masks.
2.Dynamically increase the scale of all Nodes and the rendering of the objects will be messed up. Renderers with higher z index are rendered on other objects (through their masks) ignoring their own mask bounds.

I can provide a test project if its necessary. @jare

#4

Thanks @Khachatur,

Sorry, no…

The mask rendering issue was fixed in 2.0.5 beta. Please can try http://download.cocos.com/CocosCreator/beta/CocosCreator_v2.0.5-rc.2_20181030_mac.dmg http://download.cocos.com/CocosCreator/beta/CocosCreator_v2.0.5-rc.2_20181030_win.7z

#5

@jare The bug is not fixed, I can send you a small test project where you can reproduce it straightforward.

#6

Please attach a small test project, thanks! @Khachatur

#7

@jare @huanxinyin @slackmoehrle
1.How to attach a project here?
2.How to start contributing on Cocos engine development? ( I would like to participate the process if it is possible)

#8
  1. It looks like you should upload to somewhere else.
  2. You can create pull requests to the engine https://github.com/cocos-creator/engine
#10

What type of compressed file are you using? I’ll add it as an allowed file type. Also how large is the compressed file you want to upload. I need to check the max file size.

#11

Drag the attachment into the editor，like *.zip archive, it will auto upload. Attention max file size limit！

#12

MaskIssue.zip (535.2 KB)
Sorry for late response. This is the simplest project which reproduces the issue 100%.
-Play the Preview with landscape screen, after rotate to portrait and back. Everything works cool and correct because we were scaling down the masks.

-Play the preview in Portrait mode first. After rotate to landscape and back. In landscape mode the rendering of masks is messed up, because pictures with higher zIndex are ignoring their mask boundaries and are rendered through other node’s masks. The issue happens when we scale up the masks

This is really critical issue for me @jare @huanxinyin so if it is possible I would like to know if this issue has a high priority to fix or I have to find a workaround?

This issue was NOT happening with v1.9.3 . So after v2 the issue arrived.

#13

What platform was you tested for? I can find this happened on web browser.
Above the plan, if you are urgent on this discuss, you can try to find a workaround.

#14

Web platform, im making my game only for web. OK

#15

For now I remove the mask component and add another mask component with the same width and height at view resize and it works. Would you suggest any better solution?

#16

There are no other better suggestions at the moment.