GLSL 效果示例
CRT 扫描线:让图像出现横纹和移动的亮带
条纹间距与亮带速度独立变化,原图始终可辨。
在线示例
修改右侧代码,左侧预览会实时更新。
观察什么
条纹间距与亮带速度独立变化,原图始终可辨。
实现原理
扫描线用屏幕像素坐标控制密度,移动亮带使用归一化坐标。两者的尺度与速度互不绑定。
找到控制效果的代码
vec3 image=texture2D(u_texture,uv).rgb;float scan=.75+.25*sin(gl_FragCoord.y*(1.+u_parameter*2.));float roll=exp(-pow((uv.y-fract(u_time*.12))*12.,2.));c=image*scan+roll*.15;
动手修改
把 fract(u_time*.12) 改为 fract(u_time*.24)。宽亮带会以两倍速度滚动,细扫描线间距不变,因为它由 gl_FragCoord.y 控制。
调试与成本
底图只需一次纹理采样,两种亮度图案都在之后计算。把 scan=.75+.25*sin(...) 中的幅度 .25 改为 0.,细扫描线会消失,运动亮带仍然可见。