Looping background seemlessly from right to left then back again

Mar 23, 2022

Hi,

I've seen projects where the background loops seamlessly from right to left. How do you do this? I can't find it on the discussion board. You often see it in games.

2 Replies
Joseph Francis

When I was doing something like that way back in my Macromedia Director days, the first thing I would do is make sure the background image is wider than the stage. Then it's a simple matter to create 2 "sprites" (instances of the image), have the left side of the initial on-screen sprite "pinned" to the left side of the stage (0 on the vertical axis), the left side of sprite 2 "pinned" to the right side of sprite 1, and set the pan for both sprites to be the same duration. Once sprite 1 is fully off-stage, I would programmatically move it's start location to the right side of sprite 2 and start its pan. When sprite 2 is off-stage, move it's start location back to its initial start point and start the pan. Lather, rinse, repeat.

The most-important thing is ensuring the left and right edges of the image are seamless. Like painted backgrounds you can buy for model railroading, the endless pan effect is lost if the right edge is a cityscape and the left edge is mountains. 🙂