一个笑脸

没什么可说的，很简单通过拼凑出一个笑脸。

 

通过smoothstep抗锯齿，在圆的边界a值有一个平滑的过渡，而不是0-1的尖锐变化；

控制vec4 fragColor.a来表现透明通道，圆的区域和其他区域唯一的区别就是a值不同；

通过mix来实现图层融合，第二个参数为上层的图层，原理是mix(a,b,t)的返回值是 a(1-t)+bt , 在此处t=a , 将导致b图层有图像的地方（圆的绘制区域a为1）将会覆盖a图层中该范围的颜色信息；

vec4 Circle(vec2 uv,float radius,vec2 orign,float blur,vec3 color)
{
    float d = length( uv - orign );
    float c = smoothstep( radius,radius - blur,d );
    vec4 fragcolor = vec4(color,c);
    return fragcolor;
    
}


void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord/iResolution.xy;
    uv -=0.5;
    uv.x *= iResolution.x/iResolution.y;

    vec4 layer1 = Circle(uv , 0.25 , vec2(0,0) , 0.01 , vec3(1.,1.,0.));
    vec4 layer2 = Circle(uv , 0.2 , vec2(0.,-0.001) , 0.01, vec3(0.,0.,0.));
    vec4 layer3 = Circle(uv , 0.22 , vec2(0,0.03) , 0.01 , vec3(1.,1.,0.));
    vec4 layer4 = Circle(uv , 0.05 , vec2(0.1,0.1) , 0.01, vec3(0.,0.,0.));
    vec4 layer5 = Circle(uv , 0.05 , vec2(-0.1,0.1) , 0.01, vec3(0.,0.,0.));
    
    
    fragColor = mix(fragColor,layer1,layer1.a);
    fragColor = mix(fragColor,layer2,layer2.a);
    fragColor = mix(fragColor,layer3,layer3.a);
    fragColor = mix(fragColor,layer4,layer4.a);
    fragColor = mix(fragColor,layer5,layer5.a);
    
}

链接在此： https://www.shadertoy.com/view/fssGWj