Unity基于高斯模糊原理的简易bloom实现——UnityShader学习笔记复习

自言自语

学习实现简易bloom 4个pass 有点绕脑袋 还好耐着性子 整理出来了

原图效果

自制简易bloom效果

标准饱和度效果

增强饱和度效果

设置面板

有开放迭代次数 范围 饱和度 分辨率 等 不过效果还是不咋地

C#部分

using System.Collections;
using System.Collections.Generic;
using UnityEngine;


[ExecuteInEditMode]
public class TNBloom : PostProcessWangBase
{
    //高斯模糊迭代次数
    [Range(0, 6)]
    public int iteration = 1;
    //bloom高亮的阈值范围
    [Range(0f, 1f)]
    public float BloomThreshold = 0.5f;
    //光晕扩散效果 其实就是高斯模糊采样距离和范围
    [Range(0f, 6f)]
    public float BloomSpread = 0.5f;
    //bloom强度
    [Range(0f, 10f)]
    public float BloomStrenth = 1f;
    //饱和度 防止bloom过白
    [Range(0f, 2f)]
    public float Saturation = 1f;
    //降采样 也就是bloom的分辨率
    [Range(1, 8)]
    public int downsample = 2;

    public Shader bloomShader;
    private Material bloomMaterial = null;
    public Material Omaterial
    {
        get
        {
            bloomMaterial = CheckShaderAndMaterial(bloomShader, bloomMaterial);
            return bloomMaterial;
        }
    }

    protected void OnRenderImage(RenderTexture source, RenderTexture destination)
    {
        if (Omaterial == null )
        {
            Graphics.Blit(source, destination);
        }
        else
        {
            int rtW = source.width / downsample;
            int rtH = source.height / downsample;

            RenderTexture buffer0 = RenderTexture.GetTemporary(rtW, rtH, 0);
            RenderTexture buffer1 = RenderTexture.GetTemporary(rtW, rtH, 0);

            //先通过pass 0 降bloom 高亮部分通过阈值算出来 给到buffer0
            Graphics.Blit(source, buffer0, Omaterial, 0);

            for (int i = 0; i<iteration;i++)
            {
                Omaterial.SetFloat("_BloomThreshold", BloomThreshold);
                Omaterial.SetFloat("_BloomSaturation", Saturation);
                //强度变化不明显 乘以一个系数10f 方便调试
                Omaterial.SetFloat("_BloomStrenth", BloomStrenth*10f);
                Omaterial.SetFloat("_BlurSize", 1.0f+i* BloomSpread);
                //通过pass 1 对高亮范围进行纵向模糊  存入buffer1
                Graphics.Blit(buffer0, buffer1, Omaterial, 1);
                //释放buffer0 方便下一步存储新缓存
                RenderTexture.ReleaseTemporary(buffer0);
                //通过pass 2 对高亮范围进行横向模糊 存入buffer0
                Graphics.Blit(buffer1, buffer0, Omaterial, 2);
                //释放buffer1的缓存
                RenderTexture.ReleaseTemporary(buffer1);
            }
            //把buffer0模糊好的高亮图像 传给shader中 _Bloom贴图
            Omaterial.SetTexture("_Bloom", buffer0);
            //通过pass 3 把屏幕贴图和_Bloom图相加 存入新的目标缓存中
            Graphics.Blit(source, destination, Omaterial, 3);
            //清空缓存
            RenderTexture.ReleaseTemporary(buffer0);
        }
    }
}

Shader部分

