第UnityShader實現(xiàn)3D翻頁效果本文實例為大家分享了UnityShader實現(xiàn)3D翻頁效果的具體代碼，供大家參考，具體內(nèi)容如下

參考文章：UnityShader使用Plane實現(xiàn)翻書效果

效果圖：

原理：Shader頂點動畫

在頂點著色器進行對頂點Y值的偏移（使用了Sin函數(shù)模擬翻頁時產(chǎn)生的彎曲），對頂點X值的偏移實現(xiàn)紙張在翻頁時的收縮（一般是不用收縮），最后對頂點進行圍繞Z軸旋轉(zhuǎn)實現(xiàn)Plane翻頁（Z軸是本例的旋轉(zhuǎn)軸，請根據(jù)你具體情況修改，上面的兩個偏移同理）。

Shader"Unlit/PaperTurnMilkShader"

Properties

//正面圖

_MainTex("Texture",2D)="white"{}

//背面圖

_SrcTex("SrcTex",2D)="white"{}

//旋轉(zhuǎn)角度

_Angle("Angle",Range(0,180))=0

//彎曲程度

_WeightY("WeightY",Range(0,3))=0.2

//收縮程度（值越大翻頁時紙張越往內(nèi)部靠攏)具體情況可測試

_WeightX("WeightX",Range(0,1))=0

//波長（值越大翻頁時的彎曲次數(shù)越多）

_WaveLength("WaveLength",Range(0,2))=0.4

SubShader

//關閉批處理（因為修改了頂點位置)

Tags{"RenderType"="Opaque""IgnoreProjector"="True""Queue"="Geometry""DisableBatching"="True"}

LOD100

//渲染正面

Pass

CullBack

CGPROGRAM

#pragmavertexvert

#pragmafragmentfrag

#include"UnityCG.cginc"

structappdata

float4vertex:POSITION;

float2uv:TEXCOORD0;

structv2f

float2uv:TEXCOORD0;

float4vertex:SV_POSITION;

sampler2D_MainTex;

float4_MainTex_ST;

float_Angle;

float_WeightY;

float_WeightX;

float_WaveLength;

v2fvert(appdatav)

v2fo;

//對頂點進行往X正方向偏移5個單位是為了離開旋轉(zhuǎn)中心點,不然翻頁時的旋轉(zhuǎn)點是會在紙張中心進行圍繞Z軸旋轉(zhuǎn)（Z軸是紙張垂直線）

v.vertex+=float4(5,0,0,0);

floats;

floatc;

//使用sincos獲取sin(弧度),cos(弧度)，radians(角度)=弧度,_Angle前加負號是控制旋轉(zhuǎn)方向，可根據(jù)DX是右手法則順時針旋轉(zhuǎn)，故應該逆向翻頁要取負數(shù)

sincos(radians(-_Angle),s,c);

//圍繞Z軸旋轉(zhuǎn)變換矩陣

float4x4rotate={

c,s,0,0,

-s,c,0,0,

0,0,1,0,

0,0,0,1

//weight：_Angle在[0,90]變換區(qū)間時，weight會從0變?yōu)?；_Angle在[90,180]變換區(qū)間時，weight會從1變?yōu)?.

//weight可理解為是剛開始翻頁（0°）到翻頁到垂直時（90°）時，對其彎曲程度從小變大；（這個是對頂點Y值影響的結果）

//同理，收縮程度也是一樣道理

floatweight=1-abs(90-_Angle)/90;

v.vertex.y+=sin(v.vertex.x*_WaveLength)*weight*_WeightY;

v.vertex.x-=v.vertex.x*weight*_WeightX;

//在進行偏移之后，再對頂點進行圍繞Z軸旋轉(zhuǎn)_Angle角度

v.vertex=mul(rotate,v.vertex);

//之后要偏移回來，因為我們已經(jīng)做完了上面的旋轉(zhuǎn)操作了

v.vertex-=float4(5,0,0,0);

o.vertex=UnityObjectToClipPos(v.vertex);

o.uv=TRANSFORM_TEX(v.uv,_MainTex);

returno;

fixed4frag(v2fi):SV_Target

fixed4col=tex2D(_MainTex,i.uv);

returncol;

ENDCG

//渲染背面(和上方渲染正面PASS唯一的差別是：片元著色器的采樣紋理改為_SrcTex(背面圖）

Pass

CullFront

CGPROGRAM

#pragmavertexvert

#pragmafragmentfrag

#include"UnityCG.cginc"

structappdata

float4vertex:POSITION;

float2uv:TEXCOORD0;

structv2f

float2uv:TEXCOORD0;

float4vertex:SV_POSITION;

sampler2D_SrcTex;

float4_MainTex_ST;

float_Angle;

float_WeightY;

float_WeightX;

float_WaveLength;

v2fvert(appdatav)

v2fo;

v.vertex+=float4(5,0,0,0);

floats;

floatc;

//使用sincos獲取sin(弧度),cos(弧度)，radians(角度)=弧度

sincos(radians(-_Angle),s,c);

//圍繞Z軸旋轉(zhuǎn)變換矩陣

float4x4rotate={

c,s,0,0,

-s,c,0,0,

0,0,1,0,

0,0,0,1

floatweight=1-abs(90-_Angle)/90;

v.vertex.y+=sin(v.vertex.x*_WaveLength)*weight*_WeightY;

v.vertex.x-=v.vertex.x*weight*_WeightX;

v.vertex=mul(rotate,v.vertex);

v.vertex-=float4(5,0,0,0);

o.vertex=UnityObjectToClipPos(v.vertex);

o.uv=TRANSFORM_TEX(v.