Correct UV offset of full screen repeating texture

RepeatingBGTexture.zip (110.1 KB)

I need help with setting the UV offsets in this example probably. I tried a few ideas (what I thought would work) but it didn’t. It’s possible I did have the offset right properly previously but there is some other problem in the example. In any case, I need expert help!

Once this works, it will be useful in many applications. Such as scrolling background images, infinite repeating background terrain, properly scaled repeating textures for masked effects.

Could you try to explain what you are expecting? Maybe an image showing what should be shown.

The relative position of sprites should be maintained with the background as the window size changes or a camera scrolls. This is important for using this technique for repeating background textures for terrain in top down games where you want the background to scroll as expected with the player camera and other doodads on the field.

So in this example I would want the snowflake to stay over the same UV debug blocks

2018-09-10%2001_12_57-Window

This is what I don’t want when the window resizes (although in the above sample I set offset to 0 so it’s not even close to what it should be)

2018-09-10%2001_13_43-Window

Still need help with this if anyone has an idea on how to do it right.

@Johan_Beck-Noren, @jhonny.goransson, @Mathias_Westerdahl can you help?

Hi, I’ve looked a bit at this now and I sort of understand what you are looking for :slight_smile:

  • Currently, the render script calculates a projection matrix by means of scaling the projection based on a zoom value calculated from the window size, which means that the sprite scales according to window size. So, in the /render/default.render_script, I changed the projection matrix to a orthographic projection from absolute window width/height values:
render.set_projection(vmath.matrix4_orthographic(0, render.get_window_width(), 0, render.get_window_height(), -1, 1))
  • For the background quad, I think you want to remove the projection completely and just modify the UV coordinates to show a sub-rectangle of the background texture. So, I changed the model and go position to 0,0,0 and just output the vertex position as-is in the vertex shader:
gl_Position = vec4(position.xyz, 1.0);
  • In the fragment shader, the UV coordinates you get from the quad will always be 0…1 in s and t across the render view, so you need to recalculate this range to the absolute region that the window is displaying:
vec2 texture_size_absolute = vec2(512.0,512.0);
var_texcoord1 = (gl_FragCoord.st / texture_size_absolute);

Note that this uv is not based from the center of the screen, meaning it doesn’t anchor the objects based from the center of the window but rather from the bottom left corner.

Let me know if this makes any sense or if I am deranged :slight_smile:

7 Likes

Could you upload zip of your modified version?

1 Like

Yep!

RepeatingBGTexture_modified.zip (511.0 KB)

2 Likes

Not quite due to the change with the projection, but if the view projection is not the way you have it then the sprite and background scale differently and so become offset in an undesired way as before.

Imagine you have your game elements and you want them to scale proportionally to the size of the screen while also maintaining aspect ratio, that’s the purpose of the original projection.

So you want to be able to for example have a 4 by 3 game area with your game elements in that area which is centered in the screen always, but also be able to resize the game window and have the repeating texture continue outward in any direction while also scaling proportionally to everything else and maintaining correct offset of the texture.