Shader "TNShaderPractise/ShaderPractise_Bloom"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
		_Bloom ("Bloom",2D)="black"{}
	}
		SubShader
	{
		Tags { "RenderType" = "Opaque"  "Queue" = "Transparent"}

		CGINCLUDE

		sampler2D _MainTex;
		float4 _MainTex_TexelSize;
		sampler2D _Bloom;
		float _BloomThreshold;
		float _BloomStrenth;

		//虽然直接给个饱和度是不准确的却能让光晕颜色鲜亮 不至于发白
		float _BloomSaturation;
		//这里定义一个_BlurSize是因为调用的高斯模糊pass里需要这个参数来定义模糊采样距离
		float _BlurSize;

		struct a2v
		{
			float4 vertex : POSITION;
			float4 texcoord : TEXCOORD0;
		};

		struct v2f
		{
			float4 pos : SV_POSITION;
			float4 uv : TEXCOORD1;
		};
		/// pass 0 用来提取屏幕中高亮部分
		v2f vertExBright(a2v v)
		{
			v2f o;
			o.pos = UnityObjectToClipPos(v.vertex);
			o.uv = v.texcoord;
			return o;
		}

		//构建灰度函数
		fixed Luminance(fixed4 c)
		{
			return fixed(c.r*0.2125 + c.g*0.7154 + c.b*0.0721);
		}

		fixed4 fragExBright (v2f i) : SV_Target
		{
			fixed4 col = tex2D(_MainTex,i.uv);
			//通过屏幕图像转灰度 再减去阈值 得到高亮区域 再映射到0到1的范围内
			fixed tempGray = clamp(Luminance(col)- _BloomThreshold,0.0,1.0);
			//高亮区域与屏幕图像相乘的到bloom图像像素信息
			fixed4 bloomCol = col * tempGray;
			//再进行去色
			fixed4 tempCol= fixed4(Luminance(bloomCol), Luminance(bloomCol), Luminance(bloomCol),col.a);
			//自行添加饱和度调节 虽然不准但会润色一些 不至于高光晕高亮发白
			fixed4 satCol = lerp(tempCol, bloomCol, _BloomSaturation);
			//增强光晕亮度强度
			fixed4 bloomC = satCol *_BloomStrenth;

			return bloomC;
		}
		/// pass 3 用来加权处理过的bloom和原图
		struct a2vBloom 
		{
			float4 vertex : POSITION;
			float4 texcoord : TEXCOORD0;
		};
		
		struct v2fBloom
		{
			float4 pos : SV_POSITION;
			float4 uv : TEXCOORD1;
		};

		v2fBloom vertBloom(a2vBloom v)
		{
			v2fBloom o;
			o.pos = UnityObjectToClipPos(v.vertex);
			o.uv.xy = v.texcoord;
			o.uv.zw = v.texcoord;
			return o;
		}
		
		fixed4 fragBloom(v2fBloom i) :SV_Target
		{
			fixed4 color = tex2D(_MainTex,i.uv.xy);
			#if UNITY_UV_STARTS_AT_TOP
				//做平台判定 DX平台是从上到下的算UV  所以如果是DX 就得取反y
				if  (_MainTex_TexelSize.y < 0.0)
					i.uv.w = 1.0 - i.uv.w;
			#endif
			fixed4 bloomColor = tex2D(_Bloom, i.uv.zw);
			//直接屏幕图像与bloom光晕部分相加即可
			return color + bloomColor;
		}
		ENDCG

		ZWrite Off ZTest Always Cull Off
		///pass 0
		Pass
		{
			CGPROGRAM
			#pragma vertex vertExBright
			#pragma fragment fragExBright
			ENDCG
		}
		//调用高斯模糊中写好的pass 进行高斯模糊计算高亮部分 具体可以看高斯模糊笔记篇
		///pass 1
		UsePass "TNShaderPractise/ShaderPractise_GaussianBlur_033/GAUSSIANBLUR_VERTICAL"
		///pass 2
		UsePass "TNShaderPractise/ShaderPractise_GaussianBlur_033/GAUSSIANBLUR_HORIZONTAL"
		///pass 3
		Pass
		{
			CGPROGRAM
			#pragma vertex vertBloom
			#pragma fragment fragBloom
			ENDCG
		}
    }
	FallBack Off
}

小结

算是基本理解了高斯模糊原理的简易bloom吧。等把整本书啃完了 再去研究下大神们的bloom怎么写.
Fighting！！TA building！