Adding sequential MCs to a timeline

[rob_v_5712]

Kind of an odd question here but I have a series of swfs that I'm building that use sequential MCs names such as fig_1,fig_2,fig_3,fig_4..etc  in some cases, it can go up to 15 or so.

 

In a simple example, lets say I want to fade all 15 figures in, and later in the timeline move them across the screen.

 

To do that - I create a timeline for my swf  like this :

myTimeline = new TimelineLite( {useFrames:true} );

Then I add the tweens to the timeline :

.add("fig_fade_in",10)
.to(fig_1,30,{alpha:1},"fig_fade_in")
.to(fig_2,30,{alpha:1},"fig_fade_in")
.to(fig_3,30,{alpha:1},"fig_fade_in")
...
until I get to fig_15.

then I add the move :

.add("fig_move",60)
.to(fig_1,30,{x:200},"fig_move")
.to(fig_2,30,{x:200},"fig_move")
.to(fig_3,30,{x:200},"fig_move")
....
again until I get to fig_15

I'm just curious if there is an easier and/or cleaner way to do that?

 

Thanks

-Rob

 

 

 

 

 

[Carl]

yup, the staggerFrom() and staggerTo() methods will help a lot here. You just have to place all your items in an Array first.

 

You could do something like

 

var mcs:Array  = [fig_1, fig_2, fig_3, fig_4]

 

but with 15 clips, that is pretty rough. I'd rather use a loop to place them into an Array as shown in the code below:

 

import com.greensock.*;


var mcs:Array = [];
var numberOfMcs:int = 15;

//dynamically add all your Movie Clips to mcs Array

for(var i = 1; i <= numberOfMcs; i++){
mcs.push(this["fig_" + i]); 
}


trace(mcs);
var tl = new TimelineLite();
tl.add("fadeIn", 1)//add fadeIn label at time of 1 second
tl.staggerFrom(mcs, 1, {alpha:0}, 1, "fadeIn")
tl.add("fadeOut", "+=2") //2 seconds after they fade in add fadeOut label
tl.staggerTo(mcs, 1, {x:stage.stageWidth + 50}, 0.2, "fadeOut");

You can read about the staggerTo() method here in the docs

[rob_v_5712]

Thanks Carl

I figured their had to be an easier way.  I actually build the array upfront - so I already have it which is perfect!

 

Thanks again

-Rob