Endless scrolling background with two images, HELP!

[bramvbilsen]

Hi guys,

I’m trying to make two images scroll horizontally over and over again. I’m using this piece of code:

 bg[1] = display.newImage("img/bg/bg1.png") bg[1].x = centerX bg[1].y = actualH \* 1.05 bg[1].anchorY = 1 bg[1].yScale = 0.3 bg[1].xScale = 0.3 sceneGroup:insert(bg[1]) bg[2] = display.newImage("img/bg/bg1.png") bg[2].x = actualW \* 1.69 bg[2].y = actualH \* 1.05 bg[2].anchorY = 1 bg[2].yScale = 0.3 bg[2].xScale = 0.3 sceneGroup:insert(bg[2]) local speed = 0.3 function move() bg[1].x = bg[1].x-speed bg[2].x = bg[2].x-speed if(bg[1].x + bg[1].width/2 \< 0)then bg[1].x = bg[1].width\*3/2-speed elseif(bg[2].x + bg[2].width/2 \< 0)then bg[2].x = bg[2].width\*3/2-speed end end Runtime:addEventListener( "enterFrame", move )

The code works for the first run, but does not repeat. Could I get some help?
Kind regards

Bram

[Appletreeman]

Hi

I’ve had a very quick play, and knocked up a very quick version of your code…

-- Set up a few local variables for convenience local \_w = display.contentWidth -- Width of screen local \_h = display.contentHeight -- Height of screen local \_x = \_w/2 -- Horizontal centre of screen local \_y = \_h/2 -- Vertical centre of screen bg={} bg[1] = display.newRect(0,0,\_w,\_h) bg[1]:setFillColor(0,0,1) bg[1].anchorY = .5 bg[1].anchorX = 0 bg[1].x = 0 bg[1].y = \_y bg[2] = display.newRect(0,0,\_w,\_h) bg[2]:setFillColor(1,0,0) bg[2].anchorY = .5 bg[2].anchorX = 0 bg[2].x = \_w bg[2].y = \_y local speed = 1 -- I increased this to speed up testing function move() bg[1].x = bg[1].x-speed bg[2].x = bg[2].x-speed if(bg[1].x \< -bg[1].contentWidth)then bg[1].x = \_w elseif(bg[2].x \< -bg[2].contentWidth)then bg[2].x = \_w end end Runtime:addEventListener( "enterFrame", move )

I’m guessing that some of the variables you used have been setup in advance so I just swapped them out for some of my own.  It should be straight forward to see how it’s working (I’m at work at the moment and have very little time for this  )

Hope it helps.

Good luck

Chris

[bramvbilsen]

Hi Appletreeman,

Thanks for the code, it works
But I’m seeing the line that splits the two background images, is there a way to remove this?

Kind regards

Bram

[Appletreeman]

Err…

Not tried it so not sure if it’ll work, but try amending the two lines where you reset the x position like this…

 if(bg[1].x \< -bg[1].contentWidth)then bg[1].x = \_w-speed elseif(bg[2].x \< -bg[2].contentWidth)then bg[2].x = \_w-speed end

[bramvbilsen]

I’m still having the same problem

[rob]

I just tried @Appletreeman’s solution and it worked. Subtracting the speed compensates for the fact that you’ve already move it that frame.

I would also suggest that you use display.newImageRect() instead of display.newImage() and then trying to scale. You have to know your exact image size’s for this to work.

Rob

[Appletreeman]

Hi

I’ve had a very quick play, and knocked up a very quick version of your code…

-- Set up a few local variables for convenience local \_w = display.contentWidth -- Width of screen local \_h = display.contentHeight -- Height of screen local \_x = \_w/2 -- Horizontal centre of screen local \_y = \_h/2 -- Vertical centre of screen bg={} bg[1] = display.newRect(0,0,\_w,\_h) bg[1]:setFillColor(0,0,1) bg[1].anchorY = .5 bg[1].anchorX = 0 bg[1].x = 0 bg[1].y = \_y bg[2] = display.newRect(0,0,\_w,\_h) bg[2]:setFillColor(1,0,0) bg[2].anchorY = .5 bg[2].anchorX = 0 bg[2].x = \_w bg[2].y = \_y local speed = 1 -- I increased this to speed up testing function move() bg[1].x = bg[1].x-speed bg[2].x = bg[2].x-speed if(bg[1].x \< -bg[1].contentWidth)then bg[1].x = \_w elseif(bg[2].x \< -bg[2].contentWidth)then bg[2].x = \_w end end Runtime:addEventListener( "enterFrame", move )

I’m guessing that some of the variables you used have been setup in advance so I just swapped them out for some of my own.  It should be straight forward to see how it’s working (I’m at work at the moment and have very little time for this  )

Hope it helps.

Good luck

Chris

[bramvbilsen]

Hi Appletreeman,

Thanks for the code, it works
But I’m seeing the line that splits the two background images, is there a way to remove this?

Kind regards

Bram

[Appletreeman]

Err…

Not tried it so not sure if it’ll work, but try amending the two lines where you reset the x position like this…

 if(bg[1].x \< -bg[1].contentWidth)then bg[1].x = \_w-speed elseif(bg[2].x \< -bg[2].contentWidth)then bg[2].x = \_w-speed end

[bramvbilsen]

I’m still having the same problem

[rob]

I just tried @Appletreeman’s solution and it worked. Subtracting the speed compensates for the fact that you’ve already move it that frame.

I would also suggest that you use display.newImageRect() instead of display.newImage() and then trying to scale. You have to know your exact image size’s for this to work.

Rob