Shader特效——实现“羽化”【GLSL】

原理参考自 小熊不去实验室 的博客


在PHOTOSHOP里,羽化就是使你选定范围的图边缘达到朦胧的效果。

羽化值越大,朦胧范围越宽,羽化值越小,朦胧范围越窄。可根据你想留下图的大小来调节。

算法分析:

1、通过对rgb值增加额外的V值实现朦胧效果

2、通过控制V值的大小实现范围控制。

3、V = 255 * 当前点Point距中点距离的平方s1 / (顶点距中点的距离平方 *mSize)s2;

4、s1 有根据 ratio 修正 dx dy值。


原图:

Shader特效——实现“羽化”【GLSL】_第1张图片


效果图:

Shader特效——实现“羽化”【GLSL】_第2张图片


片元着色器代码:


uniform sampler2D Tex;
const float size = 0.5;

void main(void)
{
   vec2 realSize = vec2(textureSize(Tex, 0));
   float ratio = (realSize.x > realSize.y) ? 
   realSize.y/realSize.x : realSize.x/realSize.y;
   
   vec2 texSize = vec2(512., 512.);
   vec2 xy = gl_FragCoord.xy;
   
   if(realSize.x > realSize.y)
   {
      xy.x = xy.x * ratio;
   }
   else
   {
      xy.y = xy.y * ratio;
   }
   
   vec2 center = vec2(texSize/2.);

// ----------------------------------------------------

   float maxV = dot(center, center);
   float minV = floor(maxV*(1. - size));
   float diff = maxV - minV;
   
   vec2 uv = xy / texSize;
   
   vec4 srcColor = texture2D(Tex, uv);

   float dx = center.x - xy.x;
   float dy = center.y - xy.y;
   
   float dstSq = pow(dx, 2.) + pow(dy, 2.);
   
   float v = (dstSq / diff);
   float r = clamp(srcColor.r + v, 0., 1.);
   float g = clamp(srcColor.g + v, 0., 1.);
   float b = clamp(srcColor.b + v, 0., 1.);
   
   gl_FragColor = vec4( r, g, b, 1.0 );
}


你可能感兴趣的:(Shader,Shader实例解析)