Scrolling landscape background with user placed objects.

Games
#1

Hi,

In my game i have the user ‘create’ the level using various objects. This works great except i want the user to be able to create levels more than one screen width.

The user will need to be able to scroll the screen left or right and place objects. How would i acheive this?

Thanks again. [import]uid: 162458 topic_id: 29554 reply_id: 329554[/import]

#2

You can have three display groups (usually placed within a parent display group, for convenience) and move them left/right by adjusting their .x value relative to the user’s touch (if dragging is how the user moves the level.)

Here is some simple code to do the parallax scrolling:

[lua]-- scene is used here because I took this from my storyboard code, but it could be any table…
scene.backratio = 0.9 – difference between the interaction layer and the background motion
scene.foreratio = 0.4 – difference between the interaction layer and the foreground motion

– create the display groups and set opacities
local container = display.newGroup(); scene.container = container
local back, interact, fore = display.newGroup(), display.newGroup(), display.newGroup()
container:insert(back); container:insert(interact); container:insert(fore)
back.alpha = 1; interact.alpha = 1; fore.alpha = 0.4

– create the touch event used to move the display groups
– this uses the ratios created above to move them in a parallax style - out of sync of the user’s touch

local function touch( event )
if (event.phase == “began”) then
else
local x, y = 0, event.y-scene.event.y
back.x, back.y = back.x+scene.backratio*x, back.y+scene.backratio*y
fore.x, fore.y = fore.x+scene.foreratio*x, fore.y+scene.foreratio*y
end
scene.event = event
end
scene.touch = touch
Runtime:addEventListener( “touch”, scene.touch )[/lua]

Please bear in mind that the code above is directly from my code and actually moves the display groups up and down. I will leave it as a task for you to modify the code to move left and right. Hint: You only need to change the line which has "local x, y = " to do this. [import]uid: 8271 topic_id: 29554 reply_id: 118616[/import]

#3

Thanks, will try this out on my lunch and let you know how it goes. Thanks again for taking the time to help :slight_smile: [import]uid: 162458 topic_id: 29554 reply_id: 118629[/import]

#4

iv had a play, but got several problems i cant figure out.

I only what a certain group to move back and forth. I have a play and stop button which when pressed needs to move the group back to the original start position. However using the code above the group jumps all over the place.

Any ideas?

Thanks [import]uid: 162458 topic_id: 29554 reply_id: 118655[/import]

#5

Have you got sample code for your program?

Basically, you only need to change the .x value of the group you want to move. The amount you change it by is down to the math you use.

If you want a button to reset any values, you simply need to store those original values and have a function attached to a button to re-apply them. [import]uid: 8271 topic_id: 29554 reply_id: 118660[/import]

#6

ah yes that makes sense thanks. I think i have it working now. Only thing left to do is limit the movement to a certain point of the screen so the group isnt continously scrollable :frowning: [import]uid: 162458 topic_id: 29554 reply_id: 118662[/import]

#7

That’s just putting boundaries on the values you move the group by. Post some code and I’ll take a look. [import]uid: 8271 topic_id: 29554 reply_id: 118745[/import]

#8

thanks horacebury but i managed to figure it out.

THanks for all your help [import]uid: 162458 topic_id: 29554 reply_id: 118813[/import]