Unity Shader - 徑向模糊

前言

Hello！大家好，這裏先說一個題外話哈，話說有沒有公司現在招U3D遊戲開發的呢？哈哈，最近我也開始重新找工作了，有沒有小夥伴推薦一下呀？座標 深圳 ，感謝！( 我的微信:Li1076984375)

徑向模糊

言歸正傳，前面我們實現了邊緣檢測，模糊處理等後期效果，今天我們就來實現一下徑向模糊！

徑向模糊是一種從中心向外呈幅射狀的逐漸模糊的效果。

如果經常玩遊戲的小夥伴都知道徑向模糊其實在遊戲中很常用，特別武俠類遊戲中，常用來體現速度感，例如角色在施展輕功的時候，視覺效果非常好。

我們來看下最終效果：

實現原理：

原理其實很簡單，就是 在當前像素點 沿着 徑向模糊方向（ 中心 到 邊緣）取幾個點作爲採樣點，最後取這幾個採樣點平均值就是最終輸出值了。

獲取方向向量非常簡單，A到B的向量 = B點 - A點。 即：中心像素 - 當前像素，即可得到方向向量。

具體Shader代碼如下：

// ---------------------------【徑向模糊】---------------------------
Shader "lcl/screenEffect/RadialBlur"
{
    // ---------------------------【屬性】---------------------------
    Properties 
    {
        _MainTex ("Base (RGB)", 2D) = "white" {}
    }
    // ---------------------------【子着色器】---------------------------
    SubShader
    {
        Pass
        {
            ZTest Always
            Cull Off
            ZWrite Off
            Fog{ Mode off }
            
            //調用CG函數	
            CGPROGRAM
            //使效率更高的編譯宏
            #pragma fragmentoption ARB_precision_hint_fastest 
            //vert_img 是在UnityCG.cginc中內置的
            #pragma vertex vert_img
            #pragma fragment frag 

            #include "UnityCG.cginc"
            uniform sampler2D _MainTex;
            uniform float _BlurFactor;	//模糊強度
            uniform float2 _BlurCenter; //模糊中心點
            
            // ---------------------------【片元着色器】---------------------------
            fixed4 frag(v2f_img i) : SV_Target
            {
                //模糊方向: 中心像素 - 當前像素
                float2 dir = _BlurCenter.xy - i.uv ;
                float4 resColor = 0;
                //迭代
                for (int j = 0; j < 5; ++j)
                {
                    //計算採樣uv值：正常uv值+從中間向邊緣逐漸增加的採樣距離
                    float2 uv = i.uv + _BlurFactor * dir * j;
                    resColor += tex2D(_MainTex, uv);
                }
                //取平均值(乘法比除法性能好)
                resColor *= 0.2;
                return resColor;
            }
            ENDCG
        }
    }
    Fallback off
}

C#：

PostEffectsBase 基類可以在這裏獲取,就不再贅述了

using UnityEngine;
public class RadialBlur : PostEffectsBase {

    public Shader gaussianBlurShader;   
    private Material mat = null;

    public Material material {
        get {
            mat = CheckShaderAndCreateMaterial (gaussianBlurShader, mat);
            return mat;
        }
    }

    //模糊程度
    [Range (0, 0.05f)]
    public float blurFactor = 0.0f;
    //模糊中心（0-1）屏幕空間，默認爲中心點
    public Vector2 blurCenter = new Vector2 (0.5f, 0.5f);

    void Start () {
        // 找到處理徑向模糊的shader
        gaussianBlurShader = Shader.Find ("lcl/screenEffect/RadialBlur");
    }
    // 後期處理
    void OnRenderImage (RenderTexture source, RenderTexture destination) {
        if (material) {
            material.SetFloat ("_BlurFactor", blurFactor);
            material.SetVector ("_BlurCenter", blurCenter);
            Graphics.Blit (source, destination, material);
        } else {
            Graphics.Blit (source, destination);
        }
    }

}

最後

歡迎來我GitHub點個Star，謝謝！
裏面有我平時學習unity shader過程中實現的一些特效demo。