TODO
基础函数: Smoothstep Sin Clamp Pow Length Sqrt
辅助函数: Saw WithIn Remap
图形: Circle Rect
图形
1.绘制圆点
//假设uv 是 (-0.5,-0.5) 到(.5,0.5)
//blur 是模糊程度 值越大边缘越模糊 0.0完全不模糊 1.0为正常模糊 负数 反向
inline float DrawCircle(float2 uv,float blur){
float val = 1.0-length(uv);
val = smoothstep(0.5,0.500001+blur*0.5,val);
return val;
}
下面是从左到右依次为 blur=-0.1 blur=0.0 blur=0.1 blur=1.0的图像:
<img src="http://127.0.0.1:4000/assets/img/blog/ShaderTutorial2D/BaseMath/circle01.jpg" width="128"> <img src="http://127.0.0.1:4000/assets/img/blog/ShaderTutorial2D/BaseMath/circle00.jpg" width="128"> <img src="http://127.0.0.1:4000/assets/img/blog/ShaderTutorial2D/BaseMath/circle01.jpg" width="128"> <img src="http://127.0.0.1:4000/assets/img/blog/ShaderTutorial2D/BaseMath/circle10.jpg" width="128">
<img align="right" src="https://raw.githubusercontent.com/mzlogin/mzlogin.github.io/master/images/posts/markdown/demo.png"/>
这是一个示例图片。
图片显示在 N 段文字的右边。
N 与图片高度有关。
刷屏行。
刷屏行。
到这里应该不会受影响了,本行应该延伸到了图片的正下方,所以我要足够长才能确保不同的屏幕下都看到效果。
随机值
.添加随机值
fixed2 Rand22(fixed2 co){
fixed x = frac(sin(dot(co.xy ,fixed2(122.9898,783.233))) * 43758.5453);
fixed y = frac(sin(dot(co.xy ,fixed2(457.6537,537.2793))) * 37573.5913);
return fixed2(x,y);
}
fract(sin(xbigVal1)bigVal2)产生的数比较随机的原因是:
sin(xbigVal1) 会将x值的变化波动被放大,且随机,设这个值的变化为detX,则 frac(detXbigVal2) 会让本来的小的波动再次放大,然后fract会让整体的数的变化受影响的因素变多,所以得到的了一个较为随机的值