Home>
This blur can also be divided into two types,One is self-ambiguity,One is to blur the values from the screen.The first one is used for some small list displays,For example, when unlocked,Is vague.The second is to highlight the effect of the frame,Blur out the background,Enhancing this a little bit myself can specify a blur position.
For mobile platforms,Use Gaussian blur,Actually the efficiency is not very high,For good results,Then speed cardIf i want speed,Then the effect does not meet the requirements.But still record here,Maybe use it later.
Let ’s talk about the first one first,Blur effect hanging under image.
shader "custom/frontblur" {
properties
{
[perrendererdata] _maintex ("sprite texture", 2d)="white" {}
_color ("tint", color)=(1,1,1,1)
[hideininspector] _stencilcomp ("stencil comparison", float)=8
[hideininspector] _stencil ("stencil id", float)=0
[hideininspector] _stencilop ("stencil operation", float)=0
[hideininspector] _stencilwritemask ("stencil write mask", float)=255
[hideininspector] _stencilreadmask ("stencil read mask", float)=255
[hideininspector] _colormask ("color mask", float)=15
[toggle (unity_ui_alphaclip)] _useuialphaclip ("use alpha clip", float)=0
_size ("size", range (0, 50))=5
}
subshader
{
tags
{
"queue"="transparent"
"ignoreprojector"="true"
"rendertype"="transparent"
"previewtype"="plane"
"canusespriteatlas"="true"
}
stencil
{
ref [_stencil]
comp [_stencilcomp]
pass [_stencilop]
readmask [_stencilreadmask]
writemask [_stencilwritemask]
}
cull off
lighting off
zwrite off
ztest [unity_guiztestmode]
blend srcalpha oneminussrcalpha
colormask [_colormask]
pass
{
name "frontblurhor"
cgprogram
#pragma vertex vert
#pragma fragment frag
#pragma target 2.0
#include "unitycg.cginc"
#include "unityui.cginc"
#pragma multi_compile __ unity_ui_alphaclip
struct appdata_t
{
float4 vertex:position;
float4 color:color;
float2 texcoord:texcoord0;
Unity_vertex_input_instance_id
};
struct v2f
{
float4 vertex:sv_position;
fixed4 color:color;
float2 texcoord:texcoord0;
float4 worldposition:texcoord1;
Unity_vertex_output_stereo
};
fixed4 _color;
fixed4 _texturesampleadd;
float4 _cliprect;
v2f vert (appdata_t in)
{
v2f out;
unity_setup_instance_id (in);
unity_initialize_vertex_output_stereo (out);
out.worldposition=in.vertex;
out.vertex=unityobjecttoclippos (out.worldposition);
out.texcoord=in.texcoord;
out.color=in.color * _color;
return out;
}
sampler2d _maintex;
float4 _maintex_texelsize;
float _size;
half4 grabpixel (v2f i, float weight, float kernelx) {
if (_size<= 1 || weight == 0) {
return tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size, i.texcoord.y)) * weight;
} else {
half4 sum=half4 (0,0,0,0);
sum +=tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size * 0.2, i.texcoord.y)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size * 0.4, i.texcoord.y)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size * 0.6, i.texcoord.y)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size * 0.8, i.texcoord.y)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x + _maintex_texelsize.x * kernelx * _size * 1.0, i.texcoord.y)) * 0.2;
return (sum + _texturesampleadd) * weight;
}
}
half4 grabpixely (v2f i, float weight, float kernely) {
if (_size<= 1 || weight == 0) {
return tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size)) * weight;
} else {
half4 sum=half4 (0,0,0,0);
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.2)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.4)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.6)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.8)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 1.0)) * 0.2;
return (sum + _texturesampleadd) * weight;
}
}
fixed4 frag (v2f in):sv_target
{
half4 sum=half4 (0,0,0,0);
//#define grabpixel (weight, kernelx) (tex2d (_maintex, half2 (in.texcoord.x + _maintex_texelsize.x * kernelx * _size, in.texcoord.y)) + _texturesampleadd) * weight
//sum +=grabpixel (in, 0.05, -4.0);
//sum +=grabpixel (in, 0.09, -3.0);
//sum +=grabpixel (in, 0.12, -2.0);
//sum +=grabpixel (in, 0.15, -1.0);
//sum +=grabpixel (in, 0.18, 0.0);
//sum +=grabpixel (in, 0.15, +1.0);
//sum +=grabpixel (in, 0.12, +2.0);
//sum +=grabpixel (in, 0.09, +3.0);
//sum +=grabpixel (in, 0.05, +4.0);
for (int i=0;i<9;i ++) {
sum +=grabpixel (in, 1.0/9, i-4.0);
}
//half4 sumy=half4 (0,0,0,0);
//for (int i=0;i<15;i ++) {
//sumy +=grabpixely (in, 1.0/15, i-7.0);
//}
//half4 sum=(sumx + sumy) * 0.5;
//sum +=grabpixel (in, 0.01, -9.0);
//sum +=grabpixel (in, 0.02, -8.0);
//sum +=grabpixel (in, 0.03, -7.0);
//sum +=grabpixel (in, 0.04, -6.0);
//sum +=grabpixel (in, 0.05, -5.0);
//sum +=grabpixel (in, 0.06, -4.0);
//sum +=grabpixel (in, 0.07, -3.0);
//sum +=grabpixel (in, 0.08, -2.0);
//sum +=grabpixel (in, 0.09, -1.0);
//sum +=grabpixel (in, 0.10, 0.0);
//sum +=grabpixel (in, 0.09, +1.0);
//sum +=grabpixel (in, 0.08, +2.0);
//sum +=grabpixel (in, 0.07, +3.0);
//sum +=grabpixel (in, 0.06, +4.0);
//sum +=grabpixel (in, 0.05, +5.0);
//sum +=grabpixel (in, 0.04, +6.0);
//sum +=grabpixel (in, 0.03, +7.0);
//sum +=grabpixel (in, 0.02, +8.0);
//sum +=grabpixel (in, 0.01, +9.0);
sum=sum * in.color;
sum.a *=unityget2dclipping (in.worldposition.xy, _cliprect);
#ifdef unity_ui_alphaclip
clip (sum.a-0.001);
#endif
return sum;
//float distance=_distance;
//fixed4 color=(tex2d (_maintex, in.texcoord) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color/= 9;
//color.a *=unityget2dclipping (in.worldposition.xy, _cliprect);
//#ifdef unity_ui_alphaclip
//clip (color.a-0.001);
//#endif
//return color;
}
endcg
}
pass
{
name "frontblurver"
cgprogram
#pragma vertex vert
#pragma fragment frag
#pragma target 2.0
#include "unitycg.cginc"
#include "unityui.cginc"
#pragma multi_compile __ unity_ui_alphaclip
struct appdata_t
{
float4 vertex:position;
float4 color:color;
float2 texcoord:texcoord0;
Unity_vertex_input_instance_id
};
struct v2f
{
float4 vertex:sv_position;
fixed4 color:color;
float2 texcoord:texcoord0;
float4 worldposition:texcoord1;
Unity_vertex_output_stereo
};
fixed4 _color;
fixed4 _texturesampleadd;
float4 _cliprect;
v2f vert (appdata_t in)
{
v2f out;
unity_setup_instance_id (in);
unity_initialize_vertex_output_stereo (out);
out.worldposition=in.vertex;
out.vertex=unityobjecttoclippos (out.worldposition);
out.texcoord=in.texcoord;
out.color=in.color * _color;
return out;
}
sampler2d _maintex;
float4 _maintex_texelsize;
float _size;
half4 grabpixel (v2f i, float weight, float kernely) {
if (_size<= 1 || weight == 0) {
return tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size)) * weight;
} else {
half4 sum=half4 (0,0,0,0);
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.2)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.4)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.6)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 0.8)) * 0.2;
sum +=tex2d (_maintex, half2 (i.texcoord.x, i.texcoord.y + _maintex_texelsize.y * kernely * _size * 1.0)) * 0.2;
return (sum + _texturesampleadd) * weight;
}
}
fixed4 frag (v2f in):sv_target
{
half4 sum=half4 (0,0,0,0);
//#define grabpixel (weight, kernely) (tex2d (_maintex, half2 (in.texcoord.x, in.texcoord.y + _maintex_texelsize.y * kernely * _size)) + _texturesampleadd) * weight
//sum +=grabpixel (in, 0.05, -4.0);
//sum +=grabpixel (in, 0.09, -3.0);
//sum +=grabpixel (in, 0.12, -2.0);
//sum +=grabpixel (in, 0.15, -1.0);
//sum +=grabpixel (in, 0.18, 0.0);
//sum +=grabpixel (in, 0.15, +1.0);
//sum +=grabpixel (in, 0.12, +2.0);
//sum +=grabpixel (in, 0.09, +3.0);
//sum +=grabpixel (in, 0.05, +4.0);
for (int i=0;i<9;i ++) {
sum +=grabpixel (in, 1.0/9, i-4.0);
}
//sum +=grabpixel (in, 0.01, -9.0);
//sum +=grabpixel (in, 0.02, -8.0);
//sum +=grabpixel (in, 0.03, -7.0);
//sum +=grabpixel (in, 0.04, -6.0);
//sum +=grabpixel (in, 0.05, -5.0);
//sum +=grabpixel (in, 0.06, -4.0);
//sum +=grabpixel (in, 0.07, -3.0);
//sum +=grabpixel (in, 0.08, -2.0);
//sum +=grabpixel (in, 0.09, -1.0);
//sum +=grabpixel (in, 0.10, 0.0);
//sum +=grabpixel (in, 0.09, +1.0);
//sum +=grabpixel (in, 0.08, +2.0);
//sum +=grabpixel (in, 0.07, +3.0);
//sum +=grabpixel (in, 0.06, +4.0);
//sum +=grabpixel (in, 0.05, +5.0);
//sum +=grabpixel (in, 0.04, +6.0);
//sum +=grabpixel (in, 0.03, +7.0);
//sum +=grabpixel (in, 0.02, +8.0);
//sum +=grabpixel (in, 0.01, +9.0);
sum=sum * in.color;
sum.a *=unityget2dclipping (in.worldposition.xy, _cliprect);
#ifdef unity_ui_alphaclip
clip (sum.a-0.001);
#endif
return sum;
//float distance=_distance;
//fixed4 color=(tex2d (_maintex, in.texcoord) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x + distance, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y-distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x-distance, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color +=(tex2d (_maintex, half2 (in.texcoord.x, in.texcoord.y + distance)) + _texturesampleadd) * in.color;
//color/= 9;
//color.a *=unityget2dclipping (in.worldposition.xy, _cliprect);
//#ifdef unity_ui_alphaclip
//clip (color.a-0.001);
//#endif
//return color;
}
endcg
}
}
}
There are two passes to calculate in this way, the effect of this calculation will be much better,Then I interviewed and calculated more,The more layers,The higher the effect,It also means more fluent.Place the shader on a new shader.Then drag the material to the material property bar of the image component.
See the effect:
Then say the second way,It is to blur the background.
shader "custom/backblur"
{
properties
{
[perrendererdata] _maintex ("sprite texture", 2d)="white" {}
_color ("main color", color)=(1,1,1,1)
_size ("size", range (0, 20))=1
}
category {
//we must be transparent, so other objects are drawn before this one.
tags {
"queue"="transparent"
"ignoreprojector"="true"
"rendertype"="transparent"
"previewtype"="plane"
"canusespriteatlas"="true"
}
subshader {
//horizontal blur
grabpass {
tags {"lightmode"="always"}
}
pass {
tags {"lightmode"="always"}
name "backblurhor"
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;
float4 color:color;
};
struct v2f {
float4 vertex:position;
float4 uvgrab:texcoord0;
float4 color:color;
};
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.color=v.color;
return o;
}
sampler2d _grabtexture;
float4 _grabtexture_texelsize;
float4 _maintex_texelsize;
float _size;
uniform float4 _color;
//static float gaussiankernel [9]={
//0.05, 0.09, 0.12, //0.15, 0.18, 0.15, //0.12, 0.09, 0.05
//};
//static float gaussiankernel [19]={
//0.01, 0.02, 0.03, 0.04, 0.05, 0.06, 0.07, 0.08, 0.09, //0.1, //0.09, 0.08, 0.07, 0.06, 0.05, 0.04, 0.03, 0.02, 0.01, //};
//static float gaussiankerneld [19]={
//-9.0, -8.0, -7.0, -6.0, -5.0, -4.0, -3.0, -2.0, -1.0, //0.0, //+1.0, +2.0, +3.0, +4.0, +5.0, +6.0, +7.0, +8.0, +9.0, //};
half4 grabpixel (v2f i, float weight, float kernelx) {
if (i.uvgrab.x == 0&&i.uvgrab.y == 0) {
kernelx=0;
}
return tex2dproj (_grabtexture, unity_proj_coord (float4 (i.uvgrab.x + _grabtexture_texelsize.x * kernelx * _size, i.uvgrab.y, i.uvgrab.z, i.uvgrab.w)) * weight;
}
half4 frag (v2f i):color {
half4 sum=half4 (0,0,0,0);
//#define grabpixel (weight, kernelx) tex2dproj (_grabtexture, unity_proj_coord (float4 (i.uvgrab.x + _grabtexture_texelsize.x * kernelx * _size, i.uvgrab.y, i.uvgrab.w) )) * weight
sum +=grabpixel (i, 0.05, -4.0);
sum +=grabpixel (i, 0.09, -3.0);
sum +=grabpixel (i, 0.12, -2.0);
sum +=grabpixel (i, 0.15, -1.0);
sum +=grabpixel (i, 0.18, 0.0);
sum +=grabpixel (i, 0.15, +1.0);
sum +=grabpixel (i, 0.12, +2.0);
sum +=grabpixel (i, 0.09, +3.0);
sum +=grabpixel (i, 0.05, +4.0);
//sum +=grabpixel (i, 0.01, -9.0);
//sum +=grabpixel (i, 0.02, -8.0);
//sum +=grabpixel (i, 0.03, -7.0);
//sum +=grabpixel (i, 0.04, -6.0);
//sum +=grabpixel (i, 0.05, -5.0);
//sum +=grabpixel (i, 0.06, -4.0);
//sum +=grabpixel (i, 0.07, -3.0);
//sum +=grabpixel (i, 0.08, -2.0);
//sum +=grabpixel (i, 0.09, -1.0);
//sum +=grabpixel (i, 0.10, 0.0);
//sum +=grabpixel (i, 0.09, +1.0);
//sum +=grabpixel (i, 0.08, +2.0);
//sum +=grabpixel (i, 0.07, +3.0);
//sum +=grabpixel (i, 0.06, +4.0);
//sum +=grabpixel (i, 0.05, +5.0);
//sum +=grabpixel (i, 0.04, +6.0);
//sum +=grabpixel (i, 0.03, +7.0);
//sum +=grabpixel (i, 0.02, +8.0);
//sum +=grabpixel (i, 0.01, +9.0);
float4 col5=tex2dproj (_grabtexture, unity_proj_coord (i.uvgrab));
float decayfactor=1.0f;
if (i.uvgrab.x == 0&&i.uvgrab.y == 0) {
decayfactor=0;
}
sum=lerp (col5, sum, decayfactor) * i.color * _color;
return sum;
}
endcg
}
//vertical blur
grabpass {
tags {"lightmode"="always"}
}
pass {
tags {"lightmode"="always"}
name "backblurver"
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;
float4 color:color;
};
struct v2f {
float4 vertex:position;
float4 uvgrab:texcoord0;
float4 color:color;
};
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.color=v.color;
return o;
}
sampler2d _grabtexture;
float4 _grabtexture_texelsize;
float _size;
uniform float4 _color;
half4 grabpixel (v2f i, float weight, float kernely) {
if (i.uvgrab.x == 0&&i.uvgrab.y == 0) {
kernely=0;
}
return tex2dproj (_grabtexture, unity_proj_coord (float4 (i.uvgrab.x, i.uvgrab.y + _grabtexture_texelsize.y * kernely * _size, i.uvgrab.z, i.uvgrab.w))) * weight;
}
half4 frag (v2f i):color {
half4 sum=half4 (0,0,0,0);
//#define grabpixel (weight, kernely) tex2dproj (_grabtexture, unity_proj_coord (float4 (i.uvgrab.x, i.uvgrab.y + _grabtexture_texelsize.y * kernely * _size, i.uvgrab.z, i.uvgrab.w) )) * weight
sum +=grabpixel (i, 0.05, -4.0);
sum +=grabpixel (i, 0.09, -3.0);
sum +=grabpixel (i, 0.12, -2.0);
sum +=grabpixel (i, 0.15, -1.0);
sum +=grabpixel (i, 0.18, 0.0);
sum +=grabpixel (i, 0.15, +1.0);
sum +=grabpixel (i, 0.12, +2.0);
sum +=grabpixel (i, 0.09, +3.0);
sum +=grabpixel (i, 0.05, +4.0);
//sum +=grabpixel (i, 0.01, -9.0);
//sum +=grabpixel (i, 0.02, -8.0);
//sum +=grabpixel (i, 0.03, -7.0);
//sum +=grabpixel (i, 0.04, -6.0);
//sum +=grabpixel (i, 0.05, -5.0);
//sum +=grabpixel (i, 0.06, -4.0);
//sum +=grabpixel (i, 0.07, -3.0);
//sum +=grabpixel (i, 0.08, -2.0);
//sum +=grabpixel (i, 0.09, -1.0);
//sum +=grabpixel (i, 0.10, 0.0);
//sum +=grabpixel (i, 0.09, +1.0);
//sum +=grabpixel (i, 0.08, +2.0);
//sum +=grabpixel (i, 0.07, +3.0);
//sum +=grabpixel (i, 0.06, +4.0);
//sum +=grabpixel (i, 0.05, +5.0);
//sum +=grabpixel (i, 0.04, +6.0);
//sum +=grabpixel (i, 0.03, +7.0);
//sum +=grabpixel (i, 0.02, +8.0);
//sum +=grabpixel (i, 0.01, +9.0);
float4 col5=tex2dproj (_grabtexture, unity_proj_coord (i.uvgrab));
float decayfactor=1.0f;
if (i.uvgrab.x == 0&&i.uvgrab.y == 0) {
decayfactor=0;
}
sum=lerp (col5, sum, decayfactor) * i.color * _color;
return sum;
}
endcg
}
}
}
}
The calculation is the same,But this is relatively slow,After all, the entire screen is calculated,Definitely slower.The usage is the same,The shader is placed on a new shader,Then drag the shader to the material property of an image component.Here you can adjust the width and height of the image so that you can specify which area to blur.
See the effect:
Then I moved and adjusted the width and height:
Of course, you can also adjust the entire screen to blur:
Trends
- python - you may need to restart the kernel to use updated packages error
- dart - flutter: the instance member'stars' can't be accessed in an initializer error
- php - coincheck api authentication doesn't work
- php - i would like to introduce the coincheck api so that i can make payments with bitcoin on my ec site
- [php] i want to get account information using coincheck api
- the emulator process for avd pixel_2_api_29 was killed occurred when the android studio emulator was started, so i would like to
- javascript - how to check if an element exists in puppeteer
- sh - 'apt-get' is not recognized as an internal or external command, operable program or batch file
- i want to check the type of a shell script variable
- i want to call a child component method from a parent in vuejs