靠近就消失或者出现的功能

看了林新发大佬的功能，觉得很不错，大佬是用 Shader Graph实现的，我在 Builtin 里面用手写熟练一下。

实现思路

大佬讲的挺明白的，这个功能也比较简单，主要就是传入坐标，判断距离，用一种方式消失，增加边缘颜色。
先上效果图。
效果图

具体步骤如下：

  • 获取世界坐标
  • 判断是否处于阈值范围，然后 Clip。
  • 增加噪声溶解效果
  • 增加溶解边缘颜色

部分源码

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
fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex, i.uv);
                // apply fog
                UNITY_APPLY_FOG(i.fogCoord, col);
                float distanceVertex = distance(i.world_position, _TargetPos);
                //溶解

                //-----开始优化这个区域
                /*
                if(distanceVertex < _DissolveThreshold)
                {
                    //该 clip 为 噪声溶解
                    fixed4 dissolve_color = tex2D(_DissolveNoise, i.uv);
                    float offset = 1- (distanceVertex / _DissolveThreshold);
                    if(dissolve_color.b < offset)
                    {
                        clip(-1);
                    }
                    if(dissolve_color.b < offset + _DissolveEdgeWidth)
                    {
                        col = _DissolveEdgeColor;
                    }
                    else
                    {
                        col = col;
                    }
                }
                else
                {
                    col = col;
                }
                */
                fixed4 dissolve_color = tex2D(_DissolveNoise, i.uv);
                float offset = 1- (distanceVertex / _DissolveThreshold);
                clip(dissolve_color.b - offset);    //这一步区分是否被 clip
                col = step(_DissolveThreshold, distanceVertex) * col +                                                                      //第一行是表示阈值之外正常显示颜色
                step(distanceVertex, _DissolveThreshold) * step(dissolve_color.b, offset + _DissolveEdgeWidth) * _DissolveEdgeColor +       //第二行是边缘的颜色
                step(offset + _DissolveEdgeWidth, dissolve_color.b) * col -                                                                 //第三行是边缘以内正常显示颜色
                step(_DissolveThreshold, distanceVertex) *  step(offset + _DissolveEdgeWidth, dissolve_color.b) * col;                      //第四行是减去第三中“边缘以内和阈值之外”这两个描述重复的部分
                return col;
            }

总结

一个比较简单的效果，这里面第一个比较绕的点就是距离越近，消失的部分越大，所以用 1 减去距离和阈值的比值就好。然后就是在优化的时候因为前面的逻辑里面有 if 的嵌套，所以后面改成 step 的时候在我的代码里面那个减去两个颜色重复的部分思考的比较慢，其他就没啥了。工程链接放到最底下了。

参考链接