Dynamic Snowflakes

Share |

A simple example would be to create 50 snowflakes with drawing commands. Each snowflake is kept inside its own new movie clip. Each snowflake is also a little different because we will use random numbers to determine the number of spikes and their length.

1. Create a new Flash movie.

2. Edit the script on the first frame. We'll add a bunch of functions there. The first one is a function that creates a snowflake. It accepts the number of this movie clip as the on parameter. For instance, snowflake number 1 will be called snowflake1 and be at level 1.

   The function creates a new movie clip. Then it sets the line style for drawing. A random number of spikes and a random length for those spikes are chosen. The function then uses simple trigonometry to draw lines from the center of the snowflake.

   function createSnowflake(n) {
       // create a new movie clip
       this.createEmptyMovieClip("snowflake"+n,n);
       mc = this["snowflake"+n];
   
       // set the line syle to hairline, white, semi-transparent
       mc.lineStyle(0,0xFFFFFF,50);
   
       // pick random number of spikes and their radius
       numSpikes = Math.round(Math.random()*5)+5; // 5 to 9
       spikeRadius = Math.random()*5+5; // 5 to 9
   
       // create each spike as line from center to point on circle
       for(var i=0;i<numSpikes;i++) {
           mc.moveTo(0,0);
           spikeAngle = 2.0*Math.PI*i/numSpikes;
           x = spikeRadius*Math.cos(spikeAngle);
           y = spikeRadius*Math.sin(spikeAngle);
           mc.lineTo(x,y);
       }
   
       // return reference to this movie clip
       return(mc);
   }
   

   
   
3. 
   

   The last function creates one snowflake, but we want to create many. The initSnowflakes function creates a number of snowflakes by calling the createSnowflakes function a number of times. It also sets a random location for the snowflake and random values for speed, drift, and rotate. These three variables will be used later to make the snowflake move.

   function initSnowflakes(n) {
       // remember number of snowflakes
       numSnowflakes = n;
   
       // create each snowflake
       for(var i=0;i<numSnowflakes;i++) {
   
           // create snowflae
           mc = createSnowflake(i);
   
           // set position
           mc._x = Math.random()*550; // 0 to 550
           mc._y = Math.random()*400; // 0 to 400
   
           // set movie clip variables
           mc.speed = Math.random()*3+3; // 3 to 6
           mc.drift = Math.random()*2-1; // -1 to 1
           mc.rotate = Math.random()*18-9; // -9 to 9
       }
   }
   

   
   
4. 
   

   The moveSnowflakes function loops through each snowflake and moves it according to its speed, drift, and rotate. If the snowflake moves off the sides or bottom of the stage, it will be reset to the other side or to the top. This keeps all the snowflakes falling constantly.

   function moveSnowflakes() {
       // loop through snowflakes
       for(var i=0;i<numSnowflakes;i++) {
   
           // move ad rotate the snowflake
           mc = this["snowflake"+i];
           mc._y += mc.speed;
           mc._x += mc.drift;
           mc._rotation += mc.rotate;
   
           // bring back to top
           if (mc._y > 400) mc._y = 0;
   
           // one side to another
           if (mc._x < 0) mc._x = 550;
           if (mc._x > 550) mc._x = 0;
       }
   }
   

   
   
5. 
   

   The frame script ends by calling initSnowflakes to make 50 snowflakes.

   // create 50 snowflakes
   initSnowflakes(50);
   stop();
   

   
   
6. 
   

   There also needs to be regular calls to moveSnowflakes. This will be done by a small movie clip. Create a shape and convert it to a movie clip. Move it off the stage. Then attach this script to it:

   onClipEvent(enterFrame) {
       _root.moveSnowflakes();
   }
   

   
   
7. 
   

   The snowflakes will be white. So if you leave the background color of your movie white, you won't be able to see them. Choose Modify, Document and change the color to black or a dark blue.

   
   
8. 
   

   Try your movie or the example movie 24snowflakes.fla. You can also play with the number of snowflakes and the range of values used to make each snowflake. Figure 24.7 shows one possible view of this movie as it runs.
   

   Figure 24.7. Fifty dynamically created snowflakes, all a little different from each other.