二维 glsl 着色器转换

2D glsl shader transformation

我想创建一个着色器来在使用 libgdx 构建的 2D 场景中模拟伪 3D 水面。这个想法是重新创建以下效果:

http://forums.tigsource.com/index.php?topic=40539.msg1104986#msg1104986

但我一直在创建梯形形状,我想我不明白如何在 opengl 着色器上计算纹理坐标。我可以在顶点着色器中修改顶点还是可以在片段着色器中置换纹理?

这是我做过的测试,但没有按预期工作。

顶点着色器:

attribute vec4 a_position;
attribute vec4 a_color;
attribute vec2 a_texCoord0;

uniform mat4 u_projTrans;

varying vec4 v_color;
varying vec2 v_texCoord0;

void main()
{
    v_color = a_color;
    float factor = (a_texCoord0.x - 0.5) * (a_texCoord0.y);
    v_texCoord0 = a_texCoord0;
    v_texCoord0.x += factor;
    gl_Position =  u_projTrans * a_position;
}

片段着色器只是一个直通

varying vec4 v_color;
varying vec2 v_texCoord0;

uniform sampler2D u_texture;

void main()
{
    gl_FragColor = v_color * texture2D(u_texture, v_texCoord0);
}

和结果图像

我确定我的方法太天真了。

最后,我决定只使用片段着色器来实现效果。 假深度计算是通过在 Y 轴上应用 X 位移来完成的。

这是代码片段:

// simulate 3D surface
vec2 new_coord = v_texCoord0;
// calculate the stretching factor
float factor = ((0.5 - new_coord.x) * new_coord.y);
// apply the factor and stretch the image
new_coord.x += factor;

gl_FragColor = texture2D(u_texture, new_coord);