Flash CS4 - Simple Button with AS3 - Ari Efendi

Advertisement

ads

Hot

Post Top Ad

Your Ad Spot

Saturday, January 1, 2011

Flash CS4 - Simple Button with AS3

In Flash CS4, creating a simple thing like a button is a little more complex than in versions past. Making a functional button requires a bit more coding than the simple actions that were once used. But it's not too bad, just a little but of Actionscript 3.0 will do the trick.

Let's get started by creating a new movie (Ctrl + N), and choose Flash File (Actionscript 3.0).

Next create a button by going to Insert > New Symbol (Ctrl + F8). You can create your button however you like, name it gobtn.

Now go to your Library (Ctrl + L) and drag a copy of your button on to the stage. With your button selected, go to Properties (Ctrl + F3) and give it the same Instance Name, gobtn.

On your Timeline, right click on Frame 1 and choose Actions. For the first line add stop();.

Simple function, whenever your movie runs into stop(), it stops and will not progress further until instructed to do so.

The next thing we'll do is add an Event Listener to our button. If you are unfamiliar with listeners, a listener basically sits and does just that, listens for a particular event to be broadcast and then it reacts by calling a function assigned to it. (There are differences in the way the addEventListener() method is used in Actionscript 3 versus the way it and addListener() were used in previous versions of AS, but I'm not going to get into that here.)

gobtn.addEventListener(MouseEvent.CLICK, goClick);

This Listener is waiting for a mouse event (a click in our case), and when a click is initiated, the listener recognizes it and calls a defined function, called goClick, and the function runs it's course.

The next thing we're going to do is create the goClick function being called that will handle the button action, this is what will tell Flash what to do when the button is clicked.

function goClick(event:MouseEvent): void {
   gotoAndStop(5);
}


This function tells the movie to go to and stop at Frame 5. I've simply added some text (T) with "This is Frame 5" on my Frame 5.




Working Example

And that's it. Not as simple as before, but not as hard as it seems.

No comments:

Post a Comment

Post Top Ad

Your Ad Spot