Setting the Scene
First, you’ll need to create a new Flash movie to showcase your effect.
1. Select File > New to create a new Flash movie.
2. Select Modify > Document and set both the width and height of the movie to 300 pixels.
In order to randomly place and move copies of your object, you’ll first need an object to use. In this example, we’ll create a movie clip container named MCWorld, which will contain another movie clip, called World.
3. Select Insert > New Symbol, select Movie clip, and name the clip MCWorld. Click on the Advanced button to view the clip’s linkage parameters, select Export for ActionScript, and name the identifier MCWorld, as shown in Figure 3.1.
We select the Export for ActionScript button because, in a moment, we’ll use ActionScript dynamically to create instances of this clip. To do that, we need to make it available to ActionScript by choosing this option and assigning the clip a unique identifier.
4. Create a graphic symbol that contains the object or image to which you want to assign random movement. Select Insert > New Symbol… and choose Graphic. Name this symbol World, then create the object either with the drawing tools, or by importing an image or other object from an external source.
The Library Panel should now contain a graphic symbol named World, as in Figure 3.2.
Figure 3.2. Add the child movie clip.
5. Double click the MCWorld movie clip to open it. Drag an instance of the World symbol into it and name the instance World.
Adding the ActionScript
Great! We’ve created a clip called MCWorld that contains a graphic called World. Now, we can begin to add the ActionScript that will control what takes place on the stage:
6. Select Layer 1 within the main timeline, and give it the name ActionScript. Expand the Actions Panel (select Window > Development Panels > Actions or press F9).
7. Add the following code within the Actions Panel. This code creates thirty instances of the MCWorld clip and places them on the canvas at random. It also randomly alters the clips’ opacity.
var numObjects = 30;
for (i = 0; i < numObjects; i++)
{
var randomObject = attachMovie ('MCWorld', 'MCWorld' + i, i);
randomObject._x = random (300);
randomObject._y = random (300);
randomObject._alpha = random (100);
}
The key here is the attachMovie method, which lets you add a new movie clip to the current movie. The parameters we pass to this method are: the identifier we gave the clip in the library (MCWorld), a unique name for each clip instance (in this case, MCWorld with a number appended to it), and a number that indicates where to place the clip in the stacking order.
Also of note in this code is the random function, which returns a random integer between zero (inclusive) and the specified number (exclusive). So random (300) returns a number from 0 to 299. We use this function to generate the position on the stage and the opacity for each instance we create.
With our stage filled with randomly-positioned graphics, it’s now time to move them around.
8. Double-click the MCWorld movie clip in the Library Panel to open it. Select Layer 1 and rename it ActionScript.
9. Add the following code within the Actions Panel. It uses setInterval (a standard JavaScript function) to move the graphic symbol instance (World) to a new random position within two pixels of its current position every tenth of a second.
setInterval (Randomizer, 100);
function ()
{
var xShift = random (5) - 2;
var yShift = random (5) - 2;
World._x += xShift;
World._y += yShift;
} We could instead have used an onEnterFrame event handler to do this, but setInterval allows us to define the speed of the motion independent of the movie’s frame rate, which can be useful in many circumstances.
