OpenGL vertex shader precision issues

Question

I'm trying to make a vertex shader that will make the screen wiggle, like it was made of waves. This is fine, except that I didn't realize that vertex shaders were in fact by vertices, when soing 2D as well, I thought it was by pixels.

This means that a large sprite, will only wiggle in the top and buttom, whereas I would like it to wiggle all the way down, is there any way to make it use more vertices on a given sprite? Except for chopping up the sprite that is?

Note: I'm using ´libgx´ in java.

Here's the shader:

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

uniform mat4 u_projTrans;
uniform float off = 0.0f;

varying vec4 vColor;
varying vec2 vTexCoord;
varying vec4 pos;

void main() {
    vColor = a_color;
    vTexCoord = a_texCoord0;
    pos = a_position;
    pos.x = pos.x + sin(pos.y/10+off)*10;
    gl_Position = u_projTrans * pos;
}

as you can see the text waves very nicely, because theyr y coordinates are close, but the sprites should wave multiple times, but are unable to do so, because of the lack of vetors.

Answer 1

Subdivide the sprites geometry

From what I see you are trying to do transformations on the vertex program. It does actually move only vertices so you control 4 points here. Therefore you will not have the wiggle effect you wanted.

Fragment Shader Solution

One of the solutions is to do the effect on the fragment shader and transform the texture coords. But you will have to increase the sprite size by some padding margin that will display the displacement.

I think you might get the most optimal solution with this because you don't need to pass additional geometry then.

gl_FragColor = 
texture2D(myTexture, 
  vec2(gl_TexCoord[0].x + 0.1 * sin(gl_TexCoord[0].y * 10), gl_TexCoord[0].y));

Geometry Solution

The second solution is to not have a single quad as a sprite but a subdivided vertically quad stack.

Problem Explanation image