Soft Mask - A replacement of Unity UI Mask with alpha support

Hello! My package Soft Mask has just been published on Asset Store. In this thread I will answer your questions about it and provide support.

What is Soft Mask?

Soft Mask is an UI component that masks child elements. It works in a very similar way to standard Unity’s UI Mask but supports gradients and semi-transparency. Non-intrusive usage is the key feature of Soft Mask. You don't have to assign any materials or shaders to GameObjects nor modify the scene in any other way.

This video shows how to use Soft Mask in Editor:

Features

• Easy to use: just drop it on the Game Object in the same way as Unity's standard Mask.
• Support of Image, RawImage, Sprite or Texture.
• Raycast filtering: a rectangular or per-pixel test of input events.
• Separation of a mask from the masked hierarchy.
  
• Flexible adjustment of mask color channels: black and white images, images with transparency or fine-tuned weights for each color channel.
• Can be easily supported by custom shaders.
• Real-time updates: move, scale, rotate and change the image of the mask in realtime.

Links

Asset Store | WebGL Demo | Documentation​

 

$30? No way.

 

DawidMoza
Thanks for your interest! Sorry that the price isn't acceptable for you. And good luck with your asset!

 

Does it support sprite atlases?

 

Yes, but with some limitations. The mask's sprite can be placed into an atlas, but it should be rectangle packed. Tight meshes aren't supported for the mask. As to masked elements, they can use any sprites you can with regular Unity UI. Also, you can check out the section Limitations in the documentation, which lists all such points.

 

I recently found that there is an old bug in Unity due to which the InputField selection and the caret aren't masked by Mask and Rect Mask 2D. Soft Mask doesn't work in such case too.

The bug attracted me because I have been studying Unity UI code for some time. After some research of how InputField draws the selection and the caret, I've come up with a workaround. It seems that it works, but I'm not 100% sure that is 'production-ready'. The workaround works for Mask, Rect Mask 2D and, of course, Soft Mask

 

hi
in my project,mask not work in my mobile(htc one) correctly
but works correctly in my another devices and editor
i can't find a solution for this...
your asset can help me?
thanks

 

@mahdijj
Hi!
If the issue is related to the stencil buffer then, yes, Soft Mask may help here. But I can't say surely because I don't know what is the cause of the problem.

You can try this demo APK. It's the same demo as I provide on the Asset Store page. It has a toggle to switch between standard Mask and Soft Mask. You can check whether this demo a) has the issue on your device with a standard Mask and b) has no such issue with a Soft Mask.

Anyway, if you purchase Soft Mask and it will not help with your problem, I'll refund you without questions.

Please note that the demo isn't adopted for mobile, for example, there is no convenient way to close it (you should use the task manager), and everything may be too small for a mobile screen.

 

i don't know why , but your demo apk is not installed in my htc one

 

Do you have the option 'Unknown sources' enabled on your device? On my phone, it's located in Settings / Security / Unknown sources. Also, it's possible that new Android versions have other options that block installing of an unknown APKs.

If this doesn't help, I can try to build an APK for the API version of your phone, if you tell me it.

 

api version is 21

 

Ok, here is the demo built in Unity 5.5.1 (the previous one was 5.3.x) and with the minimum API level 21.

 

thanks for your good asset, my problem is solved with your asset.

 

That's great that you solved your problem! And thanks for a good feedback!

 

I'm very pleased to say that version 1.1 has just been submitted to review! This update introduces separated mask mode, significant CPU performance improvement, and several bug fixes. Also, samples have been reworked a bit.

The updated documentation and demo are already available. The updated package should become available soon.

Here are full release notes:

Improvements

• Added the Separate Mask parameter that allows to separate mask from the masked elements. The sample 04-CustomShaders has been reworked to show this feature in use.
• Optimized real-time performance, especially on huge hierarchies. Soft Mask now has almost the same performance cost on CPU as standard Unity Mask (which is very close to zero).
• Improved mapping of Sliced and Tiled masks in the case when the central part is collapsed.
• Reworked samples: they now demonstrate more features of Soft Mask and also look better.

Bug fixes

• Fixed a bug causing Soft Mask to work incorrectly on nested canvases. The partial consequence of this was the inability to use Soft Mask in a standard Dropdown control which uses nested canvas for the drop down list. Now it is possible.
• Fixed a bug preventing Soft Mask from updating after moving it from one canvas to another.
• Fixed a bug preventing rendering of the child elements when a mask used a sprite with one of its borders set to zero in Sliced or Tiled mode.

UPDATE Soft Mask 1.1 is already available on Asset Store.

 

Working on update 1.1, I've found some bugs in Unity. I want to inform you about them because you can encounter them while using Soft Mask too.

1. An Image is displayed incorrectly in the Tiled mode when in uses Sprite with Tight mesh type. Sprite's borders are drawn a bit stretched. Here is how it looks like:
   
   The left image is Sliced, the right one is Tiled. As you see, the content is masked equally on the left and on the right sides, but backgrounds are drawn differently. When I found it, I, of course, thought that it's my bug, but, surprisingly, that was not the case The bug is published on Issue Tracker.
   
   
2. The following warning is shown even when the shader code is disabled by preprocessor:
   Use of UNITY_MATRIX_MVP is detected. To transform a vertex into clip space, consider using UnityObjectToClipPos for better performance.
   This warning is added in Unity 5.6, so, if you use Soft Mask in 5.6, you may see this message. It's bad when a paid package pop ups some warnings on import, but in this case, I think it doesn't cost effort to work around it (a workaround would be to publish separate packages for 5.3 and 5.4+ which leads to unnecessary duplication on my side). The bug is submitted but it's not accepted yet. And, honestly, I doubt it will. The major case when this causes real issues is just support of 5.3 and Unity planned to abandon support of 5.3 in March 2017. Probably I'll do so too in some next version of Soft Mask.

UPDATE As I thought, UT aren't planning to fix the warning. But it's great that they took the time to answer me

 

Is it work on 5.2.4？

 

@ganquan109
I'm currently downloading this version for test. I'll tell you the results.

 

@ganquan109
Sorry, it doesn't work on 5.2 out of the box and I don't plan to add support of it to the package.

But I managed to get it work on 5.2 with some modifications. The main issue is that 5.3 changed the way UI system controls the rectangle and alpha clipping in the default UI shader. Also, there were some compilation issues related to features that were added in 5.3. The simplest way to get Soft Mask to work on 5.2 is:

1. Remove samples (you can see them in a newer version of Unity).
2. Comment access to .rootCanvas in SoftMask.cs. It breaks Soft Mask functioning on nested canvases. If you don't need this feature, that's fine. If you need nested canvases, you can reimplement rootCanvas logic by yourself.
3. Rewrite rectangle and alpha clipping portions of SoftMaskTemplate.cginc in 5.2-style.

If you have some programming knowledge and ready to take risks, I can send my modifications to you. They make Soft Mask to work in a simple scenario but I haven't tested it thoroughly, so, you should be ready to deal with issues.

 

i can handle 1 and 2, but i do not know about the .cginc , i write a email to you , please send me your modifications

 

@ganquan109
Replied via email.

 

Добрый вечер, столкнулся с такой проблемой: в сборке под iOS (10) при перемещении рутового объекта (анимация, сделанная DOTween), маска мерцает розово-фиолетовым (как будто нет шейдера или материала). В чем может быть проблема? Используется Unity 5.4.3p1, в режиме Editor, в сборке на Android - все отлично.

 

@HartMagic, добрый вечер.

1. Для начала есть смысл проверить шейдеры в SoftMask/Shaders. Не отображаются ли в инспекторе ошибки, когда выбрана платформа iOS? Иногда Unity не показывает ошибки в шейдерах до момента сборки проекта. Так что можете попробовать выбрать шейдер в инспекторе и сделать билд.
2. Как проявляется мерцание? Что-то вроде z fighting? Или некоторые кадры маска отображается нормально, а некоторые - фиолетовая?
3. Вы можете отправить мне на почту минимальный проект, на котором можно воспрозвести проблему?

К сожалению у меня нет возможности проверить билд под iOS. Я так понимаю, в редакторе проблема не воспроизводится? Я сейчас поэкспериментирую с этой платформой, может быть что-то смогу выяснить без запуска на актуальном устройстве.

 

@zxkne, большое спасибо за ответ! После проверки по 1-у пункту, оказалось, что проблема не в вашем плагине, а в моей криворукости: у Image были указаны материалы, у которых не был указан шейдер. Так что, прошу прощения и большое вам спасибо

 

@HartMagic, отлично! Рад, что вы разобрались с проблемой. Если что, обращайтесь

 

Hello!

Does this work with TextMeshPro?

 

@darkblade665, hello!

That's a good question! The thing is that I know that TextMeshPro is a very popular package and many people use it. When it became free, I've checked how difficult it would be to add support of it to Soft Mask. And, sadly, I found that a straightforward solution will not work in this case. TextMeshPro doesn't interoperate with Unity UI very well: it doesn't respect IMaterialModifier's stack (so, any UI effects based on IMaterialModifier will not work with TextMeshPro). That upset me a bit and I had left the idea to add a good integration with this package. A good integration, in my view, is when you just put your TextMeshPro text into a mask and everything just work

But your question remembered me that there might be less 'good' integrations. One of the features of Soft Mask is that support of it can be easily added to any UI shader. It will be less convenient to use, the special shader should be assigned to a text component, but, it, probably, might work. I'll check if it works, and tell you the result in an hour or two.

 

Hey

Thank you for your reply, I'll be waiting for your answer and will be happy to buy the plugin if it works.

 

Well, that has taken more than an hour or two...

but finally I've managed to get this:

