|Topic was automatically imported from the old Question2Answer platform.
I’m trying to make an infinite scrolling background in Godot. The idea is very simple.
I have two instance of the same background in the scene and move them to the left at a certain speed by also taking in to account delta.
x -= speed * delta
When the image pass the left edge of the screen which is position 0, I change the position of the image to the right edge of the screen and repeat all over again to create an infinite scrolling background effect.
However, in Godot for some reason I always get a little gap between the two image like 2-3 pixels only.
Doesn’t matter what I try to do, sooner or later that gap always appear but sometime only after a few seconds and sometime it is also flashing like a rendering glitch. The numbers seems to be correct so it is either a rendering issue or the two instance of the background is out of sync a few milliseconds. Both instance using the same script so I don’t know if it matters.
I was searching the forum how others making infinite scrolling background but the only thing I find is that how to make parallax scrolling background when moving the camera but it is not exactly what I need since I don’t move the camera. I want to move the background image only and I can’t find any answer to why do I get this gap or line between the two image over time or how to make an infinite scrolling background in Godot that constantly moves to one direction and repeat.
Could anyone please help me with either how to fix that line/gap or suggest any other ways to go about making an infinite scrolling background in Godot?
I would appreciate any help.
have you tried something like what is explained here? Godot 101 - Part 12: Camera and Scrolling Background · KCC Blog it’s using an older version of godot, but you should be able to adapt it to the version you are using.
Eric Ellingson | 2019-02-19 21:14
Hi. Yes I did looked at those tutorials but all of them talking about how to make camera scroll and parallax scrolling effect. I did find a tutorial mentioned to move the camera left and right to make the effect I’m looking for. But I want to do it the other way around and instead of moving the camera I want to move the background.
Something tells me I can use the ParallaxLayer class to create an infinite scrolling background because the documentation saying I can use motion offset to control scrolling without using a camera and it got options to mirror and repeat the image. So maybe I can use it for what I need, but I could not figure out just yet how. If anyone could give me a kick in to the right direction like what properties I can use for this that would be great
Or if someone got any idea why do I get that gap/line when moving the background image that would be great too
ddabrahim | 2019-02-19 21:45
Could you post your project? Or a stripped down version of it with just the relevant parts?
Eric Ellingson | 2019-02-20 04:43
Already had a look at this tutorial?
Creating Parallax Clouds - DevGa.me
About the Camera topic:
The ParallaxBackground’s scroll value. Calculated automatically when
using a Camera2D, but can be used to manually manage scrolling when no
camera is present.
I’m not into 2D but this looks helpful IMHO.
wombatstampede | 2019-02-20 08:41
Yes, thank you. This is what I’ve seen too but could not figure out how to actually use it the way I need it. All the examples I’ve found was demonstrating how to use it to create parallax effect when scrolling the Camera. But I managed to figure out a way to make infinite scrolling background, going to post it now and mark it as a solution.
Thanks a lot for your help.
ddabrahim | 2019-02-20 18:18