RAIN ANIMATION WITH ACTIONSCRIPT

 

This effect uses looping to add movieclips to stage and a little bit of math class to create randomness and movieclip class to set the position and other properties of the raindrops. I have added comments to the script which may help you in understanding the script better.Now go on and enjoy the tutorial

DOWNLOAD SOURCE

  • Create a new flash document by selecting file new flash document
  • Choose Modify >>Document and set the moviesize to 400*300 px.
  • Now Choose File>>Import>>Import to stage and import a picture as shown below . if you don't have one you can download this image itself for the tutorial

  • Now use free transform tool to Align the Picture according to your stage width and height So that to background is not seen
  • Select the whole picture and press F8 and convert it to a movieclip.
  • Now click on the movieclip and set its alpha to 60% in the properties panel
  • Then choose Insert>>New symbol to insert an new symbol and set the options as shown below. i.e. click the advanced tab and check the box export for actionscript, give the identifier name as circleclip

   
  • Select the rectangle tool to draw a box with no border(for setting no border click on the rectangle tool select the border colr to none and draw the shape) as shown below such that the "+" sign on stage comes almost at the center of the rectangle.

  • Now with the rectangle still selected go to color mixer and set the options as shown below.

  • Change the background color of the movie(modify >>Document) to some one other than white just to see the fill inside the box
  • Now select the fill transform tool and click on the box shape and transform the fill as shown in the figure.

  • Change the background color to white again.
  • Go back to scene 1 ( View >>Go to >>Scene 1 ) and add the following code in the first frame

/*
*************************************
code by vishnu ms flashhelp.110mb.com
*************************************
*/

//Creating an empty movieclip to attach the clip from library
_root.createEmptyMovieClip("holder",this.getNextHighestDepth());
//settig variables
holder.maxdrops=600;//no of drops
var downspeed=500;//speed of the drops
var dropslop=30;//slop of the drops
//Part 1 attaching the clips with loop
for(i=0;i<holder.maxdrops;i++){
holder.attachMovie("circleclip","drop"+i,i+5);
focuseddrop=holder["drop"+i]
focuseddrop.cacheAsBitmap=true;
focuseddrop._x=random(Stage.width);
focuseddrop._y=random(Stage.height);
focuseddrop._yscale=random(100);
focuseddrop._rotation=-dropslop;
}

//part 2 setting an interval for motion of drops
var dropup=setInterval(movedrop,1)
//function to repeat in the interval
function movedrop(){
for(i=0;i<holder.maxdrops;i++){
focuseddrop=holder["drop"+i]
focuseddrop._rotation=-dropslop;
focuseddrop._y+=25+downspeed/focuseddrop._yscale;
focuseddrop.x+=Math.tan(dropslop);
if(focuseddrop._y>=Stage.height+20){
focuseddrop._y=random(30);
focuseddrop._x=random(Stage.width);
}
}
}

EXPLANATION OF THE CODE NEXT PAGE >>

 
 
   
     

©2007 flashhelp.110mb.com