
- [【Unity 实用工具篇】 | Unity中的软遮罩组件 SoftMaskForUGUI 快速上手使用](#【Unity 实用工具篇】 | Unity中的软遮罩组件 SoftMaskForUGUI 快速上手使用)
-
- [一、软遮罩组件 Unity UI Soft Mask](#一、软遮罩组件 Unity UI Soft Mask)
-
- [1.1 SoftMask组件介绍](#1.1 SoftMask组件介绍)
- [1.2 效果展示](#1.2 效果展示)
- [1.3 使用说明及下载](#1.3 使用说明及下载)
- 二、SoftMask参数
- 三、快速上手使用
- 四、进阶技巧示例
- 五、适用场景推荐
- 总结

前言
在Unity开发中,Mask组件是项目中的高频使用组件。比如在实现ScrollView的滑动功能时,就必须依赖Mask组件来创建遮罩效果。
另一个典型应用场景是制作玩家头像,通常我们会通过添加圆形遮罩来实现圆形头像的显示效果。
然而,标准Mask组件存在一个明显缺陷:其硬边遮罩效果会导致边缘出现生硬的割裂感,这在大多数项目中都是不可接受的。
为此,本文将介绍Mask组件的优质替代方案------SoftMask组件。接下来我们将详细解析该组件的特性及使用方法。
【Unity 实用工具篇】 | Unity中的软遮罩组件 SoftMaskForUGUI 快速上手使用
一、软遮罩组件 Unity UI Soft Mask
1.1 SoftMask组件介绍
SoftMask是Unity中用于实现平滑边缘遮罩效果的第三方组件(非Unity官方内置),常用于UI系统。与Unity原生Mask组件相比,SoftMask能实现渐变透明的边缘效果,避免生硬的裁剪边缘。
组件特点:
- 兼容性:完全兼容现有的 Mask 组件,可以将现有的 Mask 转换为 SoftMask直接使用。
- 可调节的可见部分:可以自由调整遮罩的可见部分。
- 多样的遮罩选项:支持使用 Text、Image、RawImage 作为遮罩图形。
- 多 Sprite 和 SpriteAtlas 支持:SoftMask 支持多个 Sprite 和 SpriteAtlas。
- 嵌套软遮罩:支持最多 4 层嵌套软遮罩。
- ScrollRect 支持:SoftMask 支持 ScrollRect 组件。
- 全渲染模式支持:支持覆盖、相机空间和世界空间。
- 软遮罩 UI 着色器:包含一个用于 UI/Dafault 的软遮罩 UI 着色器。
- 自定义着色器支持:可以通过少量修改使自定义着色器支持软遮罩。
- 性能/质量调整:可以调整软遮罩缓冲区大小以提高性能或质量。
- 高效渲染:软遮罩缓冲区仅在需要时更新,以提高性能。
- 软遮罩缓冲区预览:可以在检查器中预览软遮罩缓冲区。
- 抗锯齿遮罩模式:如果不需要半透明遮罩,可以使用性能更好的"抗锯齿遮罩模式"。
- 遮罩形状:可以使用 MaskingShape 组件添加或移除遮罩区域。
- 反向遮罩:使用 MaskingShape 组件实现反向遮罩。
- 射线投射过滤:射线投射仅对可见部分进行过滤,适用于防止教程中点击遮罩部分的点击。
- 立体支持:支持 VR 的软遮罩。
- TextMeshProUGUI 支持:支持 TextMeshProUGUI,并支持 TextMeshPro v3.2/4.0 (pre-release) 和 uGUI 2.0 (Unity 2023.2+/6.0+)。
- 更好的编辑器体验:在场景视图中,屏幕外的对象显示为模板遮罩,便于直观编辑。
- 自动着色器包含和剥离:SoftMaskable 着色器在构建时自动包含,未使用的着色器变体被移除。
1.2 效果展示


1.3 使用说明及下载
- Unity Asset Store下载地址:Asset Store下载
- GitHub下载地址:Git仓库下载
- CSDN下载地址:SoftMask插件
- 白嫖地址:VX搜我博客名字,回复【素材资源】
二、SoftMask参数

| 属性 | 说明 |
|---|---|
| Masking Mode | 遮罩模式 |
| Show Mask Graphic(SoftMasking or Normal) | 显示与蒙版渲染区域相关联的图形。 |
| Alpha Hit Test: | 透明部分无法点击。 当纹理采用压缩格式或不可读格式时,不支持进行 Alpha 折叠测试。仅在必要时启用此功能,因为这将需要更多的图形内存和处理时间。 |
| Down Sampling Rate(SoftMasking only) | 软掩膜缓冲区的下采样率。此值越高,软掩膜的质量就越差,但性能会有所提升。 |
| Softness Range(SoftMasking only) | 用于软化遮罩的最小和最大α值。这两值之间的差距越大,软化效果就越明显。 |
| Preview Soft Mask Buffer (in editor, SoftMasking only) | 在"检查器"中预览软遮罩缓冲区。 |
Masking Mode
Masking Mode有三种模式可选择
| 属性 | 说明 |
|---|---|
| SoftMasking(软遮罩) | 带有半透明效果的光滑遮罩。需要为渲染纹理和可软遮罩的着色器分配内存。将渲染纹理用作软遮罩缓冲区。遮罩图形的透明度可以使用。 |
| Anti-Aliasing(抗锯齿) | 边缘更平滑的模板遮罩。无需使用渲染纹理或柔光可遮罩的着色器,运行速度更快。消除遮罩图形的锯齿状边缘。遮罩图形不可显示。 |
| Normal | 与遮罩组件的遮罩部分相同。 |
更多详细参数及作用可以去官方文档查阅,这里只介绍写较为常用的。
三、快速上手使用
SoftMaskForUGUI 的核心在于其SoftMask和SoftMaskable两个组件。
前者可以替代标准的Mask组件,后者则用于添加到被遮罩的对象上,使得它们能够响应柔和的遮罩效果。
还支持自定义着色器,只需要简单三行代码就可以让自己的着色器支持软遮罩。
使用该组件的方法与Unity自带的Mask组件基本一致,下面拿ScrollView组件做示例:
1.在场景中添加一个ScrollView组件,将Viewport上面的Image找一张圆形边缘半透的图片替换

此时效果如下,可以看到边缘切割非常生硬的裁剪边缘。

2.将 Viewport节点上的Mask组件替换成SoftMask组件

效果如下,边缘效果明显好了很多,这基本上就是使用SoftMask最大的作用之一了。

四、进阶技巧示例
除了上面提到的边缘渐变软遮罩之外,softMask还提供了一些其他功能,下面演示一个反向遮罩的功能。
使用MaskingShape组件,可以在基础遮罩功能之上,新增一个遮罩剔除和添加的功能,效果如下所示:

使用MaskingShape组件,将Masking Method 设置为Additive ,可以将原本被遮罩盖住的地方按指定图形(根据需求自行切图)重新展示:

同样的,将Masking Method 设置为Subtract ,可以将图片在原有遮罩基础上按指定图形再次遮罩:

MaskingShape组件使用时,其节点放置于SoftMask下即可。

使用这个功能,就可以实现一个放大镜寻物或者探照灯效果,只显示手指滑动到的区域,其他地方隐藏或单独展现。
五、适用场景推荐
- 圆形头像平滑裁切
- 平滑过渡的UI卡片
- 对话气泡的渐变消失
- 游戏地图的迷雾效果
- 技能冷却的平滑边缘
⚠️ 避免在移动端低端设备上同时使用超过3个SoftMask
通过合理使用SoftMask组件,可显著提升UI视觉效果的专业性,同时保持高性能渲染。建议结合项目需求灵活调整参数,必要时参考插件源码进行深度定制。
总结
SoftMask能够实现更出色的遮罩效果,相比普通Mask,其边缘过渡更加平滑自然,同时还提供了更丰富的遮罩功能。操作简单易上手,非常推荐使用。
🎬 博客主页:https://xiaoy.blog.csdn.net
🎥 本文由 呆呆敲代码的小Y 原创 🙉
🎄 学习专栏推荐:Unity系统学习专栏
🌲 游戏制作专栏推荐:游戏制作
🌲Unity实战100例专栏推荐:Unity 实战100例 教程
🏅 欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正!
📆 未来很长,值得我们全力奔赴更美好的生活✨
------------------❤️分割线❤️-------------------------




资料白嫖,技术互助
| 学习路线指引(点击解锁) | 知识定位 | 人群定位 |
|---|---|---|
| 🧡 Unity系统学习专栏 🧡 | 入门级 | 本专栏从Unity入门开始学习,快速达到Unity的入门水平 |
| 💛 Unity实战类项目 💛 | 进阶级 | 计划制作Unity的 100个实战案例!助你进入Unity世界,争取做最全的Unity原创博客大全。 |
| ❤️ 游戏制作专栏 ❤️ | 难度偏高 | 分享学习一些Unity成品的游戏Demo和其他语言的小游戏! |
| 💚 游戏爱好者万人社区💚 | 互助/吹水 | 数万人游戏爱好者社区,聊天互助,白嫖奖品 |
| 💙 Unity100个实用技能💙 | Unity查漏补缺 | 针对一些Unity中经常用到的一些小知识和技能进行学习介绍,核心目的就是让我们能够快速学习Unity的知识以达到查漏补缺 |
