显示 / 隐藏 文章目录 ]

Shader

上次更新: 2024-03-15 14:44:57

坐标系

常规屏幕坐标系

范围:从 (0,0) 开始到 (屏幕宽度-1, 屏幕高度-1)。对于4k显示器来说,就是有3840x2160个像素

  • 原点位置:左上角。
  • X轴方向:水平向右增加。
  • Y轴方向:垂直向下增加。

归一化

将屏幕归一化,保证图形效果在不同尺寸和分辨率的屏幕上保持一致,gl_FragCoord是当前像素的位置,举个例子,理解这个渲染过程:

  • gl_FragCoord:这就像是你正在查看其中一张小照片,并且知道它在大照片中的确切位置。gl_FragCoord.xy 给出的是当前这张小照片(或者说屏幕上的一个像素)在整个大照片(即屏幕)中的位置坐标。

  • iResolution.xy:这是告诉你大照片的总大小,也就是屏幕的分辨率。对于 4K 显示器,这个值是 3840x2160。

  • gl_FragCoord/iResolution.xy:现在,如果你想知道这张小照片(像素)在大照片(屏幕)中的相对位置,你可以将小照片的位置gl_FragCoord.xy 除以大照片的总大小iResolution.xy。这样做的结果是,无论大照片有多大,你都能得到一个介于 0 到 1 之间的比例值,表示这张小照片在大照片中的相对位置。

step 阶跃函数

对每个分量独立计算的,每个分量的比较结果独立决定

  • 如果 st.x >= 0.1,则 bl.x 为 1.0;如果 st.x < 0.1,则 bl.x 为 0.0。
  • 如果 st.y >= 0.1,则 bl.y 为 1.0;如果 st.y < 0.1,则 bl.y 为 0.0。
vec2 bl = step(vec2(0.1), st);

重拾纯粹的写作