how to create an endless image

Hi everyone…

I just got so confuse. I think this should be easy, but I just need help.

I look at the Jungle Sprite Code in corona

it has the trees moving from right to left

I use that function with all the get:timer and tPrevious and all that

and it works I can move my image endlessly

The problem is that my image is like a landscape

a line with mountains and rocks

the size of the image is the full length of the iPad

So I put image1 in the center of the iPad

and image2 outside the view, on the right.

so when I use that function, the image re-shows on the actual screen

you can see it jumping.

I want the image1 move to the left

at the same time image2 move to the left

so when image2 is in the center of the iPad

image1 is all the way outside the view in the left

at that moment image1 should translate to the right of the screen, outside the view

and start moving to the left

that way I can see an endless landscape of the mountains

I hope this make sense, and someone can help me figure this out

Thanks

Some code would help.  But maybe you could use the isVisible setting on the 2nd image to avoid the jumping (I assume the jumping is that the image displays at (x,y) then jumps to off-screen).

That is the problem I have no code

But I will try a – pseudo code to give you the idea


rockLine1 – display new image bla bla bla

rockLine1 x and y (right in the center of the screen)

rockLine2 – display image

rockLine2.x – outside the screen view of the iPad on the right hand side

the y also in the center

transition.to(rockLine1 and also rockLine 2) – both at the same time

they both move to the left of the screen

when rockLine2 is in the center of the screen

rockLine1 will be off the screen in the left side of the screen but we don’t see it

at that moment, when rockLine1 is off screen

we need some code to translate or reposition rockLine1 on the other side of the screen

to the right, and make it move to the left

so when rockLine2 is moving outside the screen

rickLine1 will enter the screen

to create an appearance of movement

Like some buildings in a city

or trees on a jungle

or rocks on a cave

an have a function

either with timer performWithDelay or enter frame

to make that move all the time


I hope this helps

Thanks

I found a video by Mark Falkland in YouTube,

Thanks Mark, I got it to work!

This is the Code I use

------------------------------------------------------------------------------------------ &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine1 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine1) &nbsp;&nbsp;&nbsp; topLine1.x = display.contentCenterX - 300 &nbsp;&nbsp;&nbsp; topLine1.y = 20 &nbsp;&nbsp;&nbsp; topLine1.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine1:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine1.speed = .80 &nbsp;&nbsp;&nbsp; topLine1.alpha = .9 &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine2 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine2) &nbsp;&nbsp;&nbsp; topLine2.x = display.contentWidth + 400 &nbsp;&nbsp;&nbsp; topLine2.y = 20 &nbsp;&nbsp;&nbsp; topLine2.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine2:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine2.speed = .84 &nbsp;&nbsp;&nbsp; topLine2.alpha = .8 &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine3 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine3) &nbsp;&nbsp;&nbsp; topLine3.x = display.contentCenterX + 200 &nbsp;&nbsp;&nbsp; topLine3.y = 20 &nbsp;&nbsp;&nbsp; topLine3.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine3:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine3.speed = .86 &nbsp;&nbsp;&nbsp; topLine3.alpha = .85 &nbsp;&nbsp; &nbsp;function topLine(self, event) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;if self.x \< -600 then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;self.x = display.contentWidth + 400 &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;self.x = self.x - self.speed &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;topLine1.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine1) &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;topLine2.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine2) &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;topLine3.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine3) ------------------------------------------------------------------------------------------&nbsp;

Very nice video, I don’t know who was first

you or flappy bird

But your video is great, that was one of the first videos I saw 2 years ago

that time, I did not understand it at all,

but now it all makes sense

Thanks

Victor

Some code would help.  But maybe you could use the isVisible setting on the 2nd image to avoid the jumping (I assume the jumping is that the image displays at (x,y) then jumps to off-screen).

That is the problem I have no code

But I will try a – pseudo code to give you the idea


rockLine1 – display new image bla bla bla

rockLine1 x and y (right in the center of the screen)

rockLine2 – display image

rockLine2.x – outside the screen view of the iPad on the right hand side

the y also in the center

transition.to(rockLine1 and also rockLine 2) – both at the same time

they both move to the left of the screen

when rockLine2 is in the center of the screen

rockLine1 will be off the screen in the left side of the screen but we don’t see it

at that moment, when rockLine1 is off screen

we need some code to translate or reposition rockLine1 on the other side of the screen

to the right, and make it move to the left

so when rockLine2 is moving outside the screen

rickLine1 will enter the screen

to create an appearance of movement

Like some buildings in a city

or trees on a jungle

or rocks on a cave

an have a function

either with timer performWithDelay or enter frame

to make that move all the time


I hope this helps

Thanks

I found a video by Mark Falkland in YouTube,

Thanks Mark, I got it to work!

This is the Code I use

------------------------------------------------------------------------------------------ &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine1 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine1) &nbsp;&nbsp;&nbsp; topLine1.x = display.contentCenterX - 300 &nbsp;&nbsp;&nbsp; topLine1.y = 20 &nbsp;&nbsp;&nbsp; topLine1.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine1:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine1.speed = .80 &nbsp;&nbsp;&nbsp; topLine1.alpha = .9 &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine2 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine2) &nbsp;&nbsp;&nbsp; topLine2.x = display.contentWidth + 400 &nbsp;&nbsp;&nbsp; topLine2.y = 20 &nbsp;&nbsp;&nbsp; topLine2.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine2:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine2.speed = .84 &nbsp;&nbsp;&nbsp; topLine2.alpha = .8 &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;topLine3 = display.newImageRect( "images/landscapeTop.png", 1200, 80 ) &nbsp;&nbsp;&nbsp; sceneGroup:insert(topLine3) &nbsp;&nbsp;&nbsp; topLine3.x = display.contentCenterX + 200 &nbsp;&nbsp;&nbsp; topLine3.y = 20 &nbsp;&nbsp;&nbsp; topLine3.anchorX = 0 &nbsp;&nbsp;&nbsp; topLine3:scale(.5, .5) &nbsp;&nbsp;&nbsp; topLine3.speed = .86 &nbsp;&nbsp;&nbsp; topLine3.alpha = .85 &nbsp;&nbsp; &nbsp;function topLine(self, event) &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;if self.x \< -600 then &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;self.x = display.contentWidth + 400 &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;else &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;self.x = self.x - self.speed &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;end &nbsp;&nbsp; &nbsp;topLine1.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine1) &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;topLine2.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine2) &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;topLine3.enterFrame = topLine &nbsp;&nbsp; &nbsp;Runtime:addEventListener("enterFrame", topLine3) ------------------------------------------------------------------------------------------&nbsp;

Very nice video, I don’t know who was first

you or flappy bird

But your video is great, that was one of the first videos I saw 2 years ago

that time, I did not understand it at all,

but now it all makes sense

Thanks

Victor