UnityShader入門精要學習筆記(十八):均值模糊與高斯模糊
阿新 • • 發佈:2019-02-18
一.均值模糊
1.簡單一次均值
(1)程式碼實踐
Shader "Custom/Edu/SimpleBlur" {
Properties {
_Color ("Color", Color) = (1,1,1,1)
_MainTex ("Albedo (RGB)", 2D) = "white" {}
_BlurRadius("Blur Radius",Range(0,30)) = 5
}
CGINCLUDE
#include "UnityCG.cginc"
fixed4 _Color;
sampler2D _MainTex;
float4 _MainTex_ST;
float4 _MainTex_TexelSize;
half _BlurRadius;
struct a2v
{
float4 vertex:POSITION;
float2 texcoord:TEXCOORD;
};
struct v2f
{
float4 pos:SV_POSITION;
half2 uv:TEXCOORD0;
half2 uv1:TEXCOORD1;
half2 uv2:TEXCOORD2;
half2 uv3:TEXCOORD3;
half2 uv4:TEXCOORD4;
};
v2f vert(a2v v)
{
v2f o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv = v.texcoord;
o.uv1 = v.texcoord + half2(1,1) * _MainTex_TexelSize *_BlurRadius ;
o.uv2 = v.texcoord + half2(-1,1) * _MainTex_TexelSize *_BlurRadius ;
o.uv3 = v.texcoord + half2(1,-1) * _MainTex_TexelSize *_BlurRadius ;
o.uv4 = v.texcoord + half2(-1,-1) * _MainTex_TexelSize *_BlurRadius ;
return o;
}
fixed4 frag(v2f i):SV_Target
{
fixed4 color;
color = tex2D(_MainTex,i.uv) * _Color;
color += tex2D(_MainTex,i.uv1) * _Color;
color += tex2D(_MainTex,i.uv2) * _Color;
color += tex2D(_MainTex,i.uv3) * _Color;
color += tex2D(_MainTex,i.uv4) * _Color;
return color*0.2;
}
ENDCG
SubShader {
Pass
{
Tags{"LightMode" = "ForwardBase"}
ZTest Off
Cull Off
ZWrite Off
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
ENDCG
}
}
FallBack "Diffuse"
}
(2)效果圖
2.簡單一次均值增加取樣點
(1)程式碼實踐
Shader "Custom/Edu/SimpleBlur" {
Properties {
_Color ("Color", Color) = (1,1,1,1)
_MainTex ("Albedo (RGB)", 2D) = "white" {}
_BlurRadius("Blur Radius",Range(-20,20)) = 5
}
CGINCLUDE
#include "UnityCG.cginc"
fixed4 _Color;
sampler2D _MainTex;
float4 _MainTex_ST;
float4 _MainTex_TexelSize;
half _BlurRadius;
struct a2v
{
float4 vertex:POSITION;
float2 texcoord:TEXCOORD;
};
struct v2f
{
float4 pos:SV_POSITION;
half2 uv:TEXCOORD0;
half4 uv1:TEXCOORD1;
half4 uv2:TEXCOORD2;
half4 uv3:TEXCOORD3;
half4 uv4:TEXCOORD4;
};
v2f vert(a2v v)
{
v2f o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv = v.texcoord;
o.uv1.xy = v.texcoord + half2(1,1) * _MainTex_TexelSize *_BlurRadius ;
o.uv2.xy = v.texcoord + half2(-1,1) * _MainTex_TexelSize *_BlurRadius ;
o.uv3.xy = v.texcoord + half2(1,-1) * _MainTex_TexelSize *_BlurRadius ;
o.uv4.xy = v.texcoord + half2(-1,-1) * _MainTex_TexelSize *_BlurRadius ;
o.uv1.zw = v.texcoord + half2(1,0) * _MainTex_TexelSize *_BlurRadius ;
o.uv2.zw = v.texcoord + half2(-1,0) * _MainTex_TexelSize *_BlurRadius ;
o.uv3.zw = v.texcoord + half2(0,-1) * _MainTex_TexelSize *_BlurRadius ;
o.uv4.zw = v.texcoord + half2(0,1) * _MainTex_TexelSize *_BlurRadius ;
return o;
}
fixed4 frag(v2f i):SV_Target
{
fixed4 color;
color = tex2D(_MainTex,i.uv) * _Color;
color += color;
color += tex2D(_MainTex,i.uv1.xy) * _Color;
color += tex2D(_MainTex,i.uv1.zw) * _Color;
color += tex2D(_MainTex,i.uv2.xy) * _Color;
color += tex2D(_MainTex,i.uv2.zw) * _Color;
color += tex2D(_MainTex,i.uv3.xy) * _Color;
color += tex2D(_MainTex,i.uv3.zw) * _Color;
color += tex2D(_MainTex,i.uv4.xy) * _Color;
color += tex2D(_MainTex,i.uv4.zw) * _Color;
return color*0.1;
}
ENDCG
SubShader {
Pass
{
Tags{"LightMode" = "ForwardBase"}
ZTest Off
Cull Off
ZWrite Off
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
ENDCG
}
}
FallBack "Diffuse"
}
(2)效果圖
3.屏幕後期處理多次迭代均值模糊
(1)基本思路
在攝像機的OnRenderImage函式中,宣告一個RenderTexture,buffer0,先將src複製到buffer0。
宣告buffer0、buffer1時其解析度可以通過降取樣引數downSample來控制。
對影象進行降取樣不僅可以減少需要處理的畫素個數,提高效能,而且適當降取樣可以得到更好的模糊效果。
然後在For迴圈中將buffer0作為_MainTex交給指定shader的指定pass進行處理。
中間會用到臨時的buffer1,每次buffer0被賦予新值前要先呼叫RenderTexture的ReleaseTemporary靜態方法先將其釋放。最後將buffer0複製到dest。
(2)程式碼實踐
using UnityEngine;
using System.Collections;
using System;
using UnityEngine.UI;
using System.Security.Cryptography;
[ExecuteInEditMode]
public class SimpleBlur : PostEffectsBase {
public Shader simpleBlurShader;
private Material simpleBlurMat = null;
public Material material
{
get
{
simpleBlurMat = CheckShaderAndCreateMaterial (simpleBlurShader, simpleBlurMat);
return simpleBlurMat;
}
}
[Range(0,4)]
public int iterations = 3;
[Range(0.2f,0.5f)]
public float blurSpread = 0.6f;
[Range(1,8)]
public int downSample = 2;
void OnRenderImage(RenderTexture src,RenderTexture dest)
{
if (material != null) {
int rtH = src.width / downSample;
int rtW = src.height / downSample;
RenderTexture buffer0 = RenderTexture.GetTemporary (rtW, rtH, 0);
//設定濾波模式為二次線性濾波
buffer0.filterMode = FilterMode.Bilinear;
//先把src渲染到buffer0上!!!!
Graphics.Blit (src, buffer0);
for (int i = 0; i < iterations; i++)
{
RenderTexture buffer1 = RenderTexture.GetTemporary (rtH, rtW, 0);
Graphics.Blit (buffer0, buffer1, material, 0);
//使用該靜態方法釋放臨時RT的內容
//為buffer0賦予新的渲染內容前必須想將其釋放
RenderTexture.ReleaseTemporary (buffer0);
buffer0 = buffer1;
}
Graphics.Blit (buffer0, dest);
RenderTexture.ReleaseTemporary (buffer0);
}
else
{
Graphics.Blit (src, dest);
}
}
}
(3)效果圖
二.高斯模糊
(1)簡介
均值模糊由於取樣次數較少,每個畫素以及其周圍畫素的權值是相同的,模糊出來的效果不佳,而多次迭代處理雖然可以增強模糊效果,但是迭代大大地增加了效能的消耗,雖然在學習時可以用迭代來達到效果,但是要實際使用的時候,效率就不得不成為我們考慮的重要因素。
高斯模糊就是在取樣迭代的過程中在片元著色器內考慮各個取樣點距離中心的遠近,並乘以符合高斯分佈的權重值。
高斯分佈
(2)程式碼實踐
CS程式碼
using UnityEngine;
using System.Collections;
using System.Text.RegularExpressions;
using System.Security.Cryptography;
public class MyGaussianBlur : PostEffectsBase {
public Shader GaussianBlurShader;
private Material GaussianBlurMat;
public Material mat
{
get
{
if (GaussianBlurMat == null) {
GaussianBlurMat = CheckShaderAndCreateMaterial (GaussianBlurShader, GaussianBlurMat);
}
return GaussianBlurMat;
}
}
[Range(0,8)]
public int downSample;
[Range(0,4)]
public int iterations;
[Range(0,10)]
public float blurRadius;
void OnRenderImage(RenderTexture src,RenderTexture dest)
{
if (mat != null) {
mat.SetFloat ("_BlurRadius", blurRadius);
int rtW = src.width / downSample;
int rtH = src.height / downSample;
//最後一個引數depth,當為0時,表示不產生深度Z的緩衝
RenderTexture buffer0 = RenderTexture.GetTemporary (rtW, rtH, 0);
buffer0.filterMode = FilterMode.Bilinear;
Graphics.Blit (src, buffer0);
for (int i = 0; i < iterations; i++)
{
//pass 0 ,在水平方向上進行模糊
RenderTexture buffer1 = RenderTexture.GetTemporary (rtW, rtH, 0);
Graphics.Blit (buffer0, buffer1, mat, 0);
RenderTexture.ReleaseTemporary (buffer0);
buffer0 = buffer1;
buffer1 = RenderTexture.GetTemporary (rtW, rtH, 0);
Graphics.Blit (buffer0, buffer1, mat, 1);
RenderTexture.ReleaseTemporary (buffer0);
buffer0 = buffer1;
//RenderTexture.ReleaseTemporary (buffer1);
}
Graphics.Blit (buffer0, dest);
RenderTexture.ReleaseTemporary (buffer0);
} else {
Graphics.Blit (src, dest);
}
}
}
Shader程式碼
Shader "Custom/Edu/GaussianBlur" {
Properties {
_MainTex ("Albedo (RGB)", 2D) = "white" {}
_BlurRadius("Blur Radius",Range(0,10)) = 5
_Color("Color Tint",Color)= (1,1,1,1)
}
CGINCLUDE
#include "unityCG.cginc"
sampler2D _MainTex;
float4 _MainTex_TexelSize;
half _BlurRadius;
struct a2v
{
float4 vertex:POSTION;
float2 texcoord:TEXCOORD0;
};
struct v2f
{
float4 pos:SV_POSITION;
half2 uv[5]:TEXCOORD0;
};
v2f vertBlurVertical(a2v v)
{
v2f o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv[0] = v.texcoord ;
o.uv[1] = v.texcoord + _BlurRadius * float2(0,1) * _MainTex_TexelSize;
o.uv[2] = v.texcoord + _BlurRadius * float2(0,-1) * _MainTex_TexelSize;
o.uv[3] = v.texcoord + _BlurRadius * float2(0,2) * _MainTex_TexelSize;
o.uv[4] = v.texcoord + _BlurRadius * float2(0,-2) * _MainTex_TexelSize;
return o;
}
v2f vertBlurHorizontal(a2v v)
{
v2f o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv[0] = v.texcoord ;
o.uv[1] = v.texcoord + _BlurRadius * float2(1,0) * _MainTex_TexelSize;
o.uv[2] = v.texcoord + _BlurRadius * float2(-1,0) * _MainTex_TexelSize;
o.uv[3] = v.texcoord + _BlurRadius * float2(2,0) * _MainTex_TexelSize;
o.uv[4] = v.texcoord + _BlurRadius * float2(-2,0) * _MainTex_TexelSize;
return o;
}
fixed4 fragBlur(v2f i):SV_Target
{
float weight[3] = {0.4026,0.2442,0.0545};
fixed3 sum = tex2D(_MainTex,i.uv[0]).rgb * weight[0];
// 為什麼不用i呢?因為傳入的v2f變數實參的名稱就是 i !
for(int it=1; it<3; it++){
sum += tex2D(_MainTex, i.uv[2*it]).rgb * weight[it];
sum += tex2D(_MainTex, i.uv[2*it-1]).rgb * weight[it];
}
return fixed4(sum,1.0);
}
ENDCG
SubShader {
Tags { "RenderType"="Opaque" }
ZTest Always
Cull Off
ZWrite Off
Pass
{
//潛意識中的錯誤寫法,不需要等號
//NAME = "vertBlurVertical"
NAME "vertBlurVertical"
CGPROGRAM
#pragma vertex vertBlurVertical
#pragma fragment fragBlur
ENDCG
}
Pass
{
NAME "vertBlurHorizontal"
CGPROGRAM
#pragma vertex vertBlurHorizontal
#pragma fragment fragBlur
ENDCG
}
}
FallBack "Diffuse"
}
(3) 效果圖