Problem:

Here is how we construct a MouseEvent handler in ActionScript 3.0:

myButton.addEventListener(MouseEvent.CLICK, openURL, false, 0, true);

private function openURL(e:MouseEvent):void
{
   navigateToURL(new URLRequest("http://www.mysite.com"), "_blank");
}

Note that we set the fourth parameter, useWeakReference, to true. This ensures that if this listener is the the only reference to the myButton remaining, myButton can still be garbage collected if required.

The trouble with this is that every time myButton is clicked, the same URL will open. We can’t easily pass a parameter to the function which is acting as a listener. How can the same function be used by many buttons to open a different URL for each button? How can we pass a parameter?

Solution 1: Custom events (won’t work):

It would be nice if we could dispatch a custom event on mouse click. Custom events extend the event class enabling us to dispatch an event with additional properties (like a URL). This event is received by the handler then the property is accessed. The trouble is this approach won’t work here because the Flash Player automatically dispatches MouseEvents, we don’t dispatch them ourselves. (If anyone sees a way this may be done, please comment below.)

Solution 2: Embed the function call (not advised):

An interesting strategy is used here, whereby a call to a function is used as the event handler, and this returns the function to use, including the desired parameter. The trouble with this approach is that it is not really good form, in that there is no way we can reference the handler if we did want to remove it using removeEventListener().

We’re beginning to see that there is actually no way to “pass” a parameter, really. We have to rather detect the button-specific value by “association”. The following solutions all achieve this by using the MouseEvent’s target property:

Solution 3: Use a switch statement on the event’s target property

When the button is clicked, providing there is no further mouse-enabled object inside it, that button is the event’s target. We can say it dispatched the event. We can access the target object that dispatched the event using a property of the event itself:

myButton.addEventListener(MouseEvent.CLICK, openURL, false, 0, true);

private function openURL(e:MouseEvent):void
{
   trace(e.target + "dispatched this event!");
   navigateToURL(new URLRequest("http://www.mysite.com"), "_blank");
 }

If we can access the target we can decide what to do in the handler depending on the target:

myButton.addEventListener(MouseEvent.CLICK, openURL, false, 0, true);

private function openURL(e:MouseEvent):void
{
   var u:URLRequest = new URLRequest;

   switch(e.target)
   {
      case myButton:
         u.url = "http://www.mysite.com";
         break;

      case myOtherButton:
         u.url = "http://www.myothersite.com";
         break;

      default:
         throw new Error("No URL set for " + e.target);
         return;
   }

   navigateToURL(u, "_blank");
}

This works well.

Solution 4: Use a public custom property inside the dispatching object

We could avoid a switch statement and instead have a property inside the dispatching class which can then be detected. So if our button extends Sprite, let’s say, we could have an instance property in there called url and we could detect that, as follows:

myButton.addEventListener(MouseEvent.CLICK, openURL, false, 0, true);

private function openURL(e:Event):void
{
   var u:URLRequest = new URLRequest;
   navigateToURL(new URLRequest(e.target.url), "_blank");
 }

This is fine too, but we might need to throw an error if the object dispatching the event doesn’t have a url property.

Solution 5: Use a dictionary object to track variables

Dictionary objects in ActionScript are similar to associative arrays but they can accept complex objects, as opposed to strings, as their keys. After creating our button we could push a reference to it into a dictionary and specify a value to associate with it, like this:

var dict:Dictionary = new Dictionary(true);  // use weak references to the objects
var myButton:Sprite = new Sprite;
dict[myButton] = "http://www.mysite.com";
addChild(myButton);

myButton.addEventListener(MouseEvent.CLICK, openURL, false, 0, true);

private function openURL(e:MouseEvent):void
{
   navigateToURL(new URLRequest(dict[e.target]), "_blank");
}

This is perfectly workable too.

Solutions 3, 4 and 5 all seem equally good solutions to this problem. There is just one final option, which is to avoid the problem altogether by using separate listeners for each button. But that, of course, is what we were trying to solve in the first place.

As a start to the new year, we’re applying a 25% discount for all trainees – and an additional 25% for those who are self funded!

If you would like to attend the course please get in touch.

If you’d like to attend the course please get in touch.

You want to be able to see trace statements etc. whether your application is in Test Movie mode, running locally over HTTP or running remotely over HTTP in the browser plug-in. You don’t want to use the the Flash Debugger and you don’t want to have to install Flash Debug players. You just want to see trace() statements – in a more aesthetically pleasing window if possible..

Solution

• Constructor functions run slower than “regular” methods. (See here for details.)
• You might want to re-run initialisation code without recreating the instance.
• You might want to run delayed initialisation code, for example once an object has been added to the Display List. (See our post here regarding this issue.)

Something we often do here is get the “id” of a clicked menu button and instantiate a section of a site, depending on the ID passed. Usually all sections of a site inherit from a generic “Section” class, then have additional specific capabilities depending on the section. So, depending on the ID passed, we need to create an instance of the particular class. This means we need to get the class name dynamically from the string passed by the button.

Let’s imagine the “music” button was pressed. We’ll either have a listener for this or we’ll directly call a method called loadSection(), passing the ID (the name of the button usually). We name instances in camel notation, so that’ll be “music”.

This string goes over to the loadSection() method and in here we use a custom StringUtils class to covert the first letter to upper case, getting us the required class name as a string. So this gives us “Music”. A string is no good on its own though – we need to get the class reference for this, as follows:

// required "dummy" ref to ensure class is compiled...
var dummyRef:Music;
...
// get class reference
var classRef = getDefinitionByName(id);
// instantiate class instance as current section
section = new classRef();

Problem

All well and good. The trouble is sometimes it just doesn’t work and you’ll get:

ReferenceError: Error #1065: Variable Music is not defined

There’s a thread here where the person was getting this, and it drifted off into another debate without being solved. The import statement is there. The dummy class reference is there, but still it doesn’t work.

Solution

What is not immediately clear is that you need to provide a fully qualified class path to getDefinitionByName() – even though you have set up an import.

Amend as follows (for example) and your problem is solved:

// var classRef = getDefinitionByName(id);
var classRef = getDefinitionByName("sections." + id);

“sections.” here is a reference to our package structure.

We hope this helps you.

If you would like to reserve a place please get in touch.

What they don’t make clear is that you need to be sure to overwrite your point when using it:

// WRONG:
var pt:Point = new Point(target.x, target.y);
target.parent.localToGlobal(pt);
parent.globalToLocal(pt);

// RIGHT:
var pt:Point = new Point(target.x, target.y);
pt = target.parent.localToGlobal(pt);
pt = parent.globalToLocal(pt);

Simply running a localToGlobal() method on a point in a given scope is not enough. You need to write the result back into the point. You might be forgiven for not seeing this, because it was not necessary for the equivalent method in AS2!

localToGlobal() and globalToLocal() can be the source of considerable frustration, especially as this differences such as this are not mentioned by Adobe. But properly understood these methods are not complicated. If this post helped you please let us know.

The course is limited to only 5 delegates. If you would like to reserve a place please let us know – we’d be happy to have you there.

If you run into the TypeError:

Error #1007: Instantiation attempted on a non-constructor

..when compiling with Flash CS4, the reason is that APE defines a class called Vector, which clashes with a new class, of a different kind, in Flash 10, also called Vector.

The solution is to either avoid publishing for Flash 10, if you don’t need it, or replace all references to Vector throughout the APE code with the fully qualified reference org.cove.ape.Vector.