內(nèi)置變量
紋理動畫
序列幀動畫
Shader "ZhangQr/Sequence"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_HorizontalAmount("HorizontalAmount",Range(1,10)) = 8
_VerticalAmount("VerticalAmount",Range(1,10)) = 8
_Speed("Speed",Range(0,100)) = 1
}
SubShader
{
Tags { "RenderType"="Transparent" "Queue" = "Transparent"}
Pass
{
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha
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;
float _HorizontalAmount;
float _VerticalAmount;
float _Speed;
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
{
float time = floor(_Time.y * _Speed);
float row = floor(time/_VerticalAmount); // 第多少行 办绝，row 應(yīng)該屬于 [0-正無窮],所以需要將 Wrap Mode 設(shè)置為 Repeat
float column = time - _VerticalAmount * row; // 第多少列 ， column 應(yīng)該屬于 [0-_(VerticalAmount-1)] 循環(huán)
float2 uv = float2(i.uv.x / _VerticalAmount,i.uv.y / _HorizontalAmount); 將原來的 uv 壓縮到左下角那一小塊
uv.x += column / _VerticalAmount; // 再根據(jù)行列進行偏移
uv.y -= row / _HorizontalAmount;
fixed4 col = tex2D(_MainTex,uv);
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
上面的代碼的運行效果就是
在這個代碼中姚淆，我們是不關(guān)心動畫開始時間的孕蝉，也就是說如果從 3 秒開始運行，那么起始幀可能是左下角腌逢，從 4 秒開始運行的話起始幀可能是右下角降淮。對于爆炸之類的需要從左上角到右下角的執(zhí)行順序的就很不友好。而且即使是從 0 秒開始運行搏讶，也是從左下角開始循環(huán)佳鳖。
Parallax
游戲里面經(jīng)常會有前景和后景移動速度不一樣產(chǎn)生景深效果纳本，叫做 Parallax，可以用代碼寫腋颠，現(xiàn)在又學會了直接使用 Shader 來寫繁成，原理很簡單，直接看代碼就可以了淑玫。值得注意的就是使用前景的透明度來混合才能讓前面的透明部分顯示為后面的巾腕。
Shader "ZhangQr/Parallax"
{
Properties
{
_MainTex ("Base Layer (RGB)", 2D) = "white" {}
_DetailTex ("2nd Layer (RGB)", 2D) = "white" {}
_ScrollX ("Base layer Scroll Speed", Float) = 1.0
_Scroll2X ("2nd layer Scroll Speed", Float) = 1.0
_Multiplier ("Layer Multiplier", Float) = 1
}
SubShader
{
Tags { "RenderType"="Transparent" "Queue" = "Transparent" }
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha
LOD 100
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
// make fog work
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 texcoord : TEXCOORD0;
};
struct v2f
{
float4 uv : TEXCOORD0;
UNITY_FOG_COORDS(1)
float4 pos : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
sampler2D _DetailTex;
float4 _DetailTex_ST;
float _ScrollX;
float _Scroll2X;
float _Multiplier;
v2f vert (appdata v)
{
v2f o;
o.pos = UnityObjectToClipPos(v.vertex);
o.uv.xy = TRANSFORM_TEX(v.texcoord, _MainTex) + frac(float2(_ScrollX, 0.0) * _Time.y);
o.uv.zw = TRANSFORM_TEX(v.texcoord, _DetailTex) + frac(float2(_Scroll2X, 0.0) * _Time.y);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
fixed4 firstLayer = tex2D(_MainTex,i.uv.xy);
fixed4 secondLayder = tex2D(_DetailTex,i.uv.zw);
fixed4 col = lerp(firstLayer,secondLayder,secondLayder.a);
col *= _Multiplier;
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
如果是 2D 卷軸游戲，感覺隨著人物的移動來調(diào)節(jié)速度比較好絮蒿，比如人物不動的時候背景也應(yīng)該靜止尊搬。你也可以做多層 Parallax ，但不能在同一張圖片上做前景土涝。
頂點動畫
sin 升 sin 落
其實重點都在頂點著色器佛寿，直接看式子的話會覺得有點突然，但如果拋棄書上的式子直接觀察現(xiàn)象來自己寫的話但壮，反而更好理解一些冀泻。
Shader "Unlit/Water"
{
Properties
{
_MainColor("Color",Color) = (1,1,1,1)
_MainTex ("Texture", 2D) = "white" {}
_Amplitude("Amplitude",float) = 1
_Frequency("Frequency",float) = 1
_XSpeed("XSpeed",float) = 1
_Cross("Cross",float) = 1
_Speed("Speed",float) = 1
}
SubShader
{
Tags { "RenderType"="Transparent" "Queue" = "Transparent" "DisableBatching" = "True" }
Cull Off
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha
LOD 100
Pass
{
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;
fixed4 _MainColor;
float4 _MainTex_ST;
float _Amplitude;
float _Frequency;
float _XSpeed;
float _Cross;
float _Speed;
v2f vert (appdata v)
{
v2f o;
float3 offset = (0.0,0.0,0.0);
offset.x = sin(_Time.y * _XSpeed + v.vertex.z * _Frequency + v.vertex.x * _Cross) * _Amplitude;
o.vertex = UnityObjectToClipPos(v.vertex + offset);
o.uv = TRANSFORM_TEX(float2(v.uv.x , v.uv.y + _Time.y * _Speed), _MainTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
// sample the texture
fixed4 col = tex2D(_MainTex, i.uv) * _MainColor;
// apply fog
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
首先，這個模型不能直接使用 Plane蜡饵，因為它的點數(shù)太少了弹渔，效果會非常僵硬
首先，我們要讓模型上每個點的 local x 坐標的偏移變成一個 sin 曲線溯祸，這么寫就好了肢专，只受到 z 軸（local 的 z 應(yīng)該是世界的 x）和時間的影響
offset.x = sin(_Time.y + v.vertex.z);，效果如下：
只看最左邊的某一個點焦辅，會發(fā)現(xiàn)他是在上下移動博杖，準確來說是按照 sin(t) 的值做上下移動，但這個振幅太大了筷登，所以再加一個
_Amplitude 參數(shù)把振幅降下來：offset.x = sin(_Time.y + v.vertex.z)* _Amplitude;剃根，效果如下：
現(xiàn)在振幅降下來了，屏幕中大概只有只有一個多一點點的 sin 周期仆抵，這個參數(shù)應(yīng)該也可以調(diào)整跟继，其實就是控制 v.vertex.z，所以再加一個參數(shù) _Frequency 來控制頻率镣丑，offset.x = sin(_Time.y + v.vertex.z * _Frequency)* _Amplitude; 如下所示：
然后從視覺效果來看舔糖，這個波浪移動的太慢了，從數(shù)學角度來說莺匠，就是還需要加一個控制時間快慢的參數(shù)金吗，_XSpeed，offset.x = sin(_Time.y * _XSpeed+ v.vertex.z * _Frequency)* _Amplitude; 效果如下：
現(xiàn)在還差一點，這個河流是同胖同瘦的摇庙，應(yīng)該最好下面的 sin 曲線跟上面有一點交錯的感覺旱物，其實就是根據(jù) local 的 x 再進行一點控制，offset.x = sin(_Time.y * _XSpeed + v.vertex.z * _Frequency + v.vertex.x * _Cross) * _Amplitude;卫袒，效果如下：
現(xiàn)在所有參數(shù)都可控宵呛，可以調(diào)出一開始的效果了。
再回頭看書里面的代碼
v2f vert(a2v v) {
v2f o;
float4 offset;
offset.yzw = float3(0.0, 0.0, 0.0);
offset.x = sin(_Frequency * _Time.y + v.vertex.x * _InvWaveLength + v.vertex.y * _InvWaveLength + v.vertex.z * _InvWaveLength) * _Magnitude;
o.pos = mul(UNITY_MATRIX_MVP, v.vertex + offset);
o.uv = TRANSFORM_TEX(v.texcoord, _MainTex);
o.uv += float2(0.0, _Time.y * _Speed);
return o;
}
會發(fā)現(xiàn)是差不多夕凝，因為他是把上面的 _Cross 和 _Frequency 用一個參數(shù)來控制了宝穗，并且還用這個控制了 local y，但因為這個是一個平面码秉，所以 local y 是沒有作用的逮矛。
廣告牌
因為在 Scene 窗口，我們的觀察方向就是攝像機的方向转砖，所以直接在 Scene 窗口做測試是一樣的须鼎，效果就是這個廣告牌一直都是面向鏡頭的，可以看三個本地坐標的方向府蔗，始終沒有變過晋控。其實原理理解了之后也挺簡單的，首先我們需要構(gòu)建一個新的坐標系礁竞，一個軸向是觀察點到模型中心點 x糖荒，為什么呢，因為我們需要模型面朝我們模捂，那么肯定需要這一個軸向，那其實已經(jīng)結(jié)束了蜘矢，我們有無數(shù)種方法再構(gòu)造出另外兩個軸向狂男，只要三個軸都互相垂直就可以了。下面是一個原始的圖品腹，用的是 Plane 直接把貼圖拖上去岖食。
可以看到我們是希望 Y (綠)軸成為上面提到的 x 軸，想象以下面的動圖是另外兩個軸的所有可能情況舞吭。
此時可以發(fā)現(xiàn)泡垃，其實還需要讓箭頭盡量看起來是朝上的，在觀察一下就會發(fā)現(xiàn)羡鸥，本地坐標的 Y 軸是不變的蔑穴，而我們希望的就是箭頭方向和 Y 軸方向盡量保持一個銳角的狀態(tài)，此時無數(shù)種可能的另外兩個軸被限制住了惧浴，現(xiàn)在 Y 軸和 x 軸不是垂直的存和，我們先用這個不垂直的平面計算出真正的 右軸 的位置
float4 localCameraPos = mul(unity_WorldToObject,float4(_WorldSpaceCameraPos,1)); // 攝像機在模型坐標的位置
float3 center = (0,0,0);
float3 normal = normalize(localCameraPos - center);
float3 right = normalize(cross(float3(0,1,0),normal)); // 計算右方向軸
這里需要注意的是 float3(0,1,0) 是不變的，如果模型沒有旋轉(zhuǎn)的話，那么就是世界坐標中朝上的方向捐腿，現(xiàn)在 右軸 出來了纵朋，我們再根據(jù) x 軸和 右軸 計算真正的 up 軸，后面就沒什么好說的了茄袖，完整代碼如下：
// Upgrade NOTE: replaced '_World2Object' with 'unity_WorldToObject'
Shader "ZhangQr/Billborad"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
}
SubShader
{
Tags { "RenderType"="Transparent" "Queue"="Transparent" "DisableBatching"="True" }
Cull Off
Blend SrcAlpha OneMinusSrcAlpha
LOD 100
Pass
{
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;
v2f vert (appdata v)
{
v2f o;
float4 localCameraPos = mul(unity_WorldToObject,float4(_WorldSpaceCameraPos,1)); // 攝像機在模型坐標的位置
float3 center = (0,0,0);
float3 normal = normalize(localCameraPos - center);
float3 right = normalize(normal.z>0.999f ? cross(float3(1,0,0),normal):cross(float3(0,1,0),normal)); // 計算右方向軸
float3 up = normalize(cross(normal,right));
float3 originDir = v.vertex - center; // 計算出這個點原來距離模型中心點的距離
v.vertex.xyz = center - originDir.z * up + center + originDir.y * normal + center - originDir.x * right;
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 texture
fixed4 col = tex2D(_MainTex, i.uv);
// apply fog
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}
加了一個如果 normal 軸跟 Y 軸一樣的話操软，箭頭就朝著 X 軸方向，然后坐標轉(zhuǎn)化的時候要注意宪祥，比如箭頭方向其實是 -z 軸寺鸥，然后 -z 軸你是希望讓他變成新構(gòu)造的三個軸中的 up軸，那么就應(yīng)該寫成 center - originDir.z * up品山。
最后說一下胆建，批處理，書上說的是在應(yīng)用頂點動畫的 Shader 中如果不關(guān)閉批處理的話肘交，會丟失模型的本地坐標之類的笆载，雖然沒懂什么意思，但可以不關(guān)批處理多復(fù)制一個 Plane 試試涯呻，就會發(fā)現(xiàn)失效了凉驻，單獨一個的時候沒啥問題。
