Scrolling Background

Hey everyone just want to say thanks for all of the help I have been getting here it's nice to see that corona has good support even for those of us who haven't bought a license yet.

My question this time is how do you do a scrolling background. I have across a few posts on how to do it. Only one of them have almost worked for me. The problem I am getting is that it only goes through two of the images and stops.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
local image1 = display.newImage("images/Lvl_2/Level_2_BG_1.png",0,0)
        local image2 = display.newImage("images/Lvl_2/Level_2_BG_2.png",480,0)
        local image3 = display.newImage("images/Lvl_2/Level_2_BG_3.png",480,0)
        local image4 = display.newImage("images/Lvl_2/Level_2_BG_4.png",480,0)
        local image5 = display.newImage("images/Lvl_2/Level_2_BG_5.png",480,0)
        local image6 = display.newImage("images/Lvl_2/Level_2_BG_6.png",480,0)
        local image7 = display.newImage("images/Lvl_2/Level_2_BG_7.png",480,0)
        local image8 = display.newImage("images/Lvl_2/Level_2_BG_8.png",480,0)
        local image9 = display.newImage("images/Lvl_2/Level_2_BG_9.png",480,0)
        local image10 = display.newImage("images/Lvl_2/Level_2_BG_10.png",480,0)
 
        transition.to(image1, { time= 10000, delay= 1500, x= -(image1.width* 0.5)} )
        transition.to(image2, { time= 10000, delay= 1500, x= (image2.width * 0.5) } )
        transition.to(image3, { time= 10000, delay= 1500, x= (image3.width * 0.5) } )   
        transition.to(image4, { time= 10000, delay= 1500, x= (image4.width * 0.5) } )
        transition.to(image5, { time= 10000, delay= 1500, x= (image5.width * 0.5) } ) 
        transition.to(image6, { time= 10000, delay= 1500, x= (image6.width* 0.5)  } )
        transition.to(image7, { time= 10000, delay= 1500, x= (image7.width * 0.5) } )
        transition.to(image8, { time= 10000, delay= 1500, x= (image8.width * 0.5) } )   
        transition.to(image9, { time= 10000, delay= 1500, x= (image9.width * 0.5) } )
        transition.to(image10, { time= 10000, delay= 1500, x= (image10.width * 0.5) } ) 
 
<code>
 
 
Any advise will be much appreciated.

Well, one vague overview way, your best bet will be to put all your images in a table. Tables are your friend. Something like this (with errors in there I'm sure):

1
2
3
4
local levels = {}
 
levels[1] = "images/Lvl_2/Level_2_BG_1.png"
levels[2] = "images/Lvl_2/Level_2_BG_2.png"

You could also probably only render 1 image at a time, and render the next one as needed to free up some memory....

i think you can drop all those transition.to lines.

this should work:
1) create a group, like local mycam = display.newGroup()
2) declare all your images, like you have
3) make sure your images X values are correct, i.e. so they fit next to each other
4) add your images to the group like mycam:insert(image1) etc etc.
5) add a runtime listener for enterframe to call some function to update the scrolling and then create the scrolling function to simply update your groups X value, that should scroll everything in that direction.

@bragbase I was with you till number five lol. Either I am not understanding what you are saying or I just don't know how to it.

views:1365 update:2011/12/29 9:44:01
corona forums © 2003-2011