高斯模糊是非常常用的一种特效,比如说营造景深或者毛玻璃等效果都可以使用。下面介绍一下镜头和UI上的使用。
摄像机上可以通过两款特效插件非常方便的实现这种效果。第一款插件就是经典的ImageEffect,可以在镜头下添加BlurOptimized组件轻松的实现,具体的效果可以通过改变参数调节。第二款插件是PostProcess,它是第一款插件的升级版,功能也更加丰富。安装好插件后首先给Camera下添加PostProcessingBehaviour组件,然后在Project面板下右键创建一个PostProcess拖拽给相机下的PostProcessingBehaviour组件,之后在PostProcess里调节效果就可以了。高斯模糊特效只是这两个插件的一小部分功能,还有很多好用的效果,例如bloom、噪点等等,大家可以自己研究一下。
不过有个坑就是移动端最好使用ImageEffect更加稳定一些,我在项目中最开始时使用PostProcess实现的效果,结果在低端机上测试出现花屏现象。查了一下好像是低端机的GPU不支持新的shader api造成的。下面是两种插件的链接。
1.ImageEffect
2.PostProcess
因为要实现模糊对话面板后面背景的效果,所以就不能通过直接给相机添加特效实现,而是要做成类似遮罩划分出层级。在网上试了好多种shader,下面是我试过其中最好用的。
使用方法:先把image的透明度设置为0,然后把加有shader的material赋给image就可以了。具体效果可以通过改变material上的参数调节。
Shader "Custom/MaskedUIBlur" {
Properties {
_Size ("Blur", Range(0, 30)) = 1
[HideInInspector] _MainTex ("Masking Texture", 2D) = "white" {}
_AdditiveColor ("Additive Tint color", Color) = (0, 0, 0, 0)
_MultiplyColor ("Multiply Tint color", Color) = (1, 1, 1, 1)
}
Category {
// We must be transparent, so other objects are drawn before this one.
Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Opaque" }
SubShader
{
// Horizontal blur
GrabPass
{
"_HBlur"
}
/*
ZTest Off
Blend SrcAlpha OneMinusSrcAlpha
*/
Cull Off
Lighting Off
ZWrite Off
ZTest [unity_GUIZTestMode]
Blend SrcAlpha OneMinusSrcAlpha
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#pragma fragmentoption ARB_precision_hint_fastest
#include "UnityCG.cginc"
struct appdata_t {
float4 vertex : POSITION;
float2 texcoord : TEXCOORD0;
};
struct v2f {
float4 vertex : POSITION;
float4 uvgrab : TEXCOORD0;
float2 uvmain : TEXCOORD1;
};
sampler2D _MainTex;
float4 _MainTex_ST;
v2f vert (appdata_t v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
#if UNITY_UV_STARTS_AT_TOP
float scale = -1.0;
#else
float scale = 1.0;
#endif
o.uvgrab.xy = (float2(o.vertex.x, o.vertex.y * scale) + o.vertex.w) * 0.5;
o.uvgrab.zw = o.vertex.zw;
o.uvmain = TRANSFORM_TEX(v.texcoord, _MainTex);
return o;
}
sampler2D _HBlur;
float4 _HBlur_TexelSize;
float _Size;
float4 _AdditiveColor;
float4 _MultiplyColor;
half4 frag( v2f i ) : COLOR
{
half4 sum = half4(0,0,0,0);
#define GRABPIXEL(weight,kernelx) tex2Dproj( _HBlur, UNITY_PROJ_COORD(float4(i.uvgrab.x + _HBlur_TexelSize.x * kernelx * _Size, i.uvgrab.y, i.uvgrab.z, i.uvgrab.w))) * weight
sum += GRABPIXEL(0.05, -4.0);
sum += GRABPIXEL(0.09, -3.0);
sum += GRABPIXEL(0.12, -2.0);
sum += GRABPIXEL(0.15, -1.0);
sum += GRABPIXEL(0.18, 0.0);
sum += GRABPIXEL(0.15, +1.0);
sum += GRABPIXEL(0.12, +2.0);
sum += GRABPIXEL(0.09, +3.0);
sum += GRABPIXEL(0.05, +4.0);
half4 result = half4(sum.r * _MultiplyColor.r + _AdditiveColor.r,
sum.g * _MultiplyColor.g + _AdditiveColor.g,
sum.b * _MultiplyColor.b + _AdditiveColor.b,
tex2D(_MainTex, i.uvmain).a);
return result;
}
ENDCG
}
// Vertical blur
GrabPass
{
"_VBlur"
}
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#pragma fragmentoption ARB_precision_hint_fastest
#include "UnityCG.cginc"
struct appdata_t {
float4 vertex : POSITION;
float2 texcoord: TEXCOORD0;
};
struct v2f {
float4 vertex : POSITION;
float4 uvgrab : TEXCOORD0;
float2 uvmain : TEXCOORD1;
};
sampler2D _MainTex;
float4 _MainTex_ST;
v2f vert (appdata_t v) {
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
#if UNITY_UV_STARTS_AT_TOP
float scale = -1.0;
#else
float scale = 1.0;
#endif
o.uvgrab.xy = (float2(o.vertex.x, o.vertex.y * scale) + o.vertex.w) * 0.5;
o.uvgrab.zw = o.vertex.zw;
o.uvmain = TRANSFORM_TEX(v.texcoord, _MainTex);
return o;
}
sampler2D _VBlur;
float4 _VBlur_TexelSize;
float _Size;
float4 _AdditiveColor;
float4 _MultiplyColor;
half4 frag( v2f i ) : COLOR
{
half4 sum = half4(0,0,0,0);
#define GRABPIXEL(weight,kernely) tex2Dproj( _VBlur, UNITY_PROJ_COORD(float4(i.uvgrab.x, i.uvgrab.y + _VBlur_TexelSize.y * kernely * _Size, i.uvgrab.z, i.uvgrab.w))) * weight
sum += GRABPIXEL(0.05, -4.0);
sum += GRABPIXEL(0.09, -3.0);
sum += GRABPIXEL(0.12, -2.0);
sum += GRABPIXEL(0.15, -1.0);
sum += GRABPIXEL(0.18, 0.0);
sum += GRABPIXEL(0.15, +1.0);
sum += GRABPIXEL(0.12, +2.0);
sum += GRABPIXEL(0.09, +3.0);
sum += GRABPIXEL(0.05, +4.0);
half4 result = half4(sum.r * _MultiplyColor.r + _AdditiveColor.r,
sum.g * _MultiplyColor.g + _AdditiveColor.g,
sum.b * _MultiplyColor.b + _AdditiveColor.b,
tex2D(_MainTex, i.uvmain).a);
return result;
}
ENDCG
}
}
}
}