Main Content

You are here:

URL Buttons in AS3

Welcome to Foundation Flash's tutorials. In this tutorial, I'm going to teach you how to make a URL button (though at a more general level, how to code any button). Before you start, you should know how to use event listeners / handlers. Do you remember our button that we made a couple of tutorials back?

The button we made a couple of tutorials ago

Well, we are going to be adding some ActionScript to that button to make it open up, in a new browser window, a webpage. Here is the finished product:

Well, let's get started, if you saved that button, then open it up. If not, just make another one. So, we have our operating button, but it doesn't actually do anything yet. We will have to fix that, so we will program the button, using ActionScript. This will only perform a limited function (opening a webpage) but it serves example for how to code any button.

Click on your button and give it an instance name of 'myButton' or the like, in the properties box. Now, click on the first frame in your timeline. Then press F9 to open up your actions panel, where ActionScript is entered (you could also add it to an external .as file with virtually no alterations). First, type in the actions panel:

myButton.addEventListener(MouseEvent.CLICK,goThere);
function goThere(e:MouseEvent){
 
}

What that is saying to Flash is:

When we click the button, execute the function called 'goThere'. The function called 'goThere' is what is between these curly brackets.

But obviously, we haven't put anything between the curly brackets yet. So let's do that now. Next, make your ActionScript say this:

myButton.addEventListener(MouseEvent.CLICK,goThere);
function goThere(e:MouseEvent){
        var request:URLRequest = new URLRequest("https://foundation-flash.com/");
 
}

We now have a new URLRequest: an object introduced in AS3 to work with URLs, so your ActionScript will now mean:

When the button is clicked, note down this URL

Now, we have to tell it to go to that URL, so make your ActionScript:

myButton.addEventListener(MouseEvent.CLICK,goThere);
function goThere(e:MouseEvent){
        var request:URLRequest = new URLRequest("https://foundation-flash.com/");
        navigateToURL(request);
}

So now, you have told Flash that when the button has been clicked on, it should open Foundation Flash. You must remember that URLs must be typed in quotation marks (it's a string, after all). Why not try it out?

When you click on the button Flash will now open a new window in your browser and go to foundation-flash.com. You have also ended the statement by closing the curly brackets, and placing a semi-colon at the end of each of your statements. The semi-colon is not necessary, but it is good practice to do that, and when you format your code, Flash will put semi-colons in for you.

Well, that's all for this tutorial, thank you for reading, and I hope you will join me for my next free ActionScript tutorial,

Leon (rewritten for AS3 by Harry).

Comments