[UnityShader效果]01.Mask
参考链接:
https://blog.csdn.net/akof1314/article/details/50428200
1.Mask.shader
- // Unity built-in shader source. Copyright (c) 2016 Unity Technologies. MIT license (see license.txt)
- Shader "Custom/Mask"
- {
- Properties
- {
- [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
- _Color ("Tint", Color) = (,,,)
- _StencilComp ("Stencil Comparison", Float) =
- _Stencil ("Stencil ID", Float) =
- _StencilOp ("Stencil Operation", Float) =
- _StencilWriteMask ("Stencil Write Mask", Float) =
- _StencilReadMask ("Stencil Read Mask", Float) =
- _ColorMask ("Color Mask", Float) =
- [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) =
- _MaskTex ("Mask Texture", 2D) = "white" {}
- }
- SubShader
- {
- Tags
- {
- "Queue"="Transparent"
- "IgnoreProjector"="True"
- "RenderType"="Transparent"
- "PreviewType"="Plane"
- "CanUseSpriteAtlas"="True"
- }
- Stencil
- {
- Ref [_Stencil]
- Comp [_StencilComp]
- Pass [_StencilOp]
- ReadMask [_StencilReadMask]
- WriteMask [_StencilWriteMask]
- }
- Cull Off
- Lighting Off
- ZWrite Off
- ZTest [unity_GUIZTestMode]
- Blend SrcAlpha OneMinusSrcAlpha
- ColorMask [_ColorMask]
- Pass
- {
- Name "Default"
- CGPROGRAM
- #pragma vertex vert
- #pragma fragment frag
- #pragma target 2.0
- #include "UnityCG.cginc"
- #include "UnityUI.cginc"
- #pragma multi_compile __ UNITY_UI_CLIP_RECT
- #pragma multi_compile __ UNITY_UI_ALPHACLIP
- struct appdata_t
- {
- float4 vertex : POSITION;
- float4 color : COLOR;
- float2 texcoord : TEXCOORD0;
- UNITY_VERTEX_INPUT_INSTANCE_ID
- };
- struct v2f
- {
- float4 vertex : SV_POSITION;
- fixed4 color : COLOR;
- float2 texcoord : TEXCOORD0;
- float4 worldPosition : TEXCOORD1;
- UNITY_VERTEX_OUTPUT_STEREO
- };
- sampler2D _MainTex;
- fixed4 _Color;
- fixed4 _TextureSampleAdd;
- float4 _ClipRect;
- float4 _MainTex_ST;
- sampler2D _MaskTex;
- v2f vert(appdata_t v)
- {
- v2f OUT;
- UNITY_SETUP_INSTANCE_ID(v);
- UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT);
- OUT.worldPosition = v.vertex;
- OUT.vertex = UnityObjectToClipPos(OUT.worldPosition);
- OUT.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);
- OUT.color = v.color * _Color;
- return OUT;
- }
- fixed4 frag(v2f IN) : SV_Target
- {
- half4 color = (tex2D(_MainTex, IN.texcoord) + _TextureSampleAdd) * IN.color;
- color.a *= tex2D(_MaskTex, IN.texcoord).a;
- #ifdef UNITY_UI_CLIP_RECT
- color.a *= UnityGet2DClipping(IN.worldPosition.xy, _ClipRect);
- #endif
- #ifdef UNITY_UI_ALPHACLIP
- clip (color.a - 0.001);
- #endif
- return color;
- }
- ENDCG
- }
- }
- }
核心代码:
- color.a *= tex2D(_MaskTex, IN.texcoord).a;
即遮罩图alpha=0的地方不会显示
遮罩图和效果图(遮罩图白色的地方实际上是透明的):
2.UV问题
上面的结果表面上看是没什么问题的,但如果把图片打进图集就会发现不对了。原因是,shader里面uv坐标不再是单个图片的坐标了,而是图集里面该图片的坐标,使得shader计算错误,最终渲染错乱。解决方法是,将单个图片的纹理坐标保存到uv1中。
SetVertUV1.cs
- using UnityEngine;
- using UnityEngine.UI;
- public class SetVertUV1 : BaseMeshEffect
- {
- public override void ModifyMesh(VertexHelper vh)
- {
- UIVertex uiVertex = new UIVertex();
- for (int i = ; i < vh.currentVertCount; i++)
- {
- vh.PopulateUIVertex(ref uiVertex, i);
- int uvX = i >> ;
- int uvY = uvX ^ (i & );
- uiVertex.uv1 = new Vector2(uvX, uvY);
- vh.SetUIVertex(uiVertex, i);
- }
- }
- }
即将4个顶点的uv1依次设置为(0,0),(0,1),(1,1),(1,0)
MaskUV1.shader
- // Unity built-in shader source. Copyright (c) 2016 Unity Technologies. MIT license (see license.txt)
- Shader "Custom/MaskUV1"
- {
- Properties
- {
- [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
- _Color ("Tint", Color) = (,,,)
- _StencilComp ("Stencil Comparison", Float) =
- _Stencil ("Stencil ID", Float) =
- _StencilOp ("Stencil Operation", Float) =
- _StencilWriteMask ("Stencil Write Mask", Float) =
- _StencilReadMask ("Stencil Read Mask", Float) =
- _ColorMask ("Color Mask", Float) =
- [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) =
- _MaskTex ("Mask Texture", 2D) = "white" {}
- }
- SubShader
- {
- Tags
- {
- "Queue"="Transparent"
- "IgnoreProjector"="True"
- "RenderType"="Transparent"
- "PreviewType"="Plane"
- "CanUseSpriteAtlas"="True"
- }
- Stencil
- {
- Ref [_Stencil]
- Comp [_StencilComp]
- Pass [_StencilOp]
- ReadMask [_StencilReadMask]
- WriteMask [_StencilWriteMask]
- }
- Cull Off
- Lighting Off
- ZWrite Off
- ZTest [unity_GUIZTestMode]
- Blend SrcAlpha OneMinusSrcAlpha
- ColorMask [_ColorMask]
- Pass
- {
- Name "Default"
- CGPROGRAM
- #pragma vertex vert
- #pragma fragment frag
- #pragma target 2.0
- #include "UnityCG.cginc"
- #include "UnityUI.cginc"
- #pragma multi_compile __ UNITY_UI_CLIP_RECT
- #pragma multi_compile __ UNITY_UI_ALPHACLIP
- struct appdata_t
- {
- float4 vertex : POSITION;
- float4 color : COLOR;
- float2 texcoord : TEXCOORD0;
- float2 texcoord1 : TEXCOORD1;
- UNITY_VERTEX_INPUT_INSTANCE_ID
- };
- struct v2f
- {
- float4 vertex : SV_POSITION;
- fixed4 color : COLOR;
- float2 texcoord : TEXCOORD0;
- float4 worldPosition : TEXCOORD1;
- float2 texcoord1 : TEXCOORD2;
- UNITY_VERTEX_OUTPUT_STEREO
- };
- sampler2D _MainTex;
- fixed4 _Color;
- fixed4 _TextureSampleAdd;
- float4 _ClipRect;
- float4 _MainTex_ST;
- sampler2D _MaskTex;
- v2f vert(appdata_t v)
- {
- v2f OUT;
- UNITY_SETUP_INSTANCE_ID(v);
- UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT);
- OUT.worldPosition = v.vertex;
- OUT.vertex = UnityObjectToClipPos(OUT.worldPosition);
- OUT.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);
- OUT.color = v.color * _Color;
- OUT.texcoord1 = v.texcoord1;
- return OUT;
- }
- fixed4 frag(v2f IN) : SV_Target
- {
- half4 color = (tex2D(_MainTex, IN.texcoord) + _TextureSampleAdd) * IN.color;
- color.a *= tex2D(_MaskTex, IN.texcoord1).a;
- #ifdef UNITY_UI_CLIP_RECT
- color.a *= UnityGet2DClipping(IN.worldPosition.xy, _ClipRect);
- #endif
- #ifdef UNITY_UI_ALPHACLIP
- clip (color.a - 0.001);
- #endif
- return color;
- }
- ENDCG
- }
- }
- }
[UnityShader效果]01.Mask的更多相关文章
- Unity UGUI——遮罩效果(Mask)
Show Mask Graphic
- [UnityShader基础]01.渲染队列
unity中定义了5个渲染队列: 1.Background,对应索引号1000,该队列最先被渲染 2.Geometry,对应索引号2000,默认的渲染队列,大多数物体都使用该队列,不透明物体使用该队列 ...
- 【原】使用Xfermode正确的绘制出遮罩效果
以前写as3的时候,遮罩效果一个mask属性就搞定了,真是方便. 转到android上以后,发现要实现类似的效果,可以使用Xfermode,android一共提供了三种: AvoidXfermode; ...
- C# 仿金山毒霸启动和关闭淡入淡出效果
原文 C# 仿金山毒霸启动和关闭淡入淡出效果 01 #region 窗体关闭效果 02 03 #region 私有方法 04 [DllImportAttribute("user32.dl ...
- 【js】使用javascript 实现静态网页分页效果
<!DOCTYPE html> <html> <head> <meta http-equiv="content-Type" content ...
- 【UGUI源码分析】Unity遮罩之Mask详细解读
遮罩,顾名思义是一种可以掩盖其它元素的控件.常用于修改其它元素的外观,或限制元素的形状.比如ScrollView或者圆头像效果都有用到遮罩功能.本系列文章希望通过阅读UGUI源码的方式,来探究遮罩的实 ...
- 快速学习html、css的经典笔记
HTML语言剖析 Html简介-目录 全写: HyperText Mark-up Language 译名: 超文本标识语言 简释:一种为普通文件中某些字句加上标示的语言,其目的在于运用标签(tag ...
- 论文阅读之 DECOLOR: Moving Object Detection by Detecting Contiguous Outliers in the Low-Rank Representation
DECOLOR: Moving Object Detection by Detecting Contiguous Outliers in the Low-Rank Representation Xia ...
- 关于 CSS 反射倒影的研究思考
原文地址:https://css-tricks.com/state-css-reflections 译者:nzbin 友情提示:由于演示 demo 的兼容性,推荐火狐浏览.该文章篇幅较长,内容庞杂,有 ...
随机推荐
- 腾讯广告联盟 Android SDK(广点通)demo的使用方式
1. 下载示例文件. 2. 解压之后的目录: 3. 使用android studio,选择import project,导入如图所示文件夹: 4. 重点来了,由于官方demo的上传时间很久远(大概是上 ...
- javascript_变量
首先说说变量,JavaScript变量可以用来保存两种类型的值:基本类型和引用类型. 1,基本类型很好理解,源于基本数据类型:underfined,null,boolean,number和string ...
- div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出
今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...
- 高性能mysql的事物隔离级别
数据库事务的隔离级别有4种,由低到高分别为Read uncommitted .Read committed .Repeatable read .Serializable .而且,在事务的并发操作中可能 ...
- 学习笔记TF058:人脸识别
人脸识别,基于人脸部特征信息识别身份的生物识别技术.摄像机.摄像头采集人脸图像或视频流,自动检测.跟踪图像中人脸,做脸部相关技术处理,人脸检测.人脸关键点检测.人脸验证等.<麻省理工科技评论&g ...
- 网络操作基础(one)
P12 一.什么是网络操作系统?网络操作系统具有哪些基本功能? 二.网络操作系统具有哪些特征? 三.常用的网络操作系统有哪些?它们各具有什么特点? 四.在网络操作系统中主要可提供哪些? ———— —— ...
- Spark:DataFrame批量导入Hbase的两种方式(HFile、Hive)
Spark处理后的结果数据resultDataFrame可以有多种存储介质,比较常见是存储为文件.关系型数据库,非关系行数据库. 各种方式有各自的特点,对于海量数据而言,如果想要达到实时查询的目的,使 ...
- Go Example--json
package main import ( "encoding/json" "fmt" "os" ) type Response1 stru ...
- Developing avb
ai automake ai libtool ai pkg-config autogen ai libgstreamer1.0-0 ai libgstreamer1.0-dev ai chec ...
- Python importlib(动态导入模块)
使用 Python importlib(动态导入模块) 可以将字符串型的模块名导入 示例: import importlib module = 'module name' # 字符串型模块名 test ...