ShaderForge-水中倒影效果

发表于2018-07-11
评论0 5.9k浏览
效果


原理

  • 将原图均分为月亮部分和水面部分两张图,其他区域用透明色填充
  • 倒影:就是将uv的v值翻转一下,
  • 倒影在水的扭曲效果:就是让图片不同部位uv值的增量不同,如果不太熟悉扭曲效果的,可以参见unity shader 贴图流动
  • 最后利用透明度用Lerp操作将原图和倒影图合成到一起

ShaderForege实现

分解

  • 倒影
uv值是从(0,0)到(1,1)的二位数组,我们将v值从0到1重映射到1到0,就得到了y方向上的倒影图
font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)

  • 将水波图与倒影图混合

  • 流动效果

  • 透过透明度与月亮图混合
到这里已经基本上实现了水中倒影的效果!

我在以上基础上根据自己的喜好追加了一些细节,开篇的效果的shaderforge节点树如下

手写unity shader实现水中倒影
Shader "Custom/daoying_u"
{
    Properties
    {
        _MainTex ("Shadow Tex", 2D) = "white" {}
        _WaterTex("Water Tex", 2D) = "white" {}
        _NoiseTex("Noise Tex", 2D) = "white" {}
        _MoonTex("Moon Tex", 2D) = "white" {}
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" }
        LOD 100
        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            // make fog work
            #pragma multi_compile_fog
            #include "UnityCG.cginc"
            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };
            struct v2f
            {
                float2 uv : TEXCOORD0;
                UNITY_FOG_COORDS(1)
                float4 vertex : SV_POSITION;
            };
            sampler2D _MainTex;
            float4 _MainTex_ST;
            sampler2D _WaterTex;
            sampler2D _NoiseTex;
            sampler2D _MoonTex;
            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                UNITY_TRANSFER_FOG(o,o.vertex);
                return o;
            }
            fixed4 frag (v2f i) : SV_Target
            {
                // 流动值
                fixed4 noise_col = tex2D(_NoiseTex, i.uv + float2(_Time.y*0.1, 0.0));
                fixed2 floatUV = float2(noise_col.r*0.03, 0);
                // uv的v值从0到1重映射到1到0
                float2 shadow_uv = float2(i.uv.r+floatUV.r, (i.uv.g+floatUV.g)*-1.0 + 1.0);
                fixed4 col = tex2D(_MainTex, shadow_uv);
                fixed4 water_col = tex2D(_WaterTex, i.uv+floatUV);
                // 混合倒影和水波 
                fixed4 lerp1 = lerp(col, water_col, 0.5);
                fixed4 moon_col = tex2D(_MoonTex, i.uv);
                // 混合月亮图和倒影
                fixed4 final = lerp(moon_col, lerp1, 1.0 - moon_col.a);
                // apply fog
                UNITY_APPLY_FOG(i.fogCoord, col);
                return final;
            }
            ENDCG
        }
    }
}

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引

0个评论