Flash 8 Action Script Tutorial

ActionScript code is usable even by people with no programming experience.

Using ActionScript in your Flash movies adds interactivity and allows you to create a host of dynamic effects. Even people with little programming or coding experience can easily use small amounts of ActionScript to take their Flash work to another level. You don't need to learn large amounts of code straight away. If you start by inserting short excerpts of code to enhance your Flash objects, you'll be on your way to more sophisticated interaction in only a short time.

Difficulty:

Moderately Easy

Instructions

1. Open Flash 8 and select Create New---Flash Document. Save your file by selecting "File," "Save As."

2. Create a Symbol in your Flash movie by first drawing a shape on the white rectangular stage area using the Tools. For example, draw a circle shape using the Oval Tool, choosing colors for your line and fill. Select the shape by choosing the Selection Tool (the black arrow) and double-clicking on the shape or clicking and dragging a marquee around it. Turn the shape into a Symbol by pressing F8 or choosing "Modify," "Convert to Symbol" from the menu. Enter a name for your symbol such as "mycircle," select the Movie Clip radio button and click OK.

3. Set your Symbol up for the ActionScript code. With the Symbol you created selected, open the Properties panel if it's not already open. The panel should indicate the name you gave the Symbol after the words "Instance of:". Click in the text box with <Instance Name> in it, and enter a name for your Symbol instance. For the purposes of this tutorial, use the name "myshape_mc." You can name your Symbols more or less anything you like, but it's best to keep with the conventions and use the suffixes "_mc" for Movie Clips and "_btn" for Buttons, as this makes writing your ActionScript code easier.

4. Create a new layer for your ActionScript code. In the Timeline area of your Flash document, you should see only one layer, named by default Layer 1. Click on the Insert Layer button just below this, and Layer 2 should appear above Layer 1. Double-click on the Layer 2 text and rename the layer by typing "Actions." This is not necessary for your movies to function, but it is a good habit for keeping things organized. You may also change the name of Layer 1, for example, to "Shape."

5. Click on your Actions layer and open the Actions panel, which is normally visible just above the Properties panel. Click in the white area where a "1" indicates the first line, as this is where you will insert your ActionScript code. Your shape Symbol is going to be enhanced with a little simple interactivity. To detect when the shape is clicked on, you need to add a Listener for the Symbol's onPress event. To do this, type the following code:

   myshape_mc.onPress=function()
   {
   trace("OUCH!");
   };

   This code simply tells Flash to listen for the event of the myshape_mc Symbol being pressed, and when it happens, to execute whatever code is contained within the function stated, which appears between the curly brackets. In this case, all we want Flash to do is output a small bit of text.

6. Test your movie by pressing Control+Enter or choosing "Control," "Test Movie" from the menu. In your exported movie, click on the shape. You should see the word "OUCH!" appear in the output panel.

Tips & Warnings

• If you're new to programming, don't worry if you find the syntax confusing at first. Once you get into the habit of using small amounts of code like this, you will be able to increase it gradually and produce more and more sophisticated movies.

• ActionScript has different versions with which you can achieve vastly different effects. You can target one by choosing "File," "Publish Settings," "Flash" and selecting from the ActionScript version drop-down list. The default for Flash 8 is normally ActionScript 2.0, which works for the above code.

• If you program in other languages already, you can use approaches such as Object Oriented Development to create substantial applications in Flash. However, the authoring environment is a little different than most development environments for programming, as the code and design elements are all created together.

References

• Adobe Developer Connection: ActionScript 2.0 Guides, Tutorials and Samples

Resources

• ActionScript.org: Basic Animation Via ActionScript