2D Endless Runner : Background transition based on score

Hey folks so i’m working on a 2D endless runner. the player is fixed and i’m looping the background behind him to create the illusion of the player moving. I want the background to smoothly transition into a different image at a specific score after looping the first background image a couple of times, without changing the scene, then again i would let the 2nd background loop for a bit and switch to 3rd and so forth. can anyone please guide me on how to pull this off?

I’ve attached an image for the reference (just a wireframe, the backgrounds will be seamless textured graphics)

It’s not clear what part you need help with, the logic or how to draw the backgrounds or something else.

At any one time you’re drawing the current level 1 background sprites using A & B Sprite Renderers to achieve a seamless wrap. Sometimes A is occupiying the whole screen and B is immediately “above” it ready to be moved or B is the whole screen with A immediately “above it”. A & B are the same “Level 1” background.

When it comes to “Level 2” you’ll still have “Level 1” sprites A & B but as soon as A or B are being drawing in the full screen, you’ll start showing Sprites C & D “Level 2”.

Of course, if you make it so that you go to the next level when A or B (Level 1) are full screen then you’ll have a situation where you have A or B rendering then start rendering C for “Level 2”.

A & B are a GameObject with a SpriteRenderer using the same Level 1 background Sprite
C & D are a GameObject with a SpriteRenderer using the same Level 2 background Sprite
etc.

Also, you can simply use A, B, C & D too so prior to going to Level 3, you prepare A & B with the “Level 3” background sprites then on “Level 4” you prepare C & D with that level sprites so you can get away with 4 GameObject here for backgrounds.