顶点动画shader要关闭动态合批”DisableBatching”=”True”；

序列帧动画

202201051447162

纹理取样有Scale和offset，将上面的png图当做纹理，每次按间隔时间偏移取样纹理的起点；

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
fixed4 frag (v2f i) : SV_Target
{
    //Time四个分量 y代表1t,floor向上取整
    float time = floor(_Time.y * _Speed);
    float row = floor(time/_HorizontalAmount);
    float column = floor(time/_VerticalAmount);
    
    //播放顺序，Unity左下角原点,所以-row,这行是计算简化的结果,没有实际意义
    half2 uv = i.uv + half2(column,-row);
    uv.x /= _HorizontalAmount;
    uv.y /= _VerticalAmount;

    fixed4 color = tex2D(_MainTex,uv)*_Color;
    return color; 
}

dadfa

滚动卷轴背景

202201051446041

两张背景图根据时间横向左移动； baselayer移动速度慢，展现一种远景的效果；

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
ZWrite Off
Blend SrcAlpha OneMinusSrcAlpha

v2f vert (appdata v)
{
    v2f o;
    o.vertex = UnityObjectToClipPos(v.vertex);
    
    //frac(v) —— return v - floor(v);
    o.uv.xy = TRANSFORM_TEX(v.uv, _MainTex) + frac(float2(_ScrollX, 0.0)* _Time.y);
    o.uv.zw = TRANSFORM_TEX(v.uv, _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);
	
    //根据外层的透明度混合颜色;
    fixed4 color = lerp(firstLayer,secondLayer,secondLayer.a);

    return fixed4(color.rgb * _Multiplier,1.0);
}

hzbfa

平面水波纹+阴影

image-20220105150738367

将以Quad当成波，有振幅，波长，频率；

通过参数调整，控制水波的起伏，速度，水波的大小；

顶点动画的阴影要跟动，需要在ShadowCasterpass中也做顶点偏移；

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
Shader "MyShader/WaterWave" {
	Properties {
		_MainTex ("Main Tex", 2D) = "white" {}
		_Color ("Color Tint", Color) = (1, 1, 1, 1)
		_Magnitude ("Distortion Magnitude", Float) = 1
 		_Frequency ("Distortion Frequency", Float) = 1
 		_InvWaveLength ("Distortion Inverse Wave Length", Float) = 10
 		_Speed ("Speed", Float) = 0.5
	}
	SubShader {
		// Need to disable batching because of the vertex animation
		Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "DisableBatching"="True"}
		
		Pass {
			Tags { "LightMode"="ForwardBase" }
			
			ZWrite Off
			Blend SrcAlpha OneMinusSrcAlpha
			Cull Off
			
			CGPROGRAM  
			#pragma vertex vert 
			#pragma fragment frag
			
			#include "UnityCG.cginc" 
			
			sampler2D _MainTex;
			float4 _MainTex_ST;
			fixed4 _Color;
			float _Magnitude;
			float _Frequency;
			float _InvWaveLength;
			float _Speed;
			
			struct a2v {
				float4 vertex : POSITION;
				float4 texcoord : TEXCOORD0;
			};
			
			struct v2f {
				float4 pos : SV_POSITION;
				float2 uv : TEXCOORD0;
			};
			
			v2f vert(a2v v) {
				v2f o;

                float offset = sin(_Frequency * _Time.y + v.vertex.z * _InvWaveLength)* _Magnitude;
                v.vertex.x += offset;
				o.pos = UnityObjectToClipPos(v.vertex);
				
				o.uv = TRANSFORM_TEX(v.texcoord, _MainTex);
				o.uv +=  float2(0.0, _Time.y * _Speed);
				
				return o;
			}
			
			fixed4 frag(v2f i) : SV_Target {
				fixed4 c = tex2D(_MainTex, i.uv);
				c.rgb *= _Color.rgb;
				
				return c;
			} 
			
			ENDCG
		}

		//ShadowCaster
		Pass{
			Tags{"LightMode" = "ShadowCaster"}
			CGPROGRAM
			#pragma vertex vert
			#pragma fragment frag

			#pragma multi_compile_shadowcaster

			#include "UnityCG.cginc"

			float _Magnitude;
			float _Frequency;
			float _InvWaveLength;
			float _Speed;

			struct v2f { 
			    V2F_SHADOW_CASTER;
			};

			v2f vert(appdata_base v){
				v2f o;
				float offset = sin(_Frequency * _Time.y + v.vertex.z * _InvWaveLength)* _Magnitude;
                v.vertex.x += offset;
				TRANSFER_SHADOW_CASTER_NORMALOFFSET(o)
				return o;
			}
			
			float4 frag(v2f i): SV_Target {
				SHADOW_CASTER_FRAGMENT(i)
			}

			ENDCG
		}
	}
	FallBack "Diffuse"
}

image-20220105144616001

公告牌效果

2D的纸片永远朝向摄像机；

根据观察方向变换顶点；

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "DisableBatching"="True"}

Pass
{
    Tags {"LightMode" = "ForwardBase"}
    ZWrite Off
    Cull Off
    Blend SrcAlpha OneMinusSrcAlpha

    CGPROGRAM
    #pragma vertex vert
    #pragma fragment frag

    #include "UnityCG.cginc"

    struct appdata
    {
        float4 vertex : POSITION;
        float2 uv : TEXCOORD0;
    };

    struct v2f
    {
        float2 uv : TEXCOORD0;
        float4 pos : SV_POSITION;
    };

    sampler2D _MainTex;
    float4 _MainTex_ST;
    fixed4 _Color;
    float _VerticalBillboard;

    //根据视角方向，和规定上方向来调整本地模型空间坐标系，将顶点偏移
    v2f vert (appdata v)
    {
        v2f o;
        //模型空间下中心为锚点，计算视角方向
        float3 center = float3(0,0,0);
        float3 viewer = mul(unity_WorldToObject,float4(_WorldSpaceCameraPos,1));

        //计算法线，乘以约束值
        float3 normalDir = viewer - center;
        normalDir.y = normalDir.y * _VerticalBillboard;
        normalDir = normalize(normalDir);

        //判断法线和固定向上方向是否平行，叉乘求出右向量
        float3 upDir = abs(normalDir.y) > 0.999? float3(0,0,1) : float3(0,1,0);
        float3 rightDir = normalize(cross(upDir,normalDir));
        //由于之前法线和上方向不是垂直向量，这里再求一次垂直上方向向量
        upDir = normalize(cross(rightDir,normalDir));

        //顶点到锚点的偏移量，计算得到新顶点坐标
        float3 centerOffs = v.vertex.xyz - center;
        float3 localPos = center + rightDir * centerOffs.x + upDir *  centerOffs.y + normalDir.z * centerOffs.z;

        //根据本地坐标下新顶点做矩阵变换
        o.pos = UnityObjectToClipPos(float4(localPos,1.0));
        o.uv = TRANSFORM_TEX(v.uv, _MainTex);
        return o;
    }

    fixed4 frag (v2f i) : SV_Target
    {
        fixed4 col = tex2D(_MainTex, i.uv);
        col.rgb *= _Color.rgb;
        return col;
    }
    ENDCG
}

ffhzca