Scrolling background like Doodle Jump

Hi! In my platform game the player has to draw a line to keep the main character inside the screen, instead of let it fall down.
Anyway now I would like to scroll the background when the game character bounce on the line drawed by players.

Here’s the code I’m using:

The first one is my actual scrolling background which move continuely

local bgSpeed = 3,5; -- SPEED TO MOVE BACKGROUND AT  
   
local bg1 = display.newImage("backGround01.png", 0, 0); -- place bg1 at the origin  
local bg2 = display.newImage("backGround02.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg3 = display.newImage("backGround03.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg4 = display.newImage("backGround04.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg5 = display.newImage("backGround05.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg6 = display.newImage("backGround06.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg7 = display.newImage("backGround07.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg8 = display.newImage("backGround08.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg9 = display.newImage("backGround09.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg10 = display.newImage("backGround10.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg11 = display.newImage("backGround11.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg12 = display.newImage("backGround12.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg13 = display.newImage("backGround13.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg14 = display.newImage("backGround14.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg15 = display.newImage("backGround15.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg16 = display.newImage("backGround16.png", 0, bg1.y + (bg1.height \* 1.5));  
local bg17 = display.newImage("backGround16.png", 0, bg1.y + (bg1.height \* 1.5));  
  
local moveBG = function(e)  
 bg1:translate(0, bgSpeed);  
 bg2:translate(0, bgSpeed);   
 bg3:translate(0, bgSpeed);  
 bg4:translate(0, bgSpeed);  
 bg5:translate(0, bgSpeed);  
 bg6:translate(0, bgSpeed);  
 bg7:translate(0, bgSpeed);  
 bg8:translate(0, bgSpeed);  
 bg9:translate(0, bgSpeed);  
 bg10:translate(0, bgSpeed);  
 bg11:translate(0, bgSpeed);  
 bg12:translate(0, bgSpeed);  
 bg13:translate(0, bgSpeed);  
 bg14:translate(0, bgSpeed);  
 bg15:translate(0, bgSpeed);  
 bg16:translate(0, bgSpeed);  
 bg17:translate(0, bgSpeed);  
  
   
  
   
 if ((bg1.y - bg1.height / 2) \> display.contentHeight) then  
 bg1.y = bg2.y - bg2.height;  
 elseif((bg2.y - bg2.height / 2) \> display.contentHeight) then  
 bg2.y = bg1.y - bg1.height;  
  
 elseif((bg3.y - bg3.height / 2) \> display.contentHeight) then  
 bg3.y = bg2.y - bg1.height;  
  
 elseif((bg4.y - bg4.height / 2) \> display.contentHeight) then  
 bg4.y = bg3.y - bg2.height;  
  
 elseif((bg5.y - bg5.height / 2) \> display.contentHeight) then  
 bg5.y = bg4.y - bg3.height;  
  
 elseif((bg6.y - bg6.height / 2) \> display.contentHeight) then  
 bg6.y = bg5.y - bg4.height;  
  
 elseif((bg7.y - bg7.height / 2) \> display.contentHeight) then  
 bg7.y = bg6.y - bg5.height;  
  
 elseif((bg8.y - bg8.height / 2) \> display.contentHeight) then  
 bg8.y = bg7.y - bg6.height;  
  
 elseif((bg9.y - bg9.height / 2) \> display.contentHeight) then  
 bg9.y = bg8.y - bg7.height;  
  
 elseif((bg10.y - bg10.height / 2) \> display.contentHeight) then  
 bg10.y = bg9.y - bg8.height;  
  
 elseif((bg11.y - bg11.height / 2) \> display.contentHeight) then  
 bg11.y = bg10.y - bg9.height;  
  
 elseif((bg12.y - bg12.height / 2) \> display.contentHeight) then  
 bg12.y = bg11.y - bg10.height;  
  
 elseif((bg13.y - bg13.height / 2) \> display.contentHeight) then  
 bg13.y = bg12.y - bg11.height;  
  
 elseif((bg14.y - bg14.height / 2) \> display.contentHeight) then  
 bg14.y = bg13.y - bg12.height;  
  
 elseif((bg15.y - bg15.height / 2) \> display.contentHeight) then  
 bg15.y = bg14.y - bg13.height;  
  
 elseif((bg16.y - bg16.height / 2) \> display.contentHeight) then  
 bg16.y = bg15.y - bg14.height;  
  
 elseif((bg17.y - bg17.height / 2) \> display.contentHeight) then  
 bg17.y = bg16.y - bg15.height;  
  
  
 end  
end  
  
Runtime:addEventListener("enterFrame", moveBG);  

and the second one is to create lines:

local lines = {}  
local lineGroup = display.newGroup()  
local prevX,prevY  
local isDrawing = false  
local i = 1  
   
local function distanceBetween(x1, y1, x2, y2)  
 local dist\_x = x2 - x1  
 local dist\_y = y2 - y1  
 local distanceBetween = math.sqrt((dist\_x\*dist\_x) + (dist\_y\*dist\_y))  
 return distanceBetween  
end  
   
local function drawLine(e)  
 if(e.phase == "began") then  
  
 for i = #lines, 1, -1 do  
 if (lines[i]) then  
 lines[i].parent:remove(lines[i])  
 lines[i] = nil  
 end  
 end  
 lines = {}  
 line\_number = 1  
  
  
 prevX = e.x  
 prevY = e.y  
 isDrawing = true  
   
 elseif(e.phase == "moved") then  
 local distance = distanceBetween(prevX, prevY, e.x, e.y)  
 if(isDrawing and distance \< 640) then  
 if(lines[i]) then lineGroup:remove(i) end  
 lines[i] = display.newLine(prevX, prevY, e.x, e.y)  
 lines[i]:setColor(255, 255, 0)  
 lines[i].width = 5  
   
 local dist\_x = e.x - prevX  
 local dist\_y = e.y - prevY  
 physics.addBody(lines[i], "static", { density = 1, friction = 0.5, bounce = -1.0, shape = {0, 0, dist\_x, dist\_y, 0, 0} } )  
 lineGroup:insert(lines[i])  
 end  
 elseif(e.phase == "ended") then  
 isDrawing = false  
 end  
end  
   
Runtime:addEventListener("touch",drawLine)  

Any idea? Thanks! :wink: [import]uid: 111398 topic_id: 32289 reply_id: 332289[/import]

Hello,
You might find the following tutorials useful:

http://mobile.tutsplus.com/tutorials/corona/creating-a-scrolling-background-with-corona-sdk/
http://mobile.tutsplus.com/tutorials/corona/corona-sdk-create-a-side-scroller-from-scratch/

Some of the code within might be slightly outdated in terms of Corona’s current APIs (i.e. Corona has a more current sprite API method which probably isn’t used in these tutorials), but they should give you a solid foundation and maybe some new ideas.

Best of luck!
Brent Sorrentino
[import]uid: 9747 topic_id: 32289 reply_id: 128429[/import]

Thanks a lot! Now I will try [import]uid: 111398 topic_id: 32289 reply_id: 128445[/import]

Hello,
You might find the following tutorials useful:

http://mobile.tutsplus.com/tutorials/corona/creating-a-scrolling-background-with-corona-sdk/
http://mobile.tutsplus.com/tutorials/corona/corona-sdk-create-a-side-scroller-from-scratch/

Some of the code within might be slightly outdated in terms of Corona’s current APIs (i.e. Corona has a more current sprite API method which probably isn’t used in these tutorials), but they should give you a solid foundation and maybe some new ideas.

Best of luck!
Brent Sorrentino
[import]uid: 9747 topic_id: 32289 reply_id: 128429[/import]

Thanks a lot! Now I will try [import]uid: 111398 topic_id: 32289 reply_id: 128445[/import]