Repeat texture in a scrolling game

Question

The bottom region of the screen is filled by a repeated texture:

grassTexture = new Texture(Gdx.files.internal("images/grass.png"));
grassTexture.setWrap(TextureWrap.Repeat, TextureWrap.Repeat);
grassSprite = new Sprite(grassTexture, 0, 0, width,grassTexture.getHeight());

However, The grass should also be scrolled to the left (looping texture from edge to edge). I have got this in the render() method:

scrollTimer += 0.0007f;
if (scrollTimer > 1.0f)
        scrollTimer = 0.0f;
grassSprite.setU(scrollTimer);
grassSprite.setU2(scrollTimer+1);
grassSprite.draw(spriteBatch);

The scrolling part now works. However, the grass texture is not repeated anymore. It looks like this:

Answer 1

I don't know libgdx enough, but I can hint you at a general approach I'd use:

• Draw the texture using a quad with a wide of screenWidth + textureWidth (instead of textureWidth you could use tileableWidth in case the texture itself repeats the tile already).
• Draw the quad at position x where x is animated using this formula: x = (x + dx) % textureWidth (again textureWidth could be tileableWidth; dx is the change per iteration, which could be fixed or time based depending on your implementation).

This will cause your texture to loop indefinitely, without requiring shaders, changing texture coordinates, etc. and without wasting unnecessary drawing time (only minimal overhead when trying to draw parts outside the screen).

---

Edit: With the attached pictures, I'd imagine the issue is this line:

grassSprite.setU2(scrollTimer+1);

By setting your right border to scrollTimer+1 you essentially tell the engine to repeat the texture exactly 1 time. This is wrong and the culprit here. The solution depends on the number of repetitions you need to fill the available space. For example, the following line should do the trick in case you have to repeat the texture 5 times to fill the given space:

grassSprite.setU2(scrollTimer+5);

---

Edit 2: Just noticed another mistake in your code that might make the textures "jump":

if (scrollTimer > 1.0f)
    scrollTimer = 0.0f;

This part should rather be something like this:

if (scrollTimer > 1.0f)
    scrollTimer -= 1.0f;