Jump to content
GreenSock

chamberlainpi

TimelineMax Supporting delayedCall

Recommended Posts

I couldn't find this in the documentation, so I figured I should make a request here!

 

Could TimelineMax be added the same funtionality as TweenMax where you can delay method calls?

 

I realize it couldn't "reverse" the actions caused by those methods (unless a respective reversible callback method was supplied for each delayed callbacks... but nah!), but this would be very handy instead of using dummy [TimelineMax instance].to(...) calls, like the following:

 


var animation:TimelineMax = new TimelineMax();

//Delay the next object's to be added to the displaylist later:
animation.to( dummy, 1.5, {onComplete: addChild, onCompleteParams: [someSprite]} );

//INSTEAD, this would be nice!
animation.delayedCall( 1.5, addChild, [someSprite] );

 

 

It would be SHORTER, sweeter, and ~loved~ by many I'm sure :-P (me first!)

 

Is there any internal complications that prevents this from being implemented?

Link to comment
Share on other sites

Sure, TimelineMax has a number of methods that allow you to insert a function call at any point in time and optionally pass parameters. Give the docs another look. If you need help with the syntax or anything let me know.

 

v11 or v12

 

use addCallback() method

//insert a function call 2 seconds into the animation with params
myTimeline.addCallback(myFunction, 2, [param1, param2]);

http://www.greensock...l#addCallback()

 

 

v12

 

use call() method:

//add a function call to the end of the timeline with params
myTimeline.call(myFunction, ["param1", "param2"]);

//add a function call 2 seconds prior to the end of the timeline with params
myTimeline.call(myFunction, ["param1", "param2"], -2);

http://api.greensock...ite.html#call()

 

use append() method

//use append() to add a function call to the end of a timeline (no params).
myTimeline.append(myFunction);


//use append() to add a function call 2 seconds before the end of a timeline (no params).
myTimeline.append(myFunction, -2);

http://api.greensock...e.html#append()

Link to comment
Share on other sites

hmm, but with your examples it doesn't really do exactly what I'm referring to.

 

Your 1st (with addCallback) example actually requires knowing exactly how many seconds into the animation you need to trigger the method and parameters. What I meant was to add a callback with a certain delay from the last entry added / appended to the animation, similar to how multiple consecutive *.to(...) calls organizes the animation in sequence.

 

Your 2nd example tells the animation to make a call (trigger) a method and some parameters at the current point in time (typically, the end I assume?) of the timeline. BUT, you can't specify the delay time to space it out from any previous calls before that! I've tried animation.delay(1) but that sets the global delay apparently. I was a bit confused by this. So not too sure how to add a delay just before, but doing so in the same call would be much more like delayedCall(...).

 

The 3rd example, unless there's extra arguments I'm not aware of in that usage, falls into the same issues as the 2nd one. No way to specify the delay time before the method gets called.

 

Basically, I'm looking for a way to do something like:

 

var animation:TimelineMax = new TimelineMax();
animation.to(mc1, 0.5, {x: 2, y: 2, ease: Linear.easeNone});
animation.to(mc2, 0.5, {x: 2, y: 2, ease: Linear.easeNone});
animation.to(mc3, 0.5, {x: 2, y: 2, ease: Linear.easeNone});
animation.delayedCall( 0.5, this.addChild, [label1] );
animation.delayedCall( 0.5, this.addChild, [label2] );
animation.delayedCall( 0.5, this.addChild, [label3] );
animation.play();
//Animation plays in sequence:
// mc1 moves 1st
// mc2 moves 2nd
// mc3 moves 3rd
// after all MovieClips moved, the labels start being added
// label1 is added .5 seconds later
// label2 ...
// label3
// THE END! 


 

Does it make more sense now? If *.addCallback(...) is the closest thing I can use for this, I guess then I would have to use animation.time() (EDIT: or totalDuration rather) within that call to tell it exactly where to trigger the callback function + parameters.

 

Still... any chance to make the delay duration part of that method (instead of the specific timeline time), or possibly add that to v13?

Link to comment
Share on other sites

Hi, thanks for the further explanation.

 

Your 1st (with addCallback) example actually requires knowing exactly how many seconds into the animation you need to trigger the method and parameters.

 

 

you can always dynamically fetch the duration of the timeline with animation.duration (v11) or animation.duration() (v12)

 

v11

myTimeline.addCallback(myFunction, myTimeline.duration + .5, [param1, param2]);
//adds callback .5 seconds after end of timeline at time of insertion

 

The docs for call() go to great lengths to describe all the parameters and even provides a bunch of sample code like:

 

 

tl.call(myFunction, [mc]);  //appends to the end of the timeline
tl.call(myFunction, [mc], 2);  //appends it with a gap of 2 seconds
tl.call(myFunction, [mc], 0, 0);  //places it at the very beginning of the timeline
tl.call(myFunction, [mc], 2, "myLabel");  //places it 2 seconds after "myLabel"

 

You can add your callback at any time relative to the end of the timeline, a base time, or even a label.

From what you describe, this should work perfectly (v12):

animation.call(this.addChild, [label1], .5);
animation.call(this.addChild, [label2], .5);
animation.call(this.addChild, [label3], .5);

addChild() will be called in succession with a .5 second delay in between.

 

Does that help?

 

Oh, I forgot, Welcome to the forums!

Link to comment
Share on other sites

Ah beautiful! Yes that's much more elegant than I thought. I was so focused on looking for a parameter called "delay" that I forgot offset is basically the same thing (except it can go negative as well). Sounds like the labels can be even more useful too with the offsets.

 

Thanks Carl! I'll read the documentation more closely next time!

  • Like 1
Link to comment
Share on other sites

No problem, very happy to help.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×