《Unity Shader》11.3.1 流动的河流

在本小节中,我们将学习如何模拟一个2D的河流效果。在学习完本节后,我们可以得到类似图11.4中的效果。当单击运行后,可以观察到河流不断流动的效果。


(1)新建一个场景。在本书资源中,该场景名为Scene_11_3_1。在Unity 5.2中,默认情况下场景将包含一个摄像机和一个平行光,并且使用了内置的天空盒子。在Window → Lighting →Skybox中去掉场景中的天空盒子。由于本节模拟的是2D效果,因此我们需要把摄像机的投影类型设置为正交投影。

(2)新建一个材质。在本书资源中,该材质名为WaterMat。由于本例需要模拟多层水流效果,我们还创建了WaterMat1和WaterMat2材质。

(3)新建一个Unity Shader。在本书资源中,该Shader名为Chapter11-Water。把新的Shader赋给第2步中创建的材质。

(4)在场景中创建多个Water模型,调整它们的位置、大小和方向,然后把第2步中的材质拖曳给它们。

https://github.com/candycat1992/Unity_Shaders_Book/blob/master/Assets/Models/water_fall.fbx

打开新建的Chapter11-Water,删除原来的代码,并添加如下关键代码。

(1)首先,我们声明了一些新的属性:

(2)在本例中,我们需要为透明效果设置合适的SubShader标签:

(3)接着,我们设置了Pass的渲染状态:

(4)然后,我们在顶点着色器中进行了相关的顶点动画:

(5)片元着色器的代码非常简单,我们只需要对纹理采样再添加颜色控制即可:

(6)最后,我们把Fallback设置为内置的Transparent/VertexLit(也可以选择关闭Fallback):

保存后返回场景,把Assets/Textures/Chapter11/Water.psd拖曳到材质的Main Tex属性上,并调整相关参数。为了让河流更加美观,我们可以复制多个材质并使用不同的参数,再赋给不同的Water模型,就可以得到类似图11.4中的效果。

https://github.com/candycat1992/Unity_Shaders_Book/blob/master/Assets/Shaders/Chapter11/Chapter11-Water.shader

cs 复制代码
Shader "Custom/Chapter11-Water"
{
    Properties {
        _MainTex ("Main Tex", 2D) = "white" {} //_MainTex是河流纹理
        _Color ("Color Tint", Color) = (1, 1, 1, 1)
        _Magnitude ("Distortion Magnitude", Float) = 1 //_Magnitude用于控制水流波动的幅度
        _Frequency ("Distortion Frequency", Float) = 1 //_Frequency用于控制波动频率
        _InvWaveLength ("Distortion Inverse Wave Length", Float) = 10 //_InvWaveLength用于控制波长的倒数(_InvWaveLength越大,波长越小)
        _Speed ("Speed", Float) = 0.5 //_Speed用于控制河流纹理的移动速度。
    }

    Subshader {
        // Need to disable batching because of the vertex animation
		Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "DisableBatching"="True"}
        //包含了模型空间的顶点动画的Shader,需要取消对该Shader的批处理操作
        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;

                float4 offset; //计算顶点位移量
                offset.yzw = float3(0.0, 0.0, 0.0); //只希望对顶点的x方向进行位移,因此yzw的位移量被设置为0
                offset.x = sin(_Frequency * _Time.y + v.vertex.x * _InvWaveLength + v.vertex.y * _InvWaveLength + v.vertex.z * _InvWaveLength) * _Magnitude;
                //利用_Frequency属性和内置的_Time.y变量来控制正弦函数的频率
                //不同位置具有不同的位移,我们对上述结果加上了模型空间下的位置分量,乘以_InvWaveLength来控制波长
                //对结果值乘以_Magnitude属性来控制波动幅度,得到最终的位移。

                o.pos = mul(UNITY_MATRIX_MVP, v.vertex + offset); //位移量添加到顶点位置上,再进行正常的顶点变换即可。

                o.uv = TRANSFORM_TEX(v.texcoord, _MainTex);
                o.uv +=  float2(0.0, _Time.y * _Speed);  //纹理动画,即使用_Time.y和_Speed来控制在水平方向上的纹理动画

                return o;
            }

            fixed4 frag(v2f i) : SV_Target {
                fixed4 c = tex2D(_MainTex, i.uv);
                c.rgb *= _Color.rgb;
                return c;
            }
            ENDCG
        }
    }
    FallBack "Transparent/VertexLit"
}

https://github.com/candycat1992/Unity_Shaders_Book/blob/master/Assets/Textures/Chapter11/water.psd

《Unity Shader》11.3.1 流动的水流

相关推荐
小马过河R3 小时前
开发游戏需要哪些岗位和角色参与
游戏·游戏引擎·游戏程序
jtymyxmz5 小时前
《Unity Shader》11.3.1 续 流动的水流的阴影
unity·游戏引擎
世洋Blog5 小时前
Unity性能优化-2d游戏的DrawCall
游戏·unity·面试·性能优化·游戏引擎
jtymyxmz5 小时前
《Unity Shader》11.2.2 滚动的背景
unity·游戏引擎
Tatalaluola5 小时前
Unity使用EPPlus读取写入表格
unity·c#·游戏引擎·excel
呆呆敲代码的小Y5 小时前
【Unity 实用工具篇】 | Unity中的软遮罩组件 SoftMaskForUGUI 快速上手使用
游戏·unity·游戏引擎·免费游戏·遮罩·软遮罩·softmask
B0URNE14 小时前
【Unity基础详解】(11)Unity核心:输入系统
unity·游戏引擎
世洋Blog17 小时前
Unity开发微信小游戏-减少WASM包体大小
unity·游戏引擎·wasm·微信小游戏
TO_ZRG18 小时前
Unity 通过 NativePlugin 接入Android SDK 指南
android·unity·游戏引擎