UGUI InvertMask - 反向遮罩

news/2025/3/18 15:24:28/文章来源:https://www.cnblogs.com/soryu-ryouji/p/18779007

内容为原创,请读者不要将内容二次复制到 CSDN 等网站,拒绝互联网垃圾从你我开始。

🌴 介绍

反向遮罩是一种常见的 UI 效果,用于反转遮罩区域,使得原本被遮罩的部分显示出来,而未被遮罩的部分被隐藏。这种效果常用于制作镂空 UI 或复杂的遮罩形状。

🛠️ 功能实现

创建 InvertMask.cs

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Rendering;public class InvertMask : Image
{public override Material materialForRendering{get{Material material = new Material(base.materialForRendering);material.SetInt("_StencilComp", (int)CompareFunction.NotEqual);return material;}}
}

InvertMask 类继承自 UnityEngine.UI.Image,通过重写 materialForRendering 属性并修改材质渲染属性,实现了遮罩的反转效果。

materialForRendering 是 UnityEngine.UI.Graphic 类中的一个属性,用于获取或设置用于渲染的材质。当 UI 元素(如 Image)被渲染时,Unity 会调用这个属性来获取材质。

将组件添加到场景中

  1. 创建一个 Canvas 和 Image 作为背景。
  2. 在背景上添加 Mask 组件,并取消勾选 ShowMaskGraphic。
  3. 创建一个子对象,添加 InvertMask 组件。
  4. 调整子对象的大小和位置,观察反向遮罩的效果。

✍️ 原理分析

Unity 的遮罩系统通常使用模板测试(Stencil Test)来实现。这是一种 GPU 渲染技术,通过比较模板缓冲区中的值来决定是否渲染某个像素。默认情况下,遮罩区域会写入一个特定的模板值,而遮罩外的区域会被丢弃。

material.SetInt("_StencilComp", (int)CompareFunction.NotEqual);

这行代码将材质的模板比较函数(_StencilComp)设置为 CompareFunction.NotEqual。这意味着,只有当模板缓冲区中的值与当前模板值不相等时,才会渲染像素。因此,原本被遮罩的区域会被渲染,而原本未被遮罩的区域会被丢弃,从而实现遮罩的反转效果。

CompareFunction 是 Unity 提供的一个枚举类型,用于定义模板测试(Stencil Test)或深度测试(Depth Test)中的比较函数。

枚举值包括:

  • Never:永远不通过测试。
  • Less:小于时通过。
  • Equal:等于时通过。
  • LessEqual:小于或等于时通过。
  • Greater:大于时通过。
  • NotEqual:不等于时通过。
  • GreaterEqual:大于或等于时通过。

Reference

  1. Make a Cutout Mask in Unity! (Inverted Mask)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/900963.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用cursor打造智能客服demo

cursor AI它真的是非常强大。 今天讲下如何使用它,搭配deepseek api接口,来生成一个智能客服系统。这是最终的效果。首先cursor需要登录后才能使用。登录之后有两周的免费试用期。我们在窗口的右侧填写智能客服的需求。帮我实现一个网页智能客服。详细要求如下: 1.生成一个h…

【蓝牙小程序】小程序使用echart图表报错:setOption of undefined

转载自:https://developers.weixin.qq.com/community/develop/doc/0004ac054ccec0f26df7baa8756800问题:小程序使用echart图表报错 Cannot read property setOption of undefined;at api request success callback function TypeError: Cannot read property setOption of un…

前端中的Javascript

前端中的Javascript javascript定义方式内联JavaScript直接在HTML元素的事件属性中编写JavaScript代码<body><h1>Hello, World!</h1><button onclick="alert(Button clicked!)">Click Me</button> </body>内部JavaScript可以直接…

NVM:安装配置使用

一、简介 在实际的开发和学习中可能会遇到不同项目的 node 版本不同,而出现的兼容性问题。 而 nvm 就可以很好的解决这个问题,它可以在同一台机器上下管理多个 node 版本,使得程序员可以轻松地安装、卸载和切换不同的 node 版本。 在下载和配置 nvm 前,需要在控制面板中先删…

硬盘科普,M.2,PCI-E,NVMe 傻傻分不清

首先从三个层面去理解这个问题:物理接口,通道,协议 1:物理接口(相当于通讯中的电,光口) 大白话- 物理规格,像是 公路,铁路 专门跑PCI-E通道的那个物理接口:扩展性极强,可以插显卡的PCI-E X16的那个物理接口,或者插网卡,声卡的那个PCI-E X1那个物理接口,都是属于一类…

第二届长城杯ciscn半决赛awdp pwn以及应急响应wp

这次半决赛还真是状况频出,先是上午全场靶机断联了2轮,下午的应急又在坐大牢,还好是后面捋顺了逻辑做出来了,下半场干了个赛区第二,总成绩第四,这回是真燃尽了 上半场AWDP typo fix 一开始一直在改这道结果后面才发现那个prompt是真的好改,白浪费了3轮。。。 进入程序是…

LLM Assistance for Memory Safety

LLM Assistance for Memory SafetyMohammed, Nausheen, et al. "LLM Assistance for Memory Safety." 2025 IEEE/ACM 47th International Conference on Software Engineering (ICSE). IEEE Computer Society, 2024.Introduction 在软件安全的漏洞中,内存安全是主要…

『Plotly实战指南』--折线图绘制进阶篇

上一篇介绍了Plotly绘制折线图的基础知识和数据预处理的技巧, 本文将重点探讨如何利用Plotly实现多线折线图的布局设计以及动态折线图的实现, 让我们一起掌握进阶的折线图绘制技巧。 1. 多折线图布局 在实际的数据分析场景中,常常需要同时展示多组数据,例如对比不同产品的销…

使用gradio快速实现聊天机器人

我们可以使用gradio库通过低代码的方式快速实现聊天机器人界面及交互: import gradio as gr from ollama import chatdef predict(message,history):stream = chat(model="deepseek-r1:1.5b",messages=[{"role":"user","content":mess…

Edge浏览器登录微软账户报错0x80190001的解决办法

问题 0x80190001是什么错误?有用户在Edge浏览器上登录微软账户遇到了这个错误代码,这是什么意思?要如何解决呢?一个比较靠谱的解决办法解决方式1、下载一个finder(抓包软件)官网下载地址(最新版本):https://www.telerik.com/download/fiddler2、直接安装就好,选择左上…

2025年项目管理软件革命:7大工具重新定义团队协作

本文深度解析2025年项目管理工具的技术革新与市场格局,聚焦AI、量子计算、混合现实等技术对团队协作模式的颠覆性影响。一、2025年项目管理生态的三大颠覆性变化 在生成式AI、量子计算与混合现实技术推动下,项目管理工具正经历三大变革:决策权转移:AI从辅助工具升级为“虚拟…

【前瞻技术布局】京东零售广告创意:引入场域目标的创意图片生成

作者:京东零售 冯伟WWW2025: CTR-Driven Advertising Image Generation with Multimodal Large Language Models 论文链接:https://arxiv.org/pdf/2502.06823 代码链接:https://github.com/Chenguoz/CAIG 摘要:在电商平台中,广告图片对于吸引用户注意力和提高广告效果至关…