Unity Shader實現動態過場切換圖片效果

本文實例為大傢分享瞭Unity Shader實現動態過場切換圖片的具體代碼,供大傢參考,具體內容如下

一、簡單介紹

Shader Language的發展方向是設計出在便攜性方面可以和C++、Java等相比的高級語言,“賦予程序員靈活而方便的編程方式”,並“盡可能的控制渲染過程”同時“利用圖形硬件的並行性,提高算法效率”。

本文介紹,如何使用 shader ,動態過場形式切換圖片的一點簡單效果。

二、實現原理

1、通過時間疊加判斷,當 值小於 主圖 uv 的時候,進行切換圖的渲染

// 過場切換的位置
float curPos = _Time.y*_Speed;
 
if(curPos < i.uv.x){
 col = tex2D(_CutTex,i.uv);
}

三、註意事項

1、 當小於 x,渲染_CutTex(開始都是小於 x的,開始渲染_CutTex), 隨著時間變化,切換為 _MainTex

四、效果預覽

五、實現步驟

1、打開Unity,新建一個工程

2、導入素材,和新建shader,並對應新建材質

3、編寫好shader,把材質對應賦值

4、場景中添加一個 Quad ,並把材質賦給Quad,用來顯示

5、運行場景,效果如上

六、關鍵代碼

Shader "Unlit/CutEffect"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
  _CutTex("Cut Tex",2D)="white"{}
 
  // 切換速度
  _Speed("speed",Range(-1,1))=0.2
 
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" }
        LOD 100
 
        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
        
 
            #include "UnityCG.cginc"
 
            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };
 
            struct v2f
            {
                float2 uv : TEXCOORD0;
    
                float4 vertex : SV_POSITION;
            };
 
            sampler2D _MainTex;
            float4 _MainTex_ST;
   sampler2D _CutTex;
   float _Speed;
 
            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
  
                return o;
            }
 
            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex,i.uv);
                
 
    // 過場切換的位置
    float curPos = _Time.y*_Speed;
    // 當小於 x,渲染_CutTex(開始都是小於 x的,開始渲染_CutTex), 
    // 隨著事件變化,切換為 _MainTex
    if(curPos < i.uv.x){
     col = tex2D(_CutTex,i.uv);
    }
    
 
                return col;
            }
            ENDCG
        }
    }
}

以上就是本文的全部內容,希望對大傢的學習有所幫助,也希望大傢多多支持WalkonNet。

推薦閱讀: