Unity Shader 屏幕后效果——全局雾

Unity内置的雾效需要在每个shader中分别编写，造成了极大的不便。这里利用屏幕后处理产生可单独控制且自由度更高的雾效。

 

屏幕后雾效的本质在于，通过深度纹理重构出每个像素在世界空间中的位置，根据得到的世界坐标计算出雾效系数，最后利用雾效系数与雾的颜色相乘并与原始颜色进行插值运算得出最终效果。

float3 afterFog=f*fogColor+(1-f)*origColor;

上面的插值运算中f代表雾效系数，

它有多种计算方法： 

1.线性运算：

f=(d_max-Abs(z))/d_max-d_min;

其中d_max和d_min分别代表受雾影响的最大和最小距离，z为给定的距离位置（像素位置）

2.指数运算：

f=pow(e,-d*Abs(z));

其中d控制雾的浓度，e为数学常量

3.二次指数：

f=pow(e,-pow(d*z,2));

 

为了更方便的对参数进行控制，需要重构每个像素在世界空间中的位置，常规实现方法如下：

1.构建像素的NDC坐标然后用VP矩阵的逆矩阵反向推导

2.通过向量的基本运算求得

方法1需要在片元着色器中进行矩阵乘法，若想得到性能更优的实现方式，考虑使用方法2。

 

向量的基本运算方式如下：

float4 worldPos=_WorldSpaceCameraPos+linearDepth*interpolatedRay;

_WorldSpaceCameraPos表示摄像机在世界空间中的位置，linearDepth*interpolatedRay是为了求得世界空间下的像素相对于摄像机的偏移量。根据向量的加法，就可以求出该像素在世界空间中的位置。

linearDepth线性深度值可以利用摄像机的深度纹理来求，关键在于求一个插值射线interpolatedRay。

 

分析interpolatedRay的含义可以知道，它主要表示该像素到摄像机的方向向量，可以由顶点着色器的各个顶点输出并插值得到。

基于这一点，可以直接在C#脚本中计算出屏幕四个顶点（左上，左下，右上，右下）的向量，传值给顶点着色器即可，这样避免在Shader中进行繁杂的数学运算。

 

参数控制脚本，同时计算顶点相对于摄像机的方向向量。此脚本挂载在摄像机上：

using UnityEngine;

public class FogWithDepthTexCtrl : ScreenEffectBase
{
    private const string _FrustumCornersRay = "_FrustumCornersRay";

    private const string _FogDensity = "_FogDensity";
    private const string _FogColor = "_FogColor";
    private const string _FogUnderStart = "_FogUnderStart";
    private const string _FogTopEnd = "_FogTopEnd";

    private Camera myCamera;
    public Camera MyCamera
    {
        get
        {
            if (myCamera == null)
                myCamera = GetComponent<Camera>();
            return myCamera;
        }
    }

    private Transform myCameraTran;
    public Transform MyCameraTran
    {
        get
        {
            if (myCameraTran == null)
                myCameraTran = MyCamera.transform;
            return myCameraTran;
        }
    }

    [Range(0, 3)]
    public float fogDensity = 1.0f;//控制雾的浓度
    public Color fogColor = Color.white;
    public float fogUnderStart = 0.0f;//雾起始高度
    public float fogTopEnd = 2.0f;//雾结束高度

    private void OnEnable()
    {
        MyCamera.depthTextureMode |= DepthTextureMode.Depth;
    }

    private void OnDisable()
    {
        MyCamera.depthTextureMode &= ~DepthTextureMode.Depth;
    }

    private void OnRenderImage(RenderTexture source, RenderTexture destination)
    {
        if (Material != null)
        {
            //需要传递的四个角相对于摄像机的方向向量，这里用矩阵的每一行来表示
            Matrix4x4 frustumCorners = Matrix4x4.identity;

            float fov = MyCamera.fieldOfView;
            float near = MyCamera.nearClipPlane;
            float aspect = MyCamera.aspect;

            //计算近裁剪平面三个标准方向
            float halfHeight = near * Mathf.Tan(fov * .5f * Mathf.Deg2Rad);
            Vector3 toTop = halfHeight * MyCameraTran.up;
            Vector3 toRight = halfHeight * MyCameraTran.right * aspect;
            Vector3 toForward = near * MyCameraTran.forward;

            //用三个标准方向重构四个顶点关于摄像机的向量
            Vector3 topRight = toForward + toRight + toTop;
            topRight /= near;

            Vector3 topLeft = toForward - toRight + toTop;
            topLeft /= near;

            Vector3 bottomRight = toForward + toRight - toTop;
            bottomRight /= near;

            Vector3 bottomLeft = toForward - toRight - toTop;
            bottomLeft /= near;

            //用矩阵的每一行来存储这些向量，这里的顺序要与之后解析的顺序对应
            frustumCorners.SetRow(0, topLeft);
            frustumCorners.SetRow(1, topRight);
            frustumCorners.SetRow(2, bottomLeft);
            frustumCorners.SetRow(3, bottomRight);

            //传递向量矩阵和对应的参数
            Material.SetMatrix(_FrustumCornersRay, frustumCorners);

            Material.SetFloat(_FogDensity, fogDensity);
            Material.SetColor(_FogColor, fogColor);
            Material.SetFloat(_FogUnderStart, fogUnderStart);
            Material.SetFloat(_FogTopEnd, fogTopEnd);

            Graphics.Blit(source, destination, Material);
        }
        else
            Graphics.Blit(source, destination);
    }
}

 

基类见：

https://www.cnblogs.com/koshio0219/p/11131619.html

 

Shader脚本：

Shader "MyUnlit/FogWithDepthTex"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
    }
    SubShader
    {
        Pass
        {
            ZTest Always Cull Off ZWrite Off

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            //对应四个顶点的射线矩阵
            float4x4 _FrustumCornersRay;

            sampler2D _MainTex;
            half4 _MainTex_TexelSize;
            sampler2D _CameraDepthTexture;
            half _FogDensity;
            fixed4 _FogColor;
            float _FogUnderStart;
            float _FogTopEnd;

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

            struct v2f
            {
                half4 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
                //顶点着色器输出的插值射线
                float4 interpolatedRay:TEXCOORD1;
            };

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv.xy = v.uv;
                o.uv.zw=v.uv;//zw存深度纹理

                //对插值射线的索引进行解析，判定该顶点是四个角中的哪一个
                int idx=0;
                if(v.uv.x>.5f&&v.uv.y>.5f)
                    idx=1;
                else if(v.uv.x<.5f&&v.uv.y<.5f)
                    idx=2;
                else if(v.uv.x>.5f&&v.uv.y<.5f)
                    idx=3;

                //主纹理外的纹理要进行平台差异化处理，同时对顶点的索引也需要进行处理（左上对左下，右上对右下）
                #if UNITY_UV_STARTS_AT_TOP
                if(_MainTex_TexelSize.y<0){
                    o.uv.w=1-o.uv.w;
                    idx=idx<2?idx+2:idx-2;
                }                    
                #endif
                
                //按照解析的索引值得到需要传递的插值射线
                o.interpolatedRay=_FrustumCornersRay[idx];

                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                //计算像素在世界空间中的位置
                float linearDepth=LinearEyeDepth(SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture,i.uv.zw));
                float3 worldPos=_WorldSpaceCameraPos+linearDepth*i.interpolatedRay.xyz;

                //计算雾效系数，这里主要用的关于世界空间高度的线性雾计算
                float fogDensity=(_FogTopEnd-worldPos.y)/(_FogTopEnd-_FogUnderStart);
                fogDensity=saturate(fogDensity*_FogDensity);

                //插值得到最终雾效
                fixed4 col = tex2D(_MainTex, i.uv);
                col.rgb=lerp(col.rgb,_FogColor.rgb,fogDensity);

                return col;
            }
            ENDCG
        }
    }
}

 

效果如下：