Shader頂點動畫實現波浪效果
阿新 • • 發佈:2018-11-07
首先要知道頂點函式中的一個頂點會包含以下資訊:
- float3型別的頂點法線方向
- float3型別的頂點位置
- 甚至可能包含這個頂點的顏色資訊(float4型別,注意:匯入模型的預設材質不會顯示頂點顏色的,我們需要自己編寫一個著色器提取頂點顏色)
(參考官方文件: https://docs.unity3d.com/Manual/SL-VertexProgramInputs.html)
然後是使用正弦波來動態修改網格上每個頂點的位置,程式碼:
Shader "Sam'Shader程式設計/頂點動畫(波形上下)" { Properties{ _MainTex("主貼圖(RGB)", 2D) = "white"{} _TintAmount("Tint Amount" ,Range(0,1)) = 0.5 _ColorA("ColorA", Color) = (1,1,1,1) _ColorB("ColorB", Color) = (1,1,1,1) _Speed("Wave Speed", Range(0.1,80)) = 5 _Frequency("Wave Frequency", Range(0,5)) = 2 _Amplitude("Wave Amplitude", Range(-1,1)) = 1 } SubShader{ //Tags{"RenderMode" = "Opaque"} Pass{ CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma target 3.0 #include "UnityCG.cginc" sampler2D _MainTex; float4 _MainTex_ST; float _TintAmount; fixed4 _ColorA; fixed4 _ColorB; float _Speed; float _Frequency; float _Amplitude; struct appdata { float4 texcoord : TEXCOORD0; float4 vertex : POSITION;//頂點位置 //float3 normal : NORMAL; }; struct v2f { float2 uv : TEXCOORD1; float3 vertColor : TEXCOORD2; float4 vertex : SV_POSITION; }; v2f vert(appdata v) { v2f o; float time = _Time.y * _Speed; float waveValueA = sin(time + v.vertex.x *_Frequency)* _Amplitude; //sin(time + v.vertex.x) * _Amplitude;// + v.vertex.y + v.vertex.z //**2 得出的時間正弦值用的xyz(其中之一時) 不能與次出的因子為相同的軸 如:float3(v.vertex.x* waveValueA, v.vertex.y, v.vertex.z); //***或者 時間正弦值 直接用xyz的三個值相加計算 如shader頂點動畫(波形水平) 中 v.vertex.xyz = float3(v.vertex.x, v.vertex.y + waveValueA, v.vertex.z); //v.vertex = float4(v.vertex.x, v.vertex.y* waveValueA, v.vertex.z, v.vertex.w); o.vertex = UnityObjectToClipPos(v.vertex); o.uv = TRANSFORM_TEX(v.texcoord, _MainTex); // uv流動效果 //o.uv += float2(0, time); // 顏色 //o.vertColor = float3(waveValueA, waveValueA, waveValueA); return o; } fixed4 frag(v2f i) : SV_Target{ fixed4 col = tex2D(_MainTex, i.uv); float3 tintColor = lerp(_ColorA, _ColorB, i.vertColor).rgb; col = fixed4(col.rgb * (tintColor * _TintAmount), col.a); return col; } ENDCG } } }
效果(沒怎麼細調,可能看上去比較low):