16.3 Adding Scripts to Buttons

	ActionScript for Flash MX: The Definitive Guide, 2nd Edition By Colin Moock
	Chapter 16.  ActionScript Authoring Environment

In Flash 5, button code is attached directly to button objects on stage. For example, in Flash 5, if we want the clicking of a button to advance the playhead of a movie to a frame labeled section1, we attach the following code to that button:

on (release) {   gotoAndStop("section1"); }

In most cases, Flash MX's button callback-function-based event handlers should be used on a movie clip timeline in place of the older style on(event) syntax. However, in some trivial situations it is more convenient to add code directly to a button.

To add code to a button, select the button on the Stage, and add the code to the Script pane of the Actions panel. Code on buttons must always be placed in an event handler that identifies the circumstances under which the code should execute. For example, the event that triggers most button actions is release. We might also use the rollOver event, causing code to execute when the mouse moves over the button, not when the button is pressed:

on (rollOver) {   this.gotoAndStop("section1"); }

For a complete description of button event handlers, see Chapter 10.

Though it is legal to place thousands of lines of code on a button, it's always a bad idea to overload a button with code. Whenever possible, generalize and package the behavior of button code into functions attached to the button's parent timeline. For example, we could add the following code to a button:

on (release) {   this.title._xscale = 20;   this.title._yscale = 20;   this.title._alpha  = 50;   this.title.gotoAndPlay("fadeout"); }

But we're better off placing that code in a function and calling the function from the button:

// CODE ON FRAME 1 OF THE MOVIE. ADDS A fadeOut( ) METHOD TO ALL CLIPS. MovieClip.prototype.fadeOut = function (scale, transparency) {   this._xscale = scale;   this._yscale = scale;   this._alpha = transparency;   this.gotoAndPlay("fadeout"); } // CODE ON BUTTON on (release) {   this.title.fadeOut(20, 50); }

Or, better yet, in Flash MX we should add an event handler to the Button instance as follows:

theButton.onRelease = function ( ) {   this._parent.title.fadeOut(20, 50); }

This approach keeps all of our code centralized and easy to maintain and allows us to apply the button's behavior to many buttons quickly and with minimal effort.

Button code must be attached to a button object on stage and must include an event handler. Button code without an event handler will cause an error, and it's not possible to attach code to the internal Up, Over, Down, and Hit frames of a button symbol.