【Unity学习】使用UnityShader的纹理动画效果实现滚动的背景

这次学习基本抄书了

Unity Shader内置的时间变量

名称 类型 描述
_Time float4 t为从加载到现在的时间,4个分量: (t/20, t, t*2, t*3)
_SinTime float4 4个分量: (sin(t/8), sin(t/4), sin(t/2), sin(t))
_CosTime float4 4个分量: (cos(t/8), cos(t/4), cos(t/2), cos(t))
unity_DeltaTime float4 dt是时间增量,4个分量: (dt, 1/dt, smoothDt, 1/smoothDt)

使用UnityShader的纹理动画效果实现滚动的背景

创建一个材质,将其赋给一个四边形(Quad)。四边形就是我们的游戏背景了。

然后给材质编写shader:

Shader "Unity Shaders Book/Chapter 11/Scrolling Background" {
    Properties {
        _MainTex ("Base Layer (RGB)", 2D) = "white" {}   // 背景1,远处的
        _DetailTex ("2nd Layer (RGB)", 2D) = "white" {}   // 背景2,近处的
        _ScrollX ("Base layer Scroll Speed", Float) = 1.0  // 背景1的滚动速度
        _Scroll2X ("2nd layer Scroll Speed", Float) = 1.0  // 背景2的滚动速度
        _Multiplier ("Layer Multiplier", Float) = 1  // 背景的亮度
    }
    SubShader {
        Tags { "RenderType"="Opaque" "Queue"="Geometry"}  

        Pass { 
            Tags { "LightMode"="ForwardBase" }

            CGPROGRAM

            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            // 申明与Properties相同的变量
            sampler2D _MainTex;
            sampler2D _DetailTex;
            float4 _MainTex_ST;
            float4 _DetailTex_ST;
            float _ScrollX;
            float _Scroll2X;
            float _Multiplier;

            struct a2v {
                float4 vertex : POSITION;
                float4 texcoord : TEXCOORD0;
            };

            struct v2f {
                float4 pos : SV_POSITION;
                float4 uv : TEXCOORD0;    // uv中xy变量记录背景1,zw变量记录背景2
            };

            // 顶点着色器中实现图像的移动,用速度*_Time.y来实现
            v2f vert (a2v v) {
                v2f o;
                o.pos = UnityObjectToClipPos(v.vertex);
                // 背景1,坐标位置+横向移动量
                o.uv.xy = TRANSFORM_TEX(v.texcoord, _MainTex) + frac(float2(_ScrollX, 0.0) * _Time.y);
                // 背景2,坐标位置+横向移动量
                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 secondLayer = tex2D(_DetailTex, i.uv.zw);
                // 使用cg语言的lerp函数,即使用第二层纹理的透明通道来混合两张纹理
                fixed4 c = lerp(firstLayer, secondLayer, secondLayer.a);
                c.rgb *= _Multiplier;

                return c;
            }

            ENDCG
        }
    }
    FallBack "VertexLit"
}

在材质中将背景1和背景2添上去
这样动画就动起来了

猜你喜欢

转载自blog.csdn.net/qq_32418469/article/details/81331305