Unity Shader系列文章:Unity Shader目录-初级篇
Unity Shader系列文章:Unity Shader目录-中级篇
效果:
素描风格的渲染效果
原理:
使用6张素描纹理进行渲染。在渲染阶段,首先在顶点着色阶段计算逐顶点的光照,根据光照结果来决定6张纹理的混合权重,并传递给片元着色器。然后,在片元着色器中根据这些权重来混合6张纹理的采样结果。
6张素描纹理:
hatch_0.jpg
hatch_1.jpg
hatch_2.jpg
hatch_3.jpg
hatch_4.jpg
hatch_5.jpg
shader代码:
// 素描风格效果
Shader "Custom/Hatching"
{
Properties
{
_Color ("Color Tint", Color) = (1, 1, 1, 1)
_TileFactor ("Tile Factor", Float) = 1 // 纹理的平铺系数,越大则素描线条越密
_Outline ("Outline", Range(0, 1)) = 0.1 // 描边宽度
_Hatch0 ("Hatch 0", 2D) = "white" { }// 6张素描纹理
_Hatch1 ("Hatch 1", 2D) = "white" { }
_Hatch2 ("Hatch 2", 2D) = "white" { }
_Hatch3 ("Hatch 3", 2D) = "white" { }
_Hatch4 ("Hatch 4", 2D) = "white" { }
_Hatch5 ("Hatch 5", 2D) = "white" { }
}
SubShader
{
Tags { "RenderType" = "Opaque" "Queue" = "Geometry" }
// 通过UsePass语义,指明调用之前写好的Pass渲染轮廓线(Pass代码详见之前文章《Unity Shader 卡通渲染效果》)
UsePass "Custom/ToonShading/OUTLINE"
// Base Pass 计算平行光、环境光
Pass
{
Tags { "LightMode" = "ForwardBase" }
CGPROGRAM
// 编译指令,保证在pass中得到Pass中得到正确的光照变量
#pragma multi_compele_fwdbase
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"
#include "Lighting.cginc"
#include "AutoLight.cginc"
#include "UnityShaderVariables.cginc"
fixed4 _Color;
float _TileFactor;
sampler2D _Hatch0;
sampler2D _Hatch1;
sampler2D _Hatch2;
sampler2D _Hatch3;
sampler2D _Hatch4;
sampler2D _Hatch5;
// 应用传递给定点着色器的数据
struct a2v
{
float4 vertex: POSITION; // 语义: 顶点坐标
float3 normal: NORMAL; // 语义: 法线
float4 texcoord: TEXCOORD0; // 语义: 纹理坐标
float4 tangent: TANGENT; // 语义: 切线
};
// 顶点着色器传递给片元着色器的数据
struct v2f
{
float4 pos: SV_POSITION; // 语义: 裁剪空间的顶点坐标
float2 uv: TEXCOORD0;
fixed3 hatchWeights0: TEXCOORD1; // 存储6张纹理的权重
fixed3 hatchWeights1: TEXCOORD2; // 存储6张纹理的权重
float3 worldPos: TEXCOORD3;
SHADOW_COORDS(4) // 内置宏:声明一个用于对阴影纹理采样的坐标 (这个宏参数需要是下一个可用的插值寄存器的索引值,这里是4)
};
// 顶点着色器
v2f vert(a2v v)
{
v2f o;
// 将顶点坐标从模型空间变换到裁剪空间
// 等价于o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
o.pos = UnityObjectToClipPos(v.vertex);
o.uv = v.texcoord.xy * _TileFactor;
fixed3 worldLightDir = normalize(WorldSpaceLightDir(v.vertex));
fixed3 worldNormal = UnityObjectToWorldNormal(v.normal);
// 计算漫反射系数
fixed diff = max(0, dot(worldLightDir, worldNormal));
o.hatchWeights0 = fixed3(0, 0, 0);
o.hatchWeights1 = fixed3(0, 0, 0);
// 将漫反射系数diff缩放到[O, 7] 范围
// 们把[O, 7] 区间均匀划分为7个子区间 ,通过判断 hatchFactor 所处的子区间来计算对应的纹理混合权重。
float hatchFactor = diff * 7;
if (hatchFactor > 6)
{
// 纯白色,什么也不做
}
else if (hatchFactor > 5)
{
o.hatchWeights0.x = hatchFactor - 5;
}
else if (hatchFactor > 4)
{
o.hatchWeights0.x = hatchFactor - 4;
o.hatchWeights0.y = 1 - o.hatchWeights0.x;
}
else if (hatchFactor > 3)
{
o.hatchWeights0.y = hatchFactor - 3;
o.hatchWeights0.z = 1 - o.hatchWeights0.y;
}
else if (hatchFactor > 2)
{
o.hatchWeights0.z = hatchFactor - 2;
o.hatchWeights1.x = 1 - o.hatchWeights0.z;
}
else if (hatchFactor > 1)
{
o.hatchWeights1.y = hatchFactor;
o.hatchWeights1.z = 1 - o.hatchWeights1.y;
}
else
{
o.hatchWeights1.y = hatchFactor;
o.hatchWeights1.z = 1.0 - o.hatchWeights1.y;
}
o.worldPos = mul(unity_ObjectToWorld, v.vertex).xyz;
// 内置宏:用于计算声明的阴影纹理坐标
TRANSFER_SHADOW(o);
return o;
}
// 片元着色器
fixed4 frag(v2f i): SV_TARGET
{
// 采样素描纹理,并和它们对应的权重值相乘得到每张纹理的采样颜色
fixed4 hatchTex0 = tex2D(_Hatch0, i.uv) * i.hatchWeights0.x;
fixed4 hatchTex1 = tex2D(_Hatch1, i.uv) * i.hatchWeights0.y;
fixed4 hatchTex2 = tex2D(_Hatch2, i.uv) * i.hatchWeights0.z;
fixed4 hatchTex3 = tex2D(_Hatch3, i.uv) * i.hatchWeights1.x;
fixed4 hatchTex4 = tex2D(_Hatch4, i.uv) * i.hatchWeights1.y;
fixed4 hatchTex5 = tex2D(_Hatch5, i.uv) * i.hatchWeights1.z;
// 计算纯白在渲染中的贡献度,通过从1中减去所有6纹理的权重来得到的。
// 是因为素描中往往有留白的部分,一般在最后的渲染中光照最亮的部分是纯白色的
fixed4 whiteColor = fixed4(1, 1, 1, 1) * (1 - i.hatchWeights0.x - i.hatchWeights0.y - i.hatchWeights0.z -
i.hatchWeights1.x - i.hatchWeights1.y - i.hatchWeights1.z);
fixed4 hatchColor = hatchTex0 + hatchTex1 + hatchTex2 + hatchTex3 + hatchTex4 + hatchTex5 + whiteColor;
// 计算阴影值和光照衰减
UNITY_LIGHT_ATTENUATION(atten, i, i.worldPos);
return fixed4(hatchColor.rgb * _Color.rgb * atten, 1);
}
ENDCG
}
}
FallBack "Diffuse"
}