(this picture is taken from a custom modified version of Soft Mask. The Asset Store version doesn't support TextMesh Pro currently!)

This wasn't easy and the solution isn't production ready yet. And I'm still not sure whether I will add such support to the package. To get it work I had to inherit from TextMesh Pro classes and fix their strange override behavior. But it means that you should use custom classes instead of default TMPro's ones. Because TMPro generates child objects for inlined graphics, these scripts should be modified too, which means that I have to make yet more changes to the TMPro classes. Or maybe I should just patch TMPro .dll in place...

So, back to your question, @darkblade665, support of TextMesh Pro can be added to Soft Mask, but it requires some efforts and programming knowledge. If you are a programmer, you can try it, I'll send you my modifications and explain what have I changed and why. But if you don't have programming experience, I wouldn't recommend undertake it right now. Also, do you know that TMPro has some masking abilities? Maybe it would be sufficient for your case? Theoretically, you can use TMPro's masking for text and Soft Mask for another UI elements.

I'm going to dive a bit deeper into TextMesh Pro. There's still a chance that TMPro support will be added to Soft Mask in the future versions

 

Hi, all!

First of all, I want to thank all of my customers for choosing Soft Mask. I really appreciate your confidence!

I was reported recently about issues with moving of the asset into another folder. I've been able to reproduce a situation when moving of the asset right after import causes a problem with shader compilation. I believe it's related to this bug. If you've faced this issue, just reimport Shaders subfolder of the Soft Mask package.

Also, if you have some ideas or suggestions on what you would like to see in Soft Mask, feel free to share them!

 

Hello, is there any limitation for world space canvas? I need a soft canvas that can be rotated in any direction since the canvas follows the player.

 

Hello! There are no known limitations. The demo contains an example scene with a world space canvas. The scene contains no canvas movement but it's possible and it works. If you encounter any issues with world space canvas, write me, please, I'll help you with them.

 

Soft Mask is on sale at the moment! The discount is 25%.

EDIT: Sale ended 04/30.

 

Hi!
Just purchased your package from the Asset Store and so far I've been able to integrate it super-easily into my project, easily modifying some custom shaders we had for some UI elements following the samples provided. Good job!

Unfortunately we're using TextMeshPro too
I've read the previous post about TMP, I was wondering if you've been able to do some progress with TMP integration?
I'm a programmer, so I can handle hardcore stuff without problem
I've been trying to mess around with TMP's shader as I did with our own shaders, but haven't been successful so far
Any help will be appreciated!

In any case, as you probably know, TMP will soon be integrated as Unity's default Text system (https://blogs.unity3d.com/2017/03/20/textmesh-pro-joins-unity/), so it would be great to make SoftMask work with it anyway ^^

 

Hi, @Algerator!
Thank you for a good feedback!

What's about TMPro support, I decided to add it to the next version of Soft Mask. It will be available in the next month, but I can't say more for now.

At this moment I have an example of integration, see the attached file. This package should be imported after both TextMesh Pro and Soft Mask. It contains an adapted version of one of TMPro's shaders, an adapted script (TextMeshProUGUISoftMask) and a sample scene. Unfortunately, you have to use TextMeshProUGUISoftMask component instead of TextMeshProUGUI. I hope I will be able to fix this inconvenience in the future.

Please note, that the integration is experimental. It doesn't have production quality and might not work in some cases. Use it at your own risk!

Of course, if you encounter any issues with this package or need further help, feel free to write me!

 

Thanks a lot for the quick reply!

I've just tried the package and works like a charm ^_^
Since for now we only have a couple of textfields being used under a SoftMask, using a custom TMPro UGUI component is good enough

You sir have earned your 5-star review!

 

That's great! And thank you again

I also thank all those who had time to write a review or just rate! I very appreciate your feedback.

 

Hello,

I'm having problems using SoftMask combined with CurvedUI. The mask seems to be stuck at the default location (without the curved setting applied).

Here's the issue:

There you can see how the slider and the image is not moving with the CurvedUI settings. It seems like the SoftMask is still applied to the plane canvas.

 

Hello! I believe that this plugin modifies the geometry of UI elements. Soft Mask assumes that the mask area is planar and rectangular. In general case, there is no way to pass a description of a masked area of any shape that can be performant enough in a shader.

But I think it's possible to adapt Soft Mask to this concrete case (cylindrical-wrapped canvas). I'm going see what could be done and tell you the results today later.

 

Good news! I have been able to implement support of CurvedUI:

(this picture is taken from a custom modified version of Soft Mask. The Asset Store version doesn't support CurvedUI out of the box!)

The implementation is pretty straightforward:

1. Determine whether the canvas has a CurvedUISettings component attached to it.
2. If yes, pass additional settings that describe canvas curvature to the SoftMask shader.
3. "Unbend" world space position of a vertex before passing it into pixel shader, so code that samples the mask texture will continue to work in flat canvas space.

I've attached a ZIP with an example solution. It contains a patch that can be applied to Soft Mask (it's relative the Assets/SoftMask folder) and a package with an example scene. To use it, do following steps:

1. Import the CurvedUI and SoftMask packages to the project
2. Apply the patch to imported SoftMask
3. Import the example package

Please note that this is just an example of integration. The solution doesn't work with all of CurvedUI modes and may have worse performance than original Soft Mask.

If you don't want to apply a patch, email me your invoice number and I'll send you the modified Soft Mask package.

 

Hey mate,

great package. Loving it! however, i'm getting a error on export:

Shader error in 'Hidden/UI Default ETC1 (Soft Masked)': failed to open source file: 'SoftMaskTemplate.cginc' (on gles3)

Compiling Vertex program
Platform defines: UNITY_NO_DXT5nm UNITY_NO_RGBM UNITY_ENABLE_REFLECTION_BUFFERS UNITY_FRAMEBUFFER_FETCH_AVAILABLE UNITY_NO_SCREENSPACE_SHADOWS UNITY_PBS_USE_BRDF2 SHADER_API_MOBILE UNITY_HARDWARE_TIER2 UNITY_COLORSPACE_GAMMA

Any ideas whats wrong?

Cheers.

 

Hi,

Try to reimport SoftMask's shaders. To do so, right-click on Assets/SoftMask/Shaders and select "Reimport". I don't know why, but sometimes Unity just doesn't see the file that it should. Reimport may help. Please tell me whether it solves your issue or not.

 

Does it work with ListView Framework from Unity https://www.assetstore.unity3d.com/en/#!/content/69353 ?

 

Hello, @philip368320

No, Soft Mask doesn't work with List View Framework. Soft Mask works only with Unity UI while List View Framework doesn't use it at all.

But you might have seen that List View Framework contains several examples of masking implemented via render targets and custom shaders. You can use a similar approach if you need masking for List View Framework. Or, unless you need a true 3D UI, you also can consider using of another list solution that works with Unity UI (there are plenty of them on Asset Store).

 

Hi there. Trying to get Soft Mask to work with a custom material on the mask. I'm using a custom shader to change the shape of the mask material and the soft mask isn't working. Any idea why the children aren't receiving the graphic?

 

@k-may, hi,
If I understood you right, it's caused by the way Soft Mask works. When Soft Mask is applied to some elements, they're drawn by using a special shader that looks up into the mask texture and multiplies the resulting pixel's color accordingly. This shader doesn't really know how your mask element looks like. So, if you compute mask pixels or move vertices in a shader, these changes will be not reflected by the children.

If you need to use Soft Mask with a mask that is computed by a shader, I can suggest 2 options:

1. Render your special mask into a render texture and then use it as a mask. This may require modification of Soft Mask because currently, it expects Texture2D as a mask texture, not just Texture. Of course, you can also copy the content of a render target into Texture2D. Doing this way, you will be able to use any UI element as a mask - text, for example.
2. Reimplement mask sampling in a shader and assign this shader to all the children. Honestly, you don't need Soft Mask to do so. You can peek up a solution for automated shader replacements from Soft Mask, or even use it as is, but you still have to implement the main part.

This peculiarity of Soft Mask is described in the documentation. If this doesn't fit your needs, feel free to request a refund.

 

It's disappointing Unity can't do this already, but thanks for filling this gap. Is Soft Mask compatible with 5.6?

 

@DojoArcade,
yes, it is compatible with Unity 5.6.

EDIT: it works with Unity versions 5.3 – 2017.1. There is also exists an 'experimental' version for Unity 5.2. 'Experimental' means that I haven't tested it so thoughtfully as the versions listed above, but it seems to works, at least for one customer

 

Good Afternoon,

My name is Bryan Cancel and I am developing a game that requires outlines.

I have realized that sadly nothing currently meets my needs so I decided to build something myself.

With Rough Testing methods, I have determined that....

My method can spawn 835 objects -> before you reach 15 fps
The fastest outline shader I could find can only spawn 385 -> before you reach 15 fps

So needless to say I would really like to release mine... BUT...

The problem is that there are times when I need to use a clipping mask...

When I used Unity's standard sprite mask shader (new in Unity 2017.1) I can only spawn 200 objects before my 15 fps limit

-----

So before I purchase your asset
here: https://www.assetstore.unity3d.com/en/#!/content/80667
I needed to ask...

1. Is your asset fully functioning in Unity 2017.1?
2. Is your asset faster than the new Unity Sprite Masking System?

I would greatly appreciate your help and your honesty and I hope to hear from you soon!

Sincerely,
Bryan Cancel

 

Hello, Bryan,

First of all, I should say that my asset doesn't work with sprites. It works only with Unity UI. If you need a solution for sprites, you may look at other assets available in Asset Store. I've seen at least one that works with sprites.

I recently found a minor bug related to 2017.1. It doesn't undermine workability of the asset, just can cause some potential inconvenience. I will fix it in the next update which is expected soon. With exception of this, all functions of Soft Mask are working as they should. But anyway, if you will face with an issue in Soft Mask in any version of Unity starting from the minimum supported one (which is currently 5.3), I will do everything to fix it as soon as possible.

I didn't perform tests. And there is no point to do so because my asset works with UI and sprite masking works with 2D Sprites which is a separate system in Unity. They both allow to achieve the same effect but work in different ways:

• UI system batches as much as possible geometry together. When something moves, it requires recalculation of buffers. But it allows drawing of many elements in a few draw calls.
• Sprites are rendered almost as usual 3D objects. Each sprite has its own vertex buffer. Unity uses instancing for optimization but I don't know the details, I haven't worked with 2D.

So, a test that draws, say 100 UI Panels and 100 Sprites, will be not representative at all.

Thanks for your interest in my asset! If you have any further questions, feel free to ask.