AS3 Loop for Tweenlite [SOLVED]

[leene 0 Likes (Newbie)]

Hi There,

 

I'm trying to clean up my code. Say I have 8 movieclips that I want to fade in at different times...

 

writing it this way seems to work but how would I write it to be in a loop instead of repeating it so many times?

import gs.TweenLite;
import gs.easing.*

TweenLite.to(mc1, Math.random()*50, {alpha:1});
TweenLite.to(mc2, Math.random()*50, {alpha:1});
TweenLite.to(mc3, Math.random()*50, {alpha:1});
TweenLite.to(mc4, Math.random()*50, {alpha:1});
TweenLite.to(mc5, Math.random()*50, {alpha:1});
TweenLite.to(mc6, Math.random()*50, {alpha:1});
TweenLite.to(mc7, Math.random()*50, {alpha:1});
TweenLite.to(mc8, Math.random()*50, {alpha:1});

------------------------------------------------------

 

Here was my attempt at the loop. But it has errors.

var movieClips:Number = 1; //tracks how many movie clips
addEventListener(Event.ENTER_FRAME,myEnterFrame);
function myEnterFrame(event:Event) {
 if (movieClips <= 8) {
	 var mc:String = "mc"+movieClips;
	 trace(mc);
	 TweenLite.to(mc, Math.random()*50, {alpha:1});
       movieClips += 1;
   }
}

Thanks!

[GreenSock 18,267 Likes (Superhero)]

Do you want them to all start fading in at the same time, but some take longer than others to reach an alpha of 1 or do you want them to all take the same amount of time to fade in, but stagger their start times randomly? I assume you want option 2:

 

var clips:Array = [mc1, mc2, mc3, mc4, mc5, mc6, mc7, mc8];
for (var i:int = 0; i     TweenLite.to(clips[i], 2, {alpha:1, delay:Math.random() * 50});
}

 

There are a few optimizations we could make to this code, but it should give you the general idea. Basically we use a random delay (between 0 and 50 seconds) and make them fade in for 2 seconds, so everything should be finished by exactly 52 seconds.

[leene 0 Likes (Newbie)]

Yes, option 2 is what I was going for.

 

Thanks so much! I really Appreciate it!

[zumajoe 2 Likes (Newbie)]

This works perfectly, is there a way to make it so the tweens are random- but don't start until the last one finishes?

 

ie: mc5 starts/finishes > mc2 starts/finishes > mc8 starts/finishes

 

i guess it wouldn't be random start times, more like random selection of the animation order...

[GreenSock 18,267 Likes (Superhero)]

Sure, you mean like this?:

var clips:Array = [mc1, mc2, mc3, mc4, mc5, mc6, mc7, mc8];
var timeline:TimelineLite = new TimelineLite(); //makes it simple to sequence
var temp:Array = clips.slice(); //make a copy because we'll be removing elements as we go
var i:int = temp.length;
var index:uint;
while (--i > -1) {
   index = int(Math.random() * i);
   timeline.append( new TweenLite(temp[index], 2, {alpha:1}) );
   temp.splice(index, 1);
}

 

(that's untested code, but hopefully it demonstrates the concept)

[zumajoe 2 Likes (Newbie)]

Hey Jack,

 

That worked perfectly, totally awesome and this code will be very useful for many things. I'm trying to convert that to AS2, no errors- but nothing happens. Am I missing something?

 

import com.greensock.*;

var clips:Array = [mc1, mc2, mc3, mc4, mc5, mc6, mc7, mc8, mc9, mc10, mc11, mc12, mc13, mc14];

var timeline:TimelineLite = new TimelineLite();
var temp:Array = clips.slice();
var i:Number = temp.length;
var index:Number;

while (--i>-1) {
index = Number(Math.random()*i);
timeline.appendMultiple(TweenMax.allTo(temp[index], globalDuration, {_xscale:150, ease:Cubic.easeInOut}, 0.2));
temp.splice(index,1);

}

[GreenSock 18,267 Likes (Superhero)]

Yep, you need to do Math.floor(Math.random() * i); instead of Number(Math.random() * i), otherwise you'll get decimal values. The index should always be a whole number.

[fsd80 0 Likes (Newbie)]

Hi,

I like this example very much,is there a chance to show how to do it without naming movie clips,

is there a way for use f.e. "numChildren" ???

Thx !!!

[Carl 11,109 Likes (Superhero)]

http://www.actionscript.org/forums/show ... ostcount=2

 

that is a handy script to get all children of any movie clip or displayObjectContainer.

 

while that loop is running, you can push each child into an array, then use the allFrom/to on that array.

[fsd80 0 Likes (Newbie)]

Thank you for help

 

I think i´m close but there is still error

I need all movieclips to fade out randomly to alpha:0,

Please take a look help sombody becouse I´ve got arrayNightMare )))) alrady..

 

var allMovies:Number = container_mc.numChildren;

var clips:Array = new Array ;

var eachMovie:MovieClip = new MovieClip ;

 

 

for (var i:Number = 0; i < allMovies; i++)

{

eachMovie = container_mc.getChildAt(i) as MovieClip;

trace(eachMovie);

clips.push(eachMovie);

doStuff();

}

 

 

function doStuff()

{

var timeline:TimelineLite = new TimelineLite();

var temp:Array = clips.slice();

var i:int = temp.length;

var index:uint;

while (--i > -1)

{

index = int(Math.random() * i);

timeline.append( new TweenLite(temp[index], 1, {alpha:0}) );

temp.splice(index, 1);

}

}

 

 

Carl PLEASE save me from this nightmare... ))

[Carl 11,109 Likes (Superhero)]

the biggest problem that I see is that you are calling doStuff() inside your loop.

 

if you have 300 children movie clips.

 

you are creating 300 timelines.

 

you want 1 timeline, with 300 tweens inside it.

 

only call doStuff() after the loop runs.

 

you may still have errors, but I'm pretty sure you will have better luck once that issue is resolved.

[Carl 11,109 Likes (Superhero)]

just do this

 

import com.greensock.*;
import com.greensock.easing.*;

var allMovies:Number = container_mc.numChildren;
var clips:Array = new Array  ;
var eachMovie:MovieClip;
var timeline:TimelineLite = new TimelineLite();//makes it simple to sequence

for (var i:Number = 0; i {
eachMovie = container_mc.getChildAt(i) as MovieClip;
clips.push(eachMovie);

}

doStuff();






function doStuff()
{

clips = shuffleArray(clips);
var i:int = clips.length;

while (--i > -1)
{

	timeline.append( new TweenLite(clips[i], .3, {alpha:0}));

}


}


//shuffle function lifted from Matt Maxwell: http://mattmaxwellas3.blogspot.com/2010/10/as3-shuffle-array.html

function shuffleArray(arr:Array):Array
{
var arr2:Array = [];
while (arr.length > 0)
{
	arr2.push(arr.splice(Math.round(Math.random() * (arr.length - 1)), 1)[0]);
}
return arr2;
}

[fsd80 0 Likes (Newbie)]

Carl,

I know that you heard it a lot of times, but let me say it agin please.

Thank you !!! YOU ARE AWESOME !!!

Your tutorials on http://www.snorkl.tv/ are the best.

[Carl 11,109 Likes (Superhero)]

thanks man. I may just turn this random fader thing into a tutorial someday. there are some useful techniques in there.