The RainDisplay Class
The RainDisplay class is an extension of the Sprite class; an instance of the RainDisplay class is a display object that can be added to the stage.
Once an instance of the RainDisplay class has been constructed and added to the stage and desired parameters are set, the main code simply needs to call the addDrop function to add individual raindrops to the stage, and the update function to update the animation. Within the addDrop function, various parameters for the newly added raindrop can be set such as initial velocity and color.
After raindrops have been added to the display, their movement is governed by gravity and wind speed. The main code simply needs to make repeated calls to the update function (either on an EnterFrame event or TimerEvent basis) to keep the animation going.
The addDrop function has the following format:
addDrop(
x0:Number,
y0:Number,
[velocityX:Number],
[velocityY:Number],
[color:uint],
[thickness:Number],
[alpha:Number],
[splashing:Boolean]
):LineRaindrop
In the addDrop function, a raindrop is added to the display (the raindrops used are members of the LineRaindrop class). The first two required parameters give the location for the new raindrop. The function returns the raindrop added, which may be convenient for referencing the new drop in the code.
There are several optional parameters in the addDrop function which define attributes for the new raindrop. These are self explanatory, except for the splashing attribute. If a raindrop has its Boolean splashing attribute set to true, it will create a splash when it hits the ground. If not, it will disappear without a splash.
One note concerning raindrop velocity: a raindrop can be set to have a constant "terminal velocity," by setting its atTerminalVelocity Boolean variable to true. Such drops will not have velocity affected by gravity.
If the optional parameters are not specified in the addDrop function, then default values are used. The values of these default values are contained in public variables, which are self explanatory in the RainDisplay code.
The raindrops can be colored by several methods. They can have (1) constant color, (2) random grayscale color, (3) random color on a gradient between two specified colors, or (4) completely random color. The variables and Boolean flags used for these various coloring methods should be clear from studying the code in the RainDisplay class.
The raindrops are members of the LineRaindrop class, and are drawn simply as line segments. These raindrops can be set to the "long" or "short" types. A short raindrop is drawn as a line from the last position of the raindrop to the new position. A long raindrop is drawn from its position two frames prior to the present position. This drawing method creates an effect of long continuous streaks of movement rather than discrete dots.
There are plenty of variables included in the RainDisplay class which allow you to customize the appearance and behavior of the animation. If you peruse the code, most of the variables will be self-explanatory.
A Few Comments on the Code
Although a developer making use of the RainDisplay class need not understand all of its inner workings, some aspects of the code may be of interest. To store lists of raindrops, the code in this class makes use of linked lists instead of arrays, since arrays tend to cause code execution to be slower. Another efficiency method is to make use of a “recycle bin” for raindrops which have left the visible animation range. Instead of removing drops when they are out of the visible animation range, they are instead made invisible, removed from the main list of raindrops, and placed into the recycle bin (which is just another linked list) where they are saved for future use. When new raindrops are needed, they are taken from the recycle bin (if it is not empty); the color and other parameters for the raindrop are reset as desired. This method prevents the constant creation of new raindrops, as well as the frequent adding and removing of raindrops from the stage, all of which are time-consuming tasks.
The splashes which occur as the raindrops hit the ground may appear to be a complicated aspect of the code, but in fact the splashes were fairly easy to code. Each splash is simply created by adding additional raindrops to the stage, with upward velocities (with some randomization). However, this presents a potential problem: how do we prevent these new raindrops from splashing again upon impact with the ground, creating more and more raindrops in the display? The secret is contained in the Boolean splashing attribute in the LineRaindrop class. Only raindrops which have their splashing attribute set to true create splashes upon impact. Raindrops which are created as part of a splash have their splashing attribute set to false, so when they hit the ground they disappear without creating new splashes.
How the RainDisplay Class is Used in the Examples
In both of the present examples, the rain display is actually not added to the stage. Instead, it is drawn to a bitmap on the stage for every frame of the animation. This allows a certain filtering technique to be used. Instead of the bitmap being erased and redrawn every frame, the old picture is faded out by means of a ColorTransform. This causes faint trails to be left behind as the raindrops descend, which creates a nice aesthetic effect. You can experiment with other types of filters (for example, use a BlurFilter instead of a ColorTransform) to create different kinds of effects.
The RainDisplay_Basic example illustrates the most basic usage of the RainDisplay class to create falling and splashing raindrops. The wind speed changes throughout the animation.
The RainDisplay_Dripping example creates the effect of falling drops of randomly colored paint. Here we give each raindrop initial velocity zero, so that the drops begin their descent from a resting position. We also make explicit use of some variables that were left at their default values in the first example, but which were designed for this dripping paint effect. These are the globalBreakawayTime and breakawayTimeVariance variables. The globalBreakawayTime sets how long a raindrop must have existed on the stage before it begins to move (it is named “global” to reflect that it effects all raindrops added to the rain display). The breakawayTimeVariance variable allows for some random variation in this breakaway time.
Download
- Download the source files: rain.zip