【shaderforge小实例】遮罩

遮罩效果

+=>

原理

最简单的方法就是制作一张带有预期的透明度值的遮罩图，我们依据遮罩图的透明度值来设置原图的透明度，就得到了遮罩效果

透明度实现方式
在unity中实现透明度效果有两种方案,一种是透明度测试,一种是透明度混合。
- 透明度测试实现方式:既是片元的透明度和透明度阈值进行比较,小于这个透明度阈值的片元会直接被舍弃掉,不会做任何处理,相当于该片元透明。而大于这个透明度阈值的则会按照不透明的方式进行处理。
- 透明度混合实现方式:既是片元的透明度作为混合因子,片元的深度和深度缓冲区中的深度做比较,小于深度缓冲区中的深度时,片元的透明度不会与颜色缓冲区中的颜色进行混合,否则就会进行混合,最终片元的颜色会替换到颜色缓冲区中的颜色。

制作遮罩图

如何使用Photoshop（PS）将图片的底色变为透明

ShaderForge实现

手写unity shader实现

透明度测试

Shader "Custom/mask_u"
{Properties{_MainTex ("Texture", 2D) = "white" {}_MaskTex("Mask Texture", 2D) = "white" {}}SubShader{// 所有Pass中渲染队列使用透明度测试队列,渲染类型选择透明度测试类型,并且渲染过程中不受投影器的影响Tags{ "Queue" = "AlphaTest" "IgnoreProjector" = "True" "RenderType" = "TransparentCutout" }LOD 100Pass{Tags{ "LightModel" = "ForwardBase" }CGPROGRAM#pragma vertex vert#pragma fragment frag// make fog work#pragma multi_compile_fog#include "UnityCG.cginc"struct appdata{float4 vertex : POSITION;float2 uv : TEXCOORD0;};struct v2f{float2 uv : TEXCOORD0;UNITY_FOG_COORDS(1)float4 vertex : SV_POSITION;};sampler2D _MainTex;float4 _MainTex_ST;sampler2D _MaskTex;v2f vert (appdata v){v2f o;o.vertex = UnityObjectToClipPos(v.vertex);o.uv = TRANSFORM_TEX(v.uv, _MainTex);UNITY_TRANSFER_FOG(o,o.vertex);return o;}fixed4 frag (v2f i) : SV_Target{// sample the texturefixed4 col = tex2D(_MainTex, i.uv);// apply fogUNITY_APPLY_FOG(i.fogCoord, col);fixed4 mask_col = tex2D(_MaskTex, i.uv);// 进行透明度测试,小于透明度阈值的片元将会被舍弃,等价于 if ((mask_col.a - 0.5)) < 0.0) discard; 0.5是默认的透明度阈值clip(mask_col.a - 0.5);return col;}ENDCG}}
}

透明度混合

Shader "Custom/mask_u"
{Properties{_MainTex ("Texture", 2D) = "white" {}_MaskTex("Mask Texture", 2D) = "white" {}}SubShader{// 所有Pass中渲染队列使用透明度混合队列,渲染类型选择透明度混合类型,并且渲染过程中不受投影器的影响Tags{ "Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent" }LOD 100Pass{Tags{ "LightModel" = "ForwardBase" }// 关闭深度写入,避免深度变化造成半透明异常ZWrite Off// 开启透明度混合,并设置片元颜色的乘积因子以及颜色缓冲区中颜色的乘积因子Blend SrcAlpha OneMinusSrcAlphaCGPROGRAM#pragma vertex vert#pragma fragment frag// make fog work#pragma multi_compile_fog#include "UnityCG.cginc"struct appdata{float4 vertex : POSITION;float2 uv : TEXCOORD0;};struct v2f{float2 uv : TEXCOORD0;UNITY_FOG_COORDS(1)float4 vertex : SV_POSITION;};sampler2D _MainTex;float4 _MainTex_ST;sampler2D _MaskTex;v2f vert (appdata v){v2f o;o.vertex = UnityObjectToClipPos(v.vertex);o.uv = TRANSFORM_TEX(v.uv, _MainTex);UNITY_TRANSFER_FOG(o,o.vertex);return o;}fixed4 frag (v2f i) : SV_Target{// sample the texturefixed4 col = tex2D(_MainTex, i.uv);// apply fogUNITY_APPLY_FOG(i.fogCoord, col);// 乘以遮罩图的透明度fixed4 mask_col = tex2D(_MaskTex, i.uv);col.a = col.a * mask_col.a;return col;}ENDCG}}
}

参考：

[UnityShader3]遮罩效果
unity shader:初探透明度

【shaderforge小实例】遮罩相关推荐

【shaderforge小实例】轮廓内发光
本篇使用unity shaderforge插件和编写unity shader code两种方式来实现轮廓内发光发光效果内发光:发光效果不能超出模型的范围,模型中心最暗向着边缘方向逐渐变亮内发光效 ...
【shaderforge小实例】水中倒影
效果 => 原理将原图均分为月亮部分和水面部分两张图,其他区域用透明色填充倒影:就是将uv的v值翻转一下, 倒影在水的扭曲效果:就是让图片不同部位uv值的增量不同,如果不太熟悉扭曲效果的,可 ...
android－sqlite小实例
学习android-sqlite数据库的一个小实例,只需要有数据库文档,就可以获取里面的数据,而不需要本地链接.此实例,是将数据库文档mydb.db里面某个表里面的信息显示出来,仅供参考,希望共同进步 ...
jquery-1 jquery几个小实例
jquery-1 jquery几个小实例一.总结一句话总结:jquery真的是简单加简便. 1.jquery中改变多个css属性怎么整? 可以链式连接方式,也可以大括号整多个.中间是键值对加引号 ...
5个很常用的CSS3网页小实例
5个很常用的CSS3网页小实例第一种效果: 由于录制gif图片会掉帧,所以看起来不流畅,很卡,但其实实际效果还是不错的,有弹性一些. HTML <span class="shake& ...
spring aop实例讲解_小实例理解Spring中的AOP----面向切面编程
关于面向切面编程(Spring AOP),是在java面试中经常提及的,只有在充分理解了,日常工作中才能得心应手. 如何理解AOP呢?首先我们要思考为什么要使用切面编程,如下图: 对于一个系统来说保存 ...
Entity Framework 的小实例：在项目中添加一个实体类，并做插入操作
Entity Framework 的小实例:在项目中添加一个实体类,并做插入操作 Entity Framework 的小实例:在项目中添加一个实体类,并做插入操作 1>. 创建一个控制台程序 2 ...
spring+mybatis之声明式事务管理初识(小实例)
前几篇的文章都只是初步学习spring和mybatis框架,所写的实例也都非常简单,所进行的数据访问控制也都很简单,没有加入事务管理.这篇文章将初步接触事务管理. 1.事务管理理解事务管理之前,先通 ...
%rowtype mysql_Oracle %type和%rowtype小实例
//%type //如果声明的变量是直接映射到数据库的某一列上,那么就可以使用%type关键字将变量 //锚定到这个列上.这样做有什么 Oracle %type和%rowtype小实例 [日期:201 ...

【shaderforge小实例】遮罩

遮罩效果

原理

制作遮罩图

ShaderForge实现

手写unity shader实现

参考：

【shaderforge小实例】遮罩相关推荐

最新文章

热门文章

【shaderforge小实例】 遮罩

遮罩效果

原理

制作遮罩图

ShaderForge实现

手写unity shader实现

参考：

【shaderforge小实例】 遮罩相关推荐

最新文章

热门文章

【shaderforge小实例】遮罩

【shaderforge小实例】遮罩相关推荐