g
Printer Friendly Version

editor  
BellaOnline's Flash and Animation Editor
 

Button Behaviors in ActionScript 2.0 and 3.0

With the upgrade to ActionScript 3 in FlashR CS3, I am getting many emails asking how to attach a button behavior to a button in AS3. Well, you can't. In AS3, you add the code to a frame on the Timeline. I thought that it would be useful to put the bare bones code for both AS2 and AS3 side by side so that you can see the difference for yourself.

Instructions for ActionScript 2.0

  1. Start a new Flash project. Choose Flash File (ActionScript 2.0) from the Create New menu in the Welcome Screen.

  2. Draw a rectangle on the Stage. This will be your button.

  3. After you draw the rectangular button image on the stage, select it with the Selection Tool. Click Modify, Convert to Symbol from the Menu bar. In the Convert To Symbol dialog box, use the Movie Clip option and name your movie clip "myButton".

  4. The button should still be selected. In the Properties Inspector, give the button an Instance Name of "myButton".

    Now, you will add the AS2 code to the button itself. You will only do this when working on an ActionScript 2.0 Flash project.

  5. If the Behaviors Panel is not already open, click Window, Behaviors. In the Behaviors Panel, click the Plus sign and choose Web, Go to Webpage from the pop-up menu.

  6. In the Go to URL dialog box, enter the URL for the webpage, including the http://.

  7. Open the Actions Panel by clicking Window, Actions. Notice that the top tab in the Actions Panel says "Actions MovieClip" and the bottom tab says "myButton". This is because the code that magically appeared in the Actions Panel as you added the behavior to the button is attached to your myButton button. You will see the following code in the Actions Panel.

    on (release) {

    //Goto Webpage Behavior
    getURL("http://www.adobe.com","_self");
    //End Behavior

    }

  8. Click Control, Test Movie. When you test your button, a new browser window should open to the website.


Instructions for ActionScript 3.0

  1. Start a new Flash project and choose Flash File (ActionScript 3.0) from the Welcome Screen.

  2. After you draw the rectangular button image on the stage, select it and convert it to a movie clip symbol. Name it "myButton".

  3. The button should still be selected. In the Properties Inspector, give the button an Instance Name of "myButton".

    So far, the only difference is the choice you make on the Welcome Screen. But now, you will add the AS3 code to a frame on the Timeline instead of attaching it to the button itself.

  4. Make a new layer in the Timeline and name it "Actions".

  5. The first frame of this new layer will already have a keyframe. If you are using a frame other that the first frame, then you will need to add a keyframe to that frame by clicking Insert, Timeline, Keyframe from the Menu bar.

  6. You should still be on the Actions layer. If not, click on the frame on the Actions layer. Open the Actions Panel by clicking Window, Actions. Notice that this time the top tab says "Actions Frame" and the bottom tab says "Actions: 1". This is because we are adding the code to a frame and not to the button. Put the following code in the Actions Panel.

    myButton.addEventListener(MouseEvent.CLICK, goWhere)
    function goWhere (evt) {
    var url = "http://www.adobe.com"
    navigateToURL(new URLRequest(url))
    }

    Because we are not attaching the ActionScript to the button itself, we need to identify the button in the code. That is done in line 1 of the code above where we add an Event Listener for myButton. We follow this with the details of the function that we want performed if the button is clicked.

  7. When you test the button, a new browser window should open to the website.

Note: To open the new URL in the same browser window, change the last line of code to the following.

navigateToURL(new URLRequest(url), '_self');



Flash and Animation Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.



| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor