Alpha Mask: UI, Sprites, Tilemaps, Particles, 3D

Asset Store Link!
​

​

Alpha Mask is a set of shaders and scripts that are used for alpha masking.

Various masking components exist, but they usually require Unity Pro (for Unity 4) and are unable to use semi-transparency (soft masks, gradient masks, anti-aliasing, etc.). Alpha Mask component, however, solves these issues and provides a mask, similar to Flash or Photoshop.

• Works with Unity UI (uGUI) Images and Text, Sprites and 3D Transparent Unlit objects.

• Soft, anti-aliased, gradient and semi transparent masks supported.
  
• All script and shader sources included!
• Extremely easy to use.
• Mask textures can be clamped horizontally/vertically.
• Easy mask positioning in the Editor.
• Supports mask moving, scaling, rotation, UV scaling, UV offset.
• Masks can be freely rotated and mapped on any direction.
• Can be used for UI or 2D games (including either Unity UI, Sprites or 3D Quads).
• NO Unity Pro needed!
• A sample with multiple alpha masks on a single sprite included (using a RenderTexture).

Video presentation:

Support e-mail (we would love to answer your questions or receive any feedback about the component): support@tagofjoy.lt

 

I'm subscribing to this thread. This looks very useful for my next project.

 

Hi b4c5p4c3,

Thanks a lot. We hope that the plugin will speed up your development! Let us know if you run into any questions.

 

We have just released an update that adds Unity UI (uGUI) support (for texts, images, etc.) and also fixes Unity 5 warnings.

 

Are you able to confirm that this has support for TextMesh Pro? It's what we use for all text in our projects and I saw a separate soft masking component on the asset store where people said that that did not support this functionality. Just looking for some affirmation that this one does support TextMesh Pro having a soft shadow. Thanks, looks like a great tool.

 

Hi Nerull22,

Unfortunately, TextMesh Pro isn't a Unity UI component (and it works differently), so our plugin does not support it at the moment. But let's talk in a private message, let's see if we can do something about it.

On the other hand, if you need text with effects that Unity does not have by default, you could try another package of ours: https://www.assetstore.unity3d.com/en/#!/content/52508
This package contains multiple effects for the standard Unity UI Text, so by using them you wouldn't need third party text plugins. Our Alpha Mask works with most of the effects that are included in the UI Text Effects package.

 

Hello, did you test it on WebGL Build? will it work?

 

Hi JagaHee,

I've just tested it and I can confirm that it works on WebGL It should actually work on any platform, since there is nothing platform-specific in the scripts or shaders.

 

Hi!

I just started using your asset, which seems very cool except for an issue with Unity UI Text objects. When I apply the mask, the text becomes black and doesn't respect the chosen color anymore. Is this fixable? Here is some screenshots to show my setup, in case it might help ("Txt Index" is the text object in the hierarchy):



Cheers

 

Hi Izitmee,

EDIT: I think I figured it out. Could you write me your e-mail address in a private message? I would send you an updated script directly, and if it works, I'd make an update on the Asset Store ASAP.

 

Ah, that was superquick, thanks! Just wrote you a private message

 

The fix worked, so I'm submitting an update to the Asset Store. If anyone else is experiencing black Text issues with Unity 5.2 or later (earlier versions do not have that problem), please just wait until Asset Store approves it or ask me to send you the fixed script directly.

 

Can you use a RenderTexture as the alpha mask texture? I have been looking for an alpha mask that supports RenderTextures for custom lighting in a project I'm working on.

 

Hi iamallama,

Yes, definitely

 

Curious if this works with NGUI, it's definitely something I'd purchase if so.

 

Hi sgiff,

We haven't tested it with NGUI, but I would certainly like to look into it. Does it use SpriteRenderers or does it have its own solution for rendering images? If you could share a simple project (through a private message) with a simple NGUI setup, I'd be glad to check it out.

 

Hello,

Your asset looks really nice. I have a few questions though:

- It looks like the "Display Mask" option does not work when working with alpha mask. (I expect the mask to hide when clicking the option but it continues to render everything black in the scene around my mask)

- Is it possible to have multiple alpha masks on the same scene ? From what I understand of how it works it does not look possible but maybe there is a workaround ?

Thanks

 

Hi killradio,

Thanks for the positive feedback, we really appreciate it! I'll try to answer your questions:

1. It should definitely hide the Mask itself (and only leave the effect of the Mask on other images) when you untick "Display Mask". Could you show an image or two of how it looks (you can send them to a private message, of that's more convenient)?

2. You can have as many Masks in the scene as you need. However, you can only have one Mask applied to the same sprite/quad/UI element, out of the box. However, if you need multiple masks on the same image, you can render them into a RenderTexture first and then use the RenderTexture as the Mask in our plugin - this works perfectly and it a good way to apply multiple masks to the same image.

Let me know if you need anything else, and I'll be waiting for a screenshot regarding the first questions

 

Hi,

Concerning the first question, here are the screenshots.
What I though, was that by unchecking the "Display mask", I would see my entire scene :
- When "Display mask" ON : The background / wood texture has a round masked applied to it.
- When "Display mask" OFF : The background / wood texture is entirely visible.

So the first screen shows with the unchecked "display mask". The second with the checked display mask. There is a small difference on the edges of the circle when display mask is on. So maybe that's the expected result ? (If it is, just ignore my question then ^^)
[Display OFF]

[Display ON]



Concerning the ability to have multiple masks on the same image : I am not familiar with RenderTexture but will look into it. I am not sure though if it is available for the free version of Unity ? Also, would you have some examples / samples to start with this ?

Thanks for the help,
Cheers !

 

It looks like your Mask object is behind the button (further from the camera on the Z axis). Could you try bringing it closer to the camera? You should then see the Mask itself, and unticking its visibility will be more obvious.

Regarding the RenderTexture, it is definitely available in Unity 5 Personal, but it's not in Unity 4 Free. If you're using Unity 5, you should be able to easily set it up (there's some information here: http://docs.unity3d.com/Manual/class-RenderTexture.html ). Your idea to provide a sample set up is great, though! We will surely include it in the next release.

 

Indeed, bringing the mask closer to the camera makes the effect more obvious. (and answers my question)

I'll be looking into the RenderTexture (as I am using the latest version of Unity), even though I am not quite sure how to render the different masks in it for my background. (The idea being a way to simulate lightings / fog of war)

Looking forward for your next release

Thanks again

 

Hi
I’m trying to use this plugin to make a mask for image re-sizing/cropping etc. like the one below where everything around the selection is slightly darker.

Is this possibly using unity UI (panels , images) ?






Thanks

 

Hi masterlsc,

I'm not fully sure if I understood your question correctly, but here is a quick sample of how you can use our Mask to "cut" a hole inside a semi-transparent black overlay. You can see how the Mask looks on the right image, and the result on the left one. You will need to make the Mask image Clamped in the import settings. I've made this sample with UI elements; and other elements (e. g. the circles on the corners) you can position from scripts, but you'll have to do the calculations yourself

Hope that helps!

 

Hi

Thanks for your reply, that is exactly what i'm trying to do. Could you send this code example that would be really great

Lars

 

There is actually no code involved - I just set the UI and the Mask up. You'll have to write the code that scales/positions the Mask yourself But if you move/scale the Mask in the Editor, you'll see how the "hole" changes and moves around (a sample scene is attached).

 

thanks, awesome support

Have a nice day.

 

Hi

The sample dont seem to contain a working example, and i dont know how to set the masks up

 

Let's switch to a private message and see how we can resolve this

EDIT: Are your private messages disabled (I can't seem to be able to send it)? Could you send me a PM or drop me an e-mail via the support e-mail address specified here: https://www.assetstore.unity3d.com/en/#!/content/29764

 

Does this support building to mobile platforms? The masks don't seem to be able to move on any mobile builds, such as a texture offset, or even a mask attached as a child to the player object.

My particular example I'm using the mask to cut through a large black sprite simulating darkness, and using a circle for light, the darkness follows the player just fine but the circle of light won't move past where it started.

 

Hi Bennybennerson,

Yes, the plugin should definitely work on mobile platforms. Could you try putting the two Mask shaders (imported withing the package/plugin) in the Resources folder? Does that help?

 

Yes, that seemed to fix it, thank you very much!

Only thing is, is it doesn't seem to scale to canvas size when affecting the UI, the pattern is much more zoomed in on the mobile than it is in the editor. I can try changing some stuff around and see what I can do though.

Thanks!

 

is it support skeleton animation?
(http://ko.esotericsoftware.com/ , http://esotericsoftware.com/files/runtimes/unity/spine-unity.unitypackage)

 

Hi again Bennybennerson,

Are you maybe using a "Screen - Overlay" canvas? I haven't figured out how to make the plugin work properly with that option, since it's implemented a little weird on the Unity side. Could you try "Screen - Camera", and if that doesn't work, then "World" space? And then let me know if any of that helps.

 

Hi LitQoo,

If the animated objects use "Unlit / Transparent" shaders or the Sprite shader, then yes, the Mask should work on those animated objects.

 

This is a great asset! I'd like to buy it for my next project.

 

Finally, we've released an update with a sample that uses a RenderTexture to combine multiple mask images into the Alpha Mask. The setup is pretty simple, so check it out!

​

 

Can I use this for mobile?

Thanks

 

Hi nproject,

Yes, you can definitely use it on mobile

 

Hi, another question.
I bought your plugin, I want to know how to mask a textMesh ?

Thanks

 

Hi again nproject,

Without changes to the code it wouldn't work, because Text Mesh is not supported by our plugin (it's not a sprite, Unity UI element or an unlit 3D object). However, I've tried editing the code to make it work, and it looks like it does. I will send you the edited version within a private message.

 

Thanks for great support

BTW I already reply your private message.

 

I've imported your asset for the first time and TextMeshPro is throwing a namespace error:

Assets/Libraries/TextMesh Pro/Scripts/TMP_MaterialManager.cs(270,39): error CS1061: Type `Mask' does not contain a definition for `IsActive' and no extension method `IsActive' of type `Mask' could be found (are you missing a using directive or an assembly reference?)

I fixed it by changing the type Mask to UnityEngine.UI.Mask. Maybe you should talk with the TextMesh pro guy to make it compatible. TextMeshPro is very popular.

 

I cannot position and scale the mask in my UI because I'm using a canvas configured as ScreenSpace - Overlay. I cannot change that configuration. The asset is useless for me .
Are you going to fix that? I'm going to change my review when you fix it.

 

Hi fermmmm,

Thanks for your insights. We are definitely willing to fix the "ScreenSpace - Overlay" issue, so I'll send you a private message for some additional information. Let's give it another go

 

The shaders don't seem to work on sprites or the shaders don't load in the test build. When using the Unity player it works fine. Am I missing something? I'm using the latest version btw.

 

Hi DevEddi,

Try moving the Alpha Masked shaders (2D and 3D ones) into the Resources folder and let me know if that helps

 

Hello DominoOne,

I have an issue in my game and I was considering using your package to help me solve it.

The issue is an issue with the Unity UI Mask component. I'm building a nail painting game using the Unity UI with a canvas set to Screen Space - Camera and in it I have a game object called "Draw Panel" which contains a Mask component. "Draw Panel" has a child game object called "RawImage" that has, you guessed it, a Raw Image component and the drawing script. In-game the source image for the mask looks like it has pretty clean lines but when I paint the Raw Image texture and the mask is applied it looks terrible. My understanding is that the Unity UI Mask's alpha check causes this sort of inconsistent masking behavior.

Will your asset help me eliminate that rough border that's caused by the UI Mask component?

 

Hi CunningGrayFox,

Sorry for a late reply, I was away for a few days

Yes, that is exactly what our Alpha Mask does and solves, because the standard Unity Mask does not support semi-transparency, soft edges or gradients.

 

Where can I find tutorial or documentation? I have no idea how I can handle simple case with avatar and circle mask.
I also have namespace problems with TextMesh Pro. Is it possible to mask TextMesh Pro objects?

 

Hi Celanda,

There is not much to document, because the usage is quite simple. All the necessary information is in the ReadMe file, included in the package itself. You can also watch the video that shows the usage of the plugin: https://www.assetstore.unity3d.com/en/#!/content/29764

Of course, if that's not enough, and you need additional help, just ask here However, the plugin currently does not support TextMesh Pro, although, we're planning to look into it.