其实这个也是 《Shader 入门精要里面的》，我单独把里面的消融部分提出来再看，其实思路就比较简单了。
先提取噪声图的红色通道和我们设定的控制参数相减，然后 clip，就可以实现下面的效果了。
消融1
Shader "ZhangQr/Dissolve"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_BurnTex("Burn Texture",2D) = "white" {}
_BurnLevel("Burn Level", Range(0,1)) = 1
_Length("Length",Range(0,1)) = 0
_BurnColor1("BurnColor1",Color) = (1,1,1)
_BurnColor2("BurnColor2",Color) = (1,1,1)
}
SubShader
{
Tags { "RenderType"="Opaque" }
LOD 100
Pass
{
Cull Off
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0; // xy 存储主纹理，zw 存储燃烧贴图纹理
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
sampler2D _BurnTex;
float _BurnLevel;
float _Length;
fixed3 _BurnColor1;
fixed3 _BurnColor2;
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
{
fixed3 burn = tex2D(_BurnTex,i.uv.xy);
clip(burn.r - _BurnLevel); // 被 clip 之后，留下的都是大于 0 的值，并且离消融中心越近的值越小，_Length 就是比较的这个
fixed4 col = tex2D(_MainTex, i.uv);[图片上传失败...(image-d7fada-1608271082911)]
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
剩下来的 burn.r - _BurnLevel 其实是一个 [0-1] 的值了，并且离燃烧边缘越近，值就越小，那我们可以通过这个值来混合边缘和主帖图。
消融2
Shader "ZhangQr/Dissolve"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_BurnTex("Burn Texture",2D) = "white" {}
_BurnLevel("Burn Level", Range(0,1)) = 1
_Length("Length",Range(0,1)) = 0
_BurnColor1("BurnColor1",Color) = (1,1,1)
_BurnColor2("BurnColor2",Color) = (1,1,1)
}
SubShader
{
Tags { "RenderType"="Opaque" }
LOD 100
Pass
{
Cull Off
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float4 uv : TEXCOORD0; // xy 存储主纹理，zw 存储燃烧贴图纹理
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
sampler2D _BurnTex;
float4 _BurnTex_ST;
float _BurnLevel;
float _Length;
fixed3 _BurnColor1;
fixed3 _BurnColor2;
v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv.xy = TRANSFORM_TEX(v.uv, _MainTex);
o.uv.zw = TRANSFORM_TEX(v.uv, _BurnTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
fixed3 burn = tex2D(_BurnTex,i.uv.zw);
clip(burn.r - _BurnLevel); // 被 clip 之后，留下的都是大于 0 的值，并且离消融中心越近的值越小，_Length 就是比较的这个
fixed4 col = tex2D(_MainTex, i.uv.xy);
fixed3 gradient = smoothstep(0,_Length,burn.r - _BurnLevel);
fixed3 finalColor = lerp(_BurnColor1,col,gradient);
UNITY_APPLY_FOG(i.fogCoord, col);
return fixed4(finalColor,1);
}
ENDCG
}
}
}
如果上面就是想要的效果，那么就可以结束了，下面使用 pow 来让烧焦的效果更真实。
fixed4 frag (v2f i) : SV_Target
{
fixed3 burn = tex2D(_BurnTex,i.uv.zw);
clip(burn.r - _BurnLevel); // 被 clip 之后，留下的都是大于 0 的值，并且离消融中心越近的值越小，_Length 就是比较的这个
fixed4 col = tex2D(_MainTex, i.uv.xy);
fixed3 gradient = smoothstep(0,_Length,burn.r - _BurnLevel);
fixed3 finalColor = lerp(_BurnColor1,_BurnColor2,gradient);
finalColor = pow(finalColor,5); // 让烧焦的效果更真实
UNITY_APPLY_FOG(i.fogCoord, col);
return fixed4(finalColor,1);
}
加了 pow
没加 pow
现在是两种烧焦的颜色，下面要在烧焦边缘以外的地方让物体原本的颜色显现出来。可以理解为一共是分为三层，最里面那层是烧焦颜色1，接着是烧焦的颜色2，最外面是物体原本的颜色。_Length 是用来控制最里面那一层和中间那层的分界线，那需要再加一个 _Length2 来区分中间那一层和最外面那一层。
烧焦
可以看到最里面是黄色，然后是红黑的，最后是木纹的颜色。代码如下：
fixed4 frag (v2f i) : SV_Target
{
fixed3 burn = tex2D(_BurnTex,i.uv.zw);
clip(burn.r - _BurnLevel); // 被 clip 之后，留下的都是大于 0 的值，并且离消融中心越近的值越小，_Length 就是比较的这个
fixed4 col = tex2D(_MainTex, i.uv.xy);
fixed3 gradient = smoothstep(0,_Length,burn.r - _BurnLevel);
fixed3 burnColor = lerp(_BurnColor1,_BurnColor2,gradient);
burnColor = pow(burnColor,5);
//fixed3 gradient2 = _BurnLevel == 0 ? 1 : smoothstep(0,_Length2,burn.r - _BurnLevel); // 在 _BurnLevel == 0 的时候会有一点中间的颜色
fixed3 gradient2 = step(0.0001,_BurnLevel) * (1-smoothstep(0,_Length2,burn.r - _BurnLevel)); // 在 _BurnLevel == 0 的时候会有一点中间的颜色
burnColor = lerp(col,burnColor,gradient2);
UNITY_APPLY_FOG(i.fogCoord, col);
return fixed4(burnColor,1);
}
如果上面不对 _BurnLevel 单独判 0 的话，会出现下面这种情况：
_BurnLevel = 0
