Friday, 26 March 2010

Rain effect in AS3 part 2

You’ve probably heard of the phrase ‘Raining cats and dogs’ which basically means its raining very heavily. Inspired by this phrase I will be literally creating a ‘Raining cats and dogs’ effect by modifying the previous Rain effect in Actionscript 3 tutorial. I will be adding additional lines of code and modifying the rain drop movie clip. For this effect you will need an image of a cat and dog.

Rain effect in Actionscript part 2

Step 1

Open up the Rain effect tutorial.
Import the images you wish to use by selecting File > Import > Import to Library. Then in the library panel locate the rain drop movie clip and double click to enter the timeline.

Step 2

Using the selection tool (V) select the rain drop and delete from the stage. Drag one of your images from the library onto the stage. You may need to resize the image by using the Free Transform tool (Q). Also make sure the position x and y is at 0.

Step 3

Insert a key frame (F6) on the second frame then drag your second image onto the stage. You should now have two images both on separate frames. On the timeline insert a new layer called ‘Actions’ then open up the actions panel and enter the following code.

//This stops the play head from playing the second frame when you run the movie.

Step 4

Return to the main timeline by pressing the back button or double clicking on grey area on the stage. Now open up the actions panel and add the following line of code inside the first for loop.
//This will randomly choose either frame 1 or 2 using the Math.random() method.

If your cat and dog images are looking a little too large, you can use the scaleX and scaleY properties to reduce the size.
//This will reduce the images to half the size.
myRain.scaleX = .5;
myRain.scaleY = .5;

You can also randomise the scale property if you wish, but you might end up with strangely shaped cats and dogs.

Step 5

Test your movie Ctrl + Enter.

You should have a raining cats and dogs effect.


  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP