So I used to monitor comments coming in from the CS3 Video Workshop, which contains a few hundred video tutorials on the CS3 products. Some of the comments that came in regarding the Flash videos was how people were having frustrations about how to set up button code with ActionScript 3.0. I thought that’s where I’d start out, with a simple example that compares the two.

Luckily, the set up is pretty much the same assuming you put code on the Timeline. If you didn’t, it will be a bit of a change and you’ll need to follow the steps below.

When you were using ActionScript 2.0, you would put code on the main Timeline. You’d have a button on the Stage with the instance name myBtn (set in the Property inspector). You would add code to frame 1 that reads:

myBtn.onRelease = function() {
    getURL("http://www.flashthusiast.com");
};

In ActionScript 3.0 it looks a bit different. And yes, it’s an extra line of code and it is a bit more complex looking. However - you don’t need to use classes or anything, set up is the same. Here are the steps you’d take to create an interactive button in Flash CS3.

  1. Create a button, just as you would in Flash 8.
  2. Select the instance, and add the instance name monkey_btn in the Property inspector.
  3. Insert a new layer, and rename it actions.
  4. Open the Actions panel (Window > Actions), select frame 1 of the actions layer, and add the following ActionScript in the Script pane.
monkey_btn.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
function mouseDownHandler(event:MouseEvent):void {
    navigateToURL(new URLRequest("http://www.flashthusiast.com/"));
}
  1. Choose Control > Test Movie to test your document.

And that’s all there is to creating a clickable button with AS3. All you need to do is change the URL to make it work in your own document. You can also change the MouseEvent from MOUSE_DOWN to, say, MOUSE_OVER to change how the interaction works. Search Flash Help for MouseEvent, and look at the Class in the ActionScript 3.0 Language Reference.

Sample File - Button

If you have MORE THAN ONE BUTTON and want to add that to your FLA file, please continue on to this post about adding multiple buttons to your file.