Question

使用简单的着色器我找到了一种创建渐变的方法。这是我工作的结果： http://goo.gl/A7pY01（OpenGL ES 2.0 Shader - 2D Radial Gradient in Polygon问题后稍微更新）

这很好，但我仍然需要在我的网格的每个面上显示这个渐变模式。或者在广告牌脸上，就像它是一个纹理。

glsl函数gl_FragCoord返回与窗口相关的坐标。有人可以解释我如何将其转化为与面部相关的坐标，然后绘制我的模式吗？

Answer 1

奥基。 stackoverflow的一点冲浪给了我这个主题：OpenGL: How to render perfect rectangular gradient?

以下是含义字符串：gl_FragColor = mix(color0, color1, uv.u + uv.v - 2 * uv.u * uv.v);

当然我们无法将窗口空间坐标转换为“面部相关”的东西，但我们可以使用面部的UV坐标。所以，我决定，如果我们有一个正方形面，其uv坐标对应于全尺寸纹理（如0,0; 0,1; 1,0; 1,1）;所以结构的中心是0.5,0.5。这可能是我的圆形渐变的中心。

所以我的片段着色器代码是：

vec2 u_c = vec2(0.5,0.5);

float distanceFromLight = length(uv - u_c);

gl_FragColor = mix(vec4(1.,0.5,1.,1.), vec4(0.,0.,0.,1.), distanceFromLight*2.0);

顶点着色器：

gl_Position = _mvProj * vec4(vertex, 1.0);
uv = uv1;

当然，我们需要提供正确的UV坐标，但要明白这一点。

这是一个例子： http://goo.gl/A7pY01

如何在OpenGL中使用着色器在每个面上制作径向渐变

1 个答案: