前言
在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仓库下载
- 优快云下载地址：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，其边缘过渡更加平滑自然，同时还提供了更丰富的遮罩功能。操作简单易上手，非常推荐使用。
🎥 本文由 呆呆敲代码的小Y 原创 🙉
🎄 学习专栏推荐：Unity系统学习专栏
🌲 游戏制作专栏推荐：游戏制作
🌲Unity实战100例专栏推荐：Unity 实战100例 教程
🏅 欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正！
📆 未来很长，值得我们全力奔赴更美好的生活✨
------------------❤️分割线❤️-------------------------
资料白嫖，技术互助
| 学习路线指引（点击解锁） | 知识定位 | 人群定位 |
|---|---|---|
| 🧡 Unity系统学习专栏 🧡 | 入门级 | 本专栏从Unity入门开始学习，快速达到Unity的入门水平 |
| 💛 Unity实战类项目 💛 | 进阶级 | 计划制作Unity的 100个实战案例！助你进入Unity世界，争取做最全的Unity原创博客大全。 |
| ❤️ 游戏制作专栏 ❤️ | 难度偏高 | 分享学习一些Unity成品的游戏Demo和其他语言的小游戏！ |
| 💚 游戏爱好者万人社区💚 | 互助/吹水 | 数万人游戏爱好者社区，聊天互助，白嫖奖品 |
| 💙 Unity100个实用技能💙 | Unity查漏补缺 | 针对一些Unity中经常用到的一些小知识和技能进行学习介绍，核心目的就是让我们能够快速学习Unity的知识以达到查漏补缺 |
扫一扫
1万+
到【灌水乐园】发言
