Mask with opacity

Mask with opacity

How can I have a mask with opacity? I need to make transparent pixels of the Mask Texture affect on transparency of children of that mask. With current Mask component its impossible.
I found the proper configurations for blend modes, but it affects all the layers below, whereas I want it to affect only on children. Any help or suggestion?

I would love this feature. I’ve create forum posts and Github request a long time ago, but no response yet. Let’s keep our thumbs up for this :slight_smile:

1 Like

@jare @slackmoehrle
I want to know if in the future creator will take into consideration the transparency of a mask texture or I should try to find a workaround for it. If there is easy way to achieve the result.
Currently I check the render-engine.js and see that in fragment of the template shaders for sprite and spine are checking the alphaThreshold and only discarding it

#ifdef useTexture
    o *= texture2D(texture, uv0);
  #ifdef alphaTest
    if (o.a <= alphaThreshold)
  gl_FragColor = o;

I suppose if we multiply the alpha of stencil with the fragColor before checking the threshold or having another parameter (apply alpha of mask)in cc.Mask for that reason and update those shaders, that would work great. I dont have a background of webgl and don’t know how to properly fix this. Any help is appreciated, thanks

1 Like

I will defer to @jare for this or perhaps @Big_Bear may know

Can you select a transparent texture and set alpha threshold to 0.01?

0.01 is imposible, only 0.1 and I didn’t understand why are you asking this? Alpha threshold only decides which pixel to render and which to discard, but we need to apply that alpha of the mask to rendered texture so it becomes transparent

Sorry, I misunderstood the current implement of the renderer.

There is no easy way to do this. Currently Mask does not cull out child nodes in shader, but in gl stencil, which doesn’t support alpha blending. To support alpha blending, we need to inject the blending code into every builtin or custom shaders, and compute screen positions in it.

You can use a render texture to bake the nodes in the mask, and display it in a custom shader.