• Unity

  • Unity SpriteMask and RectMask2D support

Related Discussions
...

Looks amazing. It's time to change the UI from Mash to RectMask2d. :rock:

8 months later

Hi,
I am trying to achieve the mask effect, but not able to get masking to work. Do you have any sample project or step by step instruction on how to setup the hierarchy in Unity for masking to work?

Regards,
Altaf

I have now added an additional example scene SpriteMask and RectMask2D to the spine-unity unitypackage under Spine Examples/Other Examples.

You can download it here as usual:
Spine Unity Download

Please let us know if it helped you with resolving your problem.

In general: please note that RectMask2D is for UI elements (SkeletonGraphic) and SpriteMask for non-UI elements (SkeletonAnimation and SkeletonMecanim). This is general behaviour in Unity, treating UI elements differently from non-UI elements such as Sprites.

Hello Herald,
The example project helped me achieve what I wanted. Thank you!

Regards,
Altaf

Great to hear, thanks for letting us know!

19 days later

Hi Harald,
I am running into another issue now. We have the spine character on top of ScrollView. Now the clipping isnt working as expected. It works fine if I disable the mask in "Viewport".

I have attached two screenshots one with mask enabled in viewport & another one with mask disabled.

Any suggestions on how to achieve clipping of the spine character & Scrollview clipping.

Regards,
Altaf

Hi Altaf. Which skeleton and mask components are you using? Are you using SkeletonAnimation/SkeletonMecanim and SpriteMask or SkeletonGraphic and RectMask?

Hi Harald,

We are using SkeletonAnimation on the character & SpriteMask for masking.
On SkeletonAnimation mask interaction is set to "Visible outside mask". Visible inside mask doesn't work with Mask on my scroll view.

Unfortunately I still could not reproduce the problem. Could you please send us a minimal reproduction Unity project that still shows the problem as a zip file to contact@esotericsoftware.com? Then we can have a look at what's going wrong there.

Hello Harald,
I have sent you an email with a link to the test project.

Thanks for sending the reproduction project.

The problem is a combination of two things:

  1. You are mixing UI Canvas based components in the hierarchy with non-UI components such as SkeletonAnimation (Sprite would also be a non-UI component). This will cause problems or unintuitive behaviour in combination with the respective masks: SpriteMask is intended for non-UI components, Mask and RectMask for UI components.

  2. Even when the SpriteMask and SkeletonAnimation are correctly placed outside the Canvas hierarchy, the UI Mask of die UI element Viewport still affects sprites and the SkeletonAnimation's renderer. There you need a SortingGroup component on top of both the SpriteMask and all non-UI components (with Order in Layer set to 100 or higher), so that the masks don't interfere with each other. There are some nice examples on how to isolate mask effects on the SpriteMask documentation page.

Another potential solution could also be to have two cameras render the UI elements and the non-UI elements and non-UI-masks separately, but the above solution would be the preferred one.

I have sent you a corrected version of your scene via email.

Hi Harald,
Thanks you for looking into the sample project.

I wanted to keep the spine character under scrollview as we want it to scroll along with other UI elements. Without that we will have to manually handle scrolling

Regards,
Altaf

You just need to create a script that copies the respective Transform.position over to the GameObject outside.