条纹与带状图案

fract 把坐标在 0~1 范围内重复多次，step 把每次重复分成两半——这是制造条纹的基本方法。

fract 制造重复

vUv.x * 12.0 把 01 拉伸到 012。fract 取小数部分，相当于每隔 1 重置一次——把整个画面分成 12 段，每段内 x 都是 0~1。

step 分两半

每段内，x < 0.5 时遮罩为 0（colorA），x >= 0.5 时遮罩为 1（colorB）。结果就是等宽的交替条纹。

练习

练习代码里 stripeCount = 8.0（8 条纹）。把 stripeCount 改成 12.0，让条纹数量和参考图一致。

答案解析

stripeCount 越大，条纹越细越密。step(0.5, x) 的阈值 0.5 让两种颜色宽度相等；改成 step(0.3, x) 则 colorA 占 30%，colorB 占 70%。

把 vUv.x 换成 vUv.y 得到水平条纹，换成 (vUv.x + vUv.y) * 0.5 得到对角条纹。