Repeater delay - each row - no local variable, no wait-fx

repeater-widget
#1

Hi
I’ve got lots of repeaters with content to be animated. Think of the sliders of a mixing console. Those are not moved at the same time but one by one.
Every repeater already reacts to click or loaded and moves each individual slider to the desired [[item.sliderValue]] position.
Now this need to be delayed individually.

First I thought about something like [[item.next]] to trigger one of its events after the current repeater item finished.

Solution 2 failed too: sadly the wait function does not support calculations, like [[item.index]]*500.

I thought about an iterated ‘fire-event’ to itself, so that an interaction-event has a case like
if LVAR_Counter < [[item.index]]
LVAR_Counter++
wait 500
Fire Event (this event-name)
… but an repeater item does not support local variables.

A solution, anybody?

#3

Hi! This works very smoothly, but it’s sort of scotch-taped together.

There’s a “listener” object inside of the repeater. Check out this post to see how a listener works, but basically when you trigger it by moving it (by 0,0), its code executes for each row in the repeater, just like Item Loaded does. It has this code:

On Moved (of listener in repeater)
  If value of label counter equals value [[item.index]]
    rotate rectangle by 90.

Outside of the repeater you have a dynamic panel with one more state than the repeater has rows. It’s OnPanelStateChange event handler has this code

OnPanelStateChange
  If state of this is not state1
    set text on counter to [[Target.text + 1]]
    move listener by (0,0)
    wait 300ms
    set panel This to state Next  // this triggers OnPanelStateChange

Finally, the button

OnClick
  set text of counter to 0 
  set state of dynamic panel to 1 // this won't trigger the listener because of the condition on the panel
  set state of panel to Next

Preview

File: repeater_delayed_animations.rp (65.7 KB)

Repeater filtered by SEVERAL items of another repeater
#4

Thank you, very much!
I just did not come up with the idea of using an external counter. Quite a good solution!

#5

Good! The animations can overlap if you want: e.g., rectangle 2 starts rotating before rectangle 1 has finished. It’s just a matter of the length of the animation and the length of the wait.