本文已参与[新人创作礼]活动,一起开启掘金创作之路
原理:将遮罩信息存在遮罩纹理的某一个颜色通道(RGBA)中,在Shader中将其读出,并将其合并到要遮挡的地方(也就是乘法*),因为颜色通道的值是(0,1),采集到的0的部分就会被遮挡,1的地方就会显示出来,介于两者之间的就显示出一种渐变的状态
Shader "ShaderPath/MaskShader"//shader的选择路径
{
Properties//该Shader可控的属性
{
_MainTex ("MainTex", 2D) = "white" {}//纹理贴图
_BumpTex ("BumpTex", 2D) = "white" {}//法线纹理贴图
_MaskTex ("MaskTex", 2D) = "white" {}//遮罩纹理
_MaskScale ("MaskScale", Range(0,1)) = 1 //控制遮罩的程度
_BumpScale ("BumpScale", Range(-1,1)) = 1 //凹凸程度
_DiffuseColor ("DiffuseColor",Color) = (1,1,1,1)//漫反射的主色调
_SpecularColor ("SpecularColor",Color) = (1,1,1,1)//高光反射的主色调
_Gloss ("Gloss",Range(10,100)) = 2 //光泽度(反光度) 控制高光区域的大小
}
SubShader//子着色器
{
// 以下均为默认值,详情可查看以往博客
Cull Back ZWrite On ZTest LEqual
Pass
{
Tags {"LightMode" = "ForwardBase"}
//与ENDCG相照应,将CG代码包裹
CGPROGRAM
//顶点函数定义
#pragma vertex vert
//片元函数定义
#pragma fragment frag
//引入必要的Unity库 如下面的UnityObjectToClipPos 就是库中函数
#include "UnityCG.cginc"
//引入光照库 _LightColor0需要用
#include "Lighting.cginc"
struct appdata
{
float4 vertex : POSITION;//每个顶点结构体必须有的
float3 normal : NORMAL;//定义法线
float4 tangent :TANGENT;//定义切线
float4 texcoord : TEXCOORD0;//存储第一章纹理的坐标信息
};
struct v2f
{
float3 lightDir : TEXCOORD0;
float3 viewDir : TEXCOORD1;
float4 uv : TEXCOORD2;//用于存储纹理信息
float4 pos : SV_POSITION;//每个片元结构体必须有的
};
sampler2D _MainTex;
sampler2D _BumpTex;
sampler2D _MaskTex;
float _MaskScale;
float4 _MainTex_ST;//图片的(平铺和偏移系数)如果要使图片的Tilling和Offset生效就必须定义
float4 _BumpTex_ST;//图片的(平铺和偏移系数)如果要使图片的Tilling和Offset生效就必须定义
float _BumpScale;
fixed4 _DiffuseColor;
fixed4 _SpecularColor;
float _Gloss;
v2f vert (appdata v)
{
v2f o;
o.pos = UnityObjectToClipPos(v.vertex);//把顶点从模型空间转换到剪裁空间
o.uv.xy = TRANSFORM_TEX(v.texcoord, _MainTex);//使图片对应的_ST生效,这里就是_MainTex_ST
o.uv.zw = TRANSFORM_TEX(v.texcoord, _BumpTex);//使图片对应的_ST生效,这里就是_BumpTex_ST
//这里是UnityCG.cginc 库里面定义函数,利用normal和tangent生成对应的rotation矩阵(模型空间转到切线空间的变换矩阵)
//这也是在上面必须定义normal和tangent的原因
TANGENT_SPACE_ROTATION;
o.lightDir = mul(rotation,ObjSpaceLightDir(v.vertex));//将模型顶点的光照方向转到切线空间
o.viewDir = mul(rotation,ObjSpaceViewDir(v.vertex));//将模型顶点的视角方向转到切线空间
return o;
}
fixed4 frag (v2f i) : SV_Target//返回一个RGBA到模型上
{
fixed3 lightDir = normalize(i.lightDir);
fixed3 viewDir = normalize(i.viewDir);
fixed4 packedNormal = tex2D(_BumpTex,i.uv.zw);//采样_BumpTex里面的法线信息
//UnpackNormal英文含义就是 解压法线 将法线从颜色信息里面解压出来
//这里涉及到一个知识点 为什么法线贴图是蓝色调的
//法线贴图里面法线都是存储在切线空间里面的
//详细请看文末提到的博客
fixed3 tangentNormal = UnpackNormal(packedNormal);
//切线空间的法线是单位长度为1的,所以只要求出其中两个就可以利用长度求出另一个值
tangentNormal.xy *= _BumpScale;
tangentNormal.z = sqrt(1-saturate(dot(tangentNormal.xy,tangentNormal.xy)));
fixed3 albedo = tex2D(_MainTex,i.uv.xy).rgb * _DiffuseColor;//采样主贴图的纹理颜色
//半罗伯特反射
fixed3 diffuse = _LightColor0.rgb * albedo * (1+dot(lightDir,tangentNormal))/2;
//Blinn-Phong模型高光
fixed3 halfView = normalize(lightDir + viewDir);
//采集遮罩纹理的红色通道
fixed specularMask = tex2D(_MaskTex,i.uv.xy).r * _MaskScale;
fixed3 specular = _LightColor0.rgb * _SpecularColor * pow(saturate(dot(tangentNormal,halfView)),_Gloss) *specularMask;
return fixed4(diffuse + specular,1);
}
ENDCG
}
}
}
渐变贴图如下:
导入Unity之后你会发现,这张图长这样
代码中采集的是图片的r通道,黑色0,白色1,因此就实现了下面的效果,高光部分黑色的地方被遮挡了。