Unity shader之Flowmap贴图的原理

最新推荐文章于 2022-08-23 21:05:55 发布

莫之

最新推荐文章于 2022-08-23 21:05:55 发布

阅读量6.9k

点赞数 1

分类专栏：游戏渲染实战 unity shader编程

本文链接：https://blog.csdn.net/qq_36383623/article/details/104872448

版权

unity shader编程同时被 2 个专栏收录

32 篇文章 9 订阅

订阅专栏

游戏渲染实战

3 篇文章 1 订阅

订阅专栏

一、FlowMap的原理

流动贴图，为了实现一个流动的效果，然而它存储的信息是顶点的移动向量信息，只占用RG通道，将一个归一化二维向量保存到像素中，所以我们看到的flowmap都是如下颜色的(0.5, 0.5, 0)；

它的实现思路是借鉴了向量场的概念，可以看一下参考中的向量场相关介绍；

在shader的实现中，它利用了uv动画的原理，也就是我们需要根据flowmap中的信息做uv偏移，然后通过时间来改变偏移大小，从而产生一个流动效果；但是，我们不能允许uv的偏移量过大，因为随着时间叠加后，如果偏移量过大，肯定会导致采样错误，所以我们需要将时间来控制到0,1的一个循环中，这样就可以保证不会出现采样的异常了；

片元着色器如下所示，

            fixed4 frag (v2f i) : SV_Target
            {
                float3 flowDir = tex2D(_FlowMapTex, i.uv) * 2.0f - 1.0f;
                flowDir *= _Speed;

                float phase0 = abs(fmod(_Time.y, 2) - 1);

                half3 tex0 = tex2D(_MainTex, i.uv + flowDir.xy * phase0);
                return fixed4(tex0, 1);
            }

但是上述这种实现方式会在一个周期之后有跳变的效果；

为了解决这个跳变的效果，采用的解决方案是采样两次，然后在这两次采样之间做一个插值，然后做一个插值；注意插值系数也是要动态改变的，而且插值系数采用了绝对值的计算，也就是它是循环的（从0到1，再从1到0，而不会从1跳变到0）

            fixed4 frag (v2f i) : SV_Target
            {
                float3 flowDir = tex2D(_FlowMapTex, i.uv) * 2.0f - 1.0f;
                flowDir *= _Speed;

                float phase0 = abs(fmod(_Time.y, 2) - 1);
                float phase1 = frac(_Time.y  + 0.5f);

                half3 tex0 = tex2D(_MainTex, i.uv + flowDir.xy * phase0);
                half3 tex1 = tex2D(_MainTex, i.uv + flowDir.xy * phase1);

                float flowLerp = abs((phase0 - 0.5f) / 0.5f);
                half3 finalColor = lerp(tex0, tex1, flowLerp);

                return fixed4(finalColor, 1);
            }