GLSL 效果示例

SDF 布尔运算:给方块挖一个移动的圆孔

圆穿过方块时,只有重叠区域被挖空。

在线示例

修改右侧代码,左侧预览会实时更新。

观察什么

圆穿过方块时,只有重叠区域被挖空。

实现原理

减法使用 max(a,-b):保留方形内部,同时排除圆形内部。

找到控制效果的代码

float a=box(p,vec2(.55)),b=length(p-vec2(sin(u_time*.6)*.4,0))-(.15+.25*u_parameter);float d=max(a,-b);c=mix(c,vec3(.7,.4,1.),1.-smoothstep(-aa,aa,d));

动手修改

把圆孔半径 .15+.25*u_parameter 设为 .4。运动圆孔会增大,紫色方块的半尺寸仍使用 vec2(.55)。

调试与成本

合并场 max(a,-b) 只保留方块内、圆外的部分。把它换成 max(a,b),会由减法变成交集,只显示两图形共同内部,仍使用同样两次距离计算。

用到的内置函数

一步步学会这个效果