Flash StarTrix

Flash 6 (or Mx) has made available a lot of programming tricks for Flash developers so that they can quickly create quite diverse animations. Twinkle is an example. It allows users to scatter a movieclip all over the stage semi-randomly. We say "semi-randomly" because the position and size of the duplicate copies of the starting clip are completely randomly generated; the alpha or transparency value of each duplicate depends on its relative size to the original. The ruke is simple: the smaller the duplicate the dimmer or more transparent; the larger the duplicate, the brighter and higher its alpha value.

This is a frequent animation trick. Have some property of the animation determined by random generator or user input but then use those properties to determine the rest of the behaviour of the animation. What makes that even easier to do in Flash Mx is of course ActionScript.

So a designer can spend extra time on the form/styling of objects knowing that when it comes to animating them there will be many options available. Not just the shape and motion tweens but programmatic animations that can be extensively customized. Its this latter, programmed approach on demo here.

The coding is quite simple. A routine called randupe() will receive a movieclip and randomely generate a copy of the clip of random size and position on the stage - but not random brightness. The brightness or transparency of the copied clip will be relative to its size. randupe() will be triggered to do this 400 times, once every 35 milliseconds, and on 120 levels of the stage by the setInterval() routine. The trick is to turn off the duplication after 800 times. The code is below.

// 'blob' is the movieclip to be duplicated, its an image of a star
blob.count=0; //we setup & initialize a new property 'count' for the movieclip
blob._visible=false; //we hide the clip to be duplicated
//Here is the trigger - Randomly duplicate every 35 miillsecond the moviclip blob
//800 times but on oly 120 levels - this will cause some of the duplicates to "fade out"
// when they are written over by a new duplicate on the same level(Flash imposed limit-
//only one movieclip per level)
intid=setInterval(randupe, 35, blob, 800, 120);
//And We Are Done!! - The rest of the magic is in the function randupe()

function randupe(mclip, times, maxlev){
// mclip = the movie clip to be duplicated
// times = the number of times to be duplicated
// maxlev = the maximum levels to be used for the duplicates
// if maxlev >= times than NO duplicated clips will be destroyed
  if(arguments.length <= 2)maxlev=30;
  if (arguments.length <= 1)times=50;
  if (arguments.length <=0)return;
// allow for missing arguments except for the clip which must be supplied
// Now check if the number of duplicates made exceed the maximum times
 if(mclip.count++ > times){
//if it does clear the interval trigger-and immediately return stopping duplication
    clearInterval(_root.intid);
    return;
  }
  i=mclip.count;
  var mcdupe = new Object(); //mcdupe acts as a container of mclip properties
  mcdupe._visible = true; //we want the duplicate to be visible
  mcdupe._x=Math.random()*Stage.width; //duplicate's random placing on Stage setup here
  mcdupe._y=Math.random()*Stage.height;
  mcdupe._rotation=Math.random()*360; //duplicate's rotation/orientation is also random
  mclip.duplicateMovieClip("mcd"+i, (i % maxlev) + 2, mcdupe); //Create the duplicate
  _root["mcd"+i]._width=mclip._width*(.1+Math.random()); // Now calc a random size for clip
  _root["mcd"+i]._height=mclip._height*(.1+Math.random());
//But the brightness/alpha is proportionate to the size of the clip
  _root["mcd"+i]._alpha=100*(_root["mcd"+i]._width *   _root["mcd"+i]._height)/(mclip._width*mclip._height);
// And we are done duplicating
}

Instructions
Watch the stars twinkle.

There are three tricks in this code worth underlining. First, in the statement blob.count=0; we are taking advantage of the fact that movieclips are predefined objects in ActionScript. ActionScript also allows us to add a property to an object by simply making an assignment. This is in turn allows a current count of the number of duplicates made, the count property, to be passed along into the function randupe() - two birds with one parameter. But also, a scalar parameter which normally is passed by value (and therefore cannot be changed in the function); now is passed by reference and therefore can be changed inside the function randupe(). Nifty.

Second, the setInterval(function, wait_in_millisecs, parameters..) is a very powerful way to call a function in ActionScript. It is the equivalent of the following pseudo-code:

while(true){
  wait(wait_in_millisecs);
  call function(parameters..);
}

Think of setInterval() as being a onEnterFrame event in which you can control the time between events.The whole trick is to turn off the infinite loop of function calls. And ActionScript provides a complimentary function, clearInterval(), to do that. The following code triggers and then immediately turns off the setInterval() trigger:

intervalId=setInterval(trace, 100, "This message will never be seen");
clearInterval(intervalId);

The final bit of ActionScript trickery is in theduplication function itself:

mclip.duplicateMovieClip("mcd"+i, (i % maxlev) + 2, mcdupe)

The first leger de main is in the new clipname, "mcd"+i . ActionScript has no problem putting the string and integre to form the name "mcd1", etc. Next, (i % maxlev) + 2 , starts the levels at 3 and cycles up to maxlev+ 2 - if times is still not done then the modulo math starts everything over at level 3 - causing the the existing clip on that level to wink out as it is overwritten by the newly duplicated clip. Finally all the parmeters set for mcdupe are passed onto "mcd1"... by the duplicateMovieClip function.

In sum, ActionScripting can add very powerful animation capabilities in about 25 lines of code. Whats even better, this routine can be used again with another movieclip. Furthur, it can be customized so that duplicates are added only into a certain sector/area of the stage or their color changes depending on how many close neighbours they have, or whatever. The key is that learning a few ActionScript tricks can have very useful payoffs. Check our recommended references.