TweenGroup - Manage Sequences and Groups of TweenLite/FilterLite/Max Tweens
TweenGroup is a very powerful, flexible tool for managing groups of TweenLite/TweenFilterLite/TweenMax tweens. Here are a few of the features:
- pause(), resume(), reverse(), or restart() the group as a whole. (Tip: this is an easy way to add these capabilities to TweenLite instances without the extra Kb of TweenMax!)
- Treat a TweenGroup instance just like an Array, so you can push(), splice(), unshift(), pop(), slice(), shift(), loop through the elements, access them directly like myGroup[1], and set them directly like myGroup[2] = new TweenLite(mc, 1, {x:300}) and it'll automatically adjust the timing of the tweens in the group to honor the alignment and staggering effects you set with the "align" and "stagger" properties (more on that next...)
- Easily set the alignment of the tweens inside the group, like:
-
myGroup.align = TweenGroup.ALIGN_SEQUENCE; //stacks them end-to-end, one after the other
-
myGroup.align = TweenGroup.ALIGN_START; //tweens will start at the same time
-
myGroup.align = TweenGroup.ALIGN_END; //tweens will end at the same time
-
myGroup.align = TweenGroup.ALIGN_INIT; //same as ALIGN_START except that it honors any delay set in each tween.
-
myGroup.align = TweenGroup.ALIGN_NONE; //no special alignment
-
- Stagger aligned tweens by a set amount of time (in seconds). For example, if the stagger value is 0.5 and the align property is set to ALIGN_START, the second tween will start 0.5 seconds after the first one starts, then 0.5 seconds later the third one will start, etc. If the align property is ALIGN_SEQUENCE, there would be 0.5 seconds added between each tween.
- Have precise control over the progress of the group by getting/setting the "progress" property anytime. For example, to skip to half-way through the entire group of tweens, simply do this:
-
myGroup.progress = 0.5;
You can even tween the progress property with another tween to fastforward/rewind an entire group!
-
- Adds about 4Kb to your SWF.
At first glance, it may be difficult to see the value of using TweenGroup, but once you wrap your head around it, you'll probably find all kinds of uses for it and wonder how you lived without it. For example, what if you have a menu that flies out and unfolds using several sequenced tweens but when the user clicks elsewhere, you want the menu to fold back into place. With TweenGroup, it's as simple as calling myGroup.reverse(). Or if you have a bunch of tweens that play and then you want to loop them back to the beginning, just call myGroup.restart() or set myGroup.progress = 0.