Transitions Help For Multiple Objects With Delay

Games
#1

Hi all,

I want to move a series of objects (simple rectangles) that are stored in a table. I am using a for loop to do this, but I want to make it so that they move with a slight delay between each.

Whatever I try, it seems to move all the objects at the same time. Here’s some sample code:

[lua] local _W = display.contentWidth
local _H = display.contentHeight

– BACKGROUND

local bg = display.newRect ( 0, 0, _W, _H )
bg.x = _W * 0.5
bg.y = _H * 0.5

– CREATE BOX TABLE & BOXES

local boxTable = {}

for i = 1, 5 do

boxTable[i] = display.newRect( 0, 0, 40, 40 )
boxTable[i].x = (i * 80)
boxTable[i].y = (_W * 0.5)
boxTable[i]:setFillColor(math.random(1, 255), math.random(1, 255), math.random(1, 255))

end

– MOVE BOXES FUNCTION

local function moveBox()

for i = 1, #boxTable do

transition.to( boxTable[i], { y = _H * 0.8, time=300} )

end

end

bg:addEventListener(“tap”, moveBox)
[/lua]

If you run that, you’ll see that the objects move at the same time. I want each to start to move with a delay (500ms or so) after the previous one has started to move.

How is this done? Thanks in advance. [import]uid: 74503 topic_id: 26193 reply_id: 326193[/import]

#2

The time you set on transition is not time before start, but time to perform the transition itself.

transition.to( boxTable[i], { y = \_H \* 0.8, time=300, delay=500} ) -- 500ms delay before this transition occurs

That only gives you an initial delay - your app is going to roll through and give this transition to everyone simultaneously.

There are a few options you could use to make them move in sequence:

  1. You could create a complex transition loop, where instead of doing a for loop you repeat a function using an external iterator.

  2. The simplest solution is to fake it. Set your delay to a variable, and multiply that variable by [i]. So with a 500ms delay, that means object 2 moves starting at 1s, 3 at 1.5s, and so on. [import]uid: 41884 topic_id: 26193 reply_id: 106167[/import]

#3

Thanks for the reply.

I understand that the delay parameter is only for the initial delay. With your second solution, I’m not quite sure what you mean sorry. How would that be coded? [import]uid: 74503 topic_id: 26193 reply_id: 106169[/import]

#4

Like this:

[code]local primeDelay = 500 – outside of your loop is easiest, so you can tweak it

– meanwhile, inside your loop
transition.to( boxTable[i], { y = _H * 0.8, time=300, delay=( primeDelay * i )} )
[/code]

So when i = 2, delay = 1000 (1s). when i = 20, delay = 10000 (10s) and so on

It’s not really transitioning each object one after another - all of the delay timers start almost simultaneously - but because each delay ends 500ms after the last, it feels like they are all moving in sequence. [import]uid: 41884 topic_id: 26193 reply_id: 106173[/import]

#5

Ah, I see what you mean now. Makes perfect sense and thanks for the example code. It’s a perfect solution and it’s very, very much appreciated. Thank you. [import]uid: 74503 topic_id: 26193 reply_id: 106188[/import]