Learning ActionScript 3.0

Understanding the basic display object properties like x, y, width, height etc… is imperative for anyone interested in intermediate level ActionScript. It’s important to practice using properties until you understand them well enough to solve problems using them. If you’re not comfortable with properties yet, you should read through Chapter 3 and then try the exercises in the Property Practice (simple motion) post.

Continue reading ‘The Power of Relative Positioning’

In Chapter 3, we cover the basics of using events. One topic that's not covered extensively (appearing in later chapters), is using the dispatchEvent() method to send a specific, or even custom, event. This method is contained within the EventDispatcher class.

The dispatchEvent() method takes an Event object as its first and only argument. The following code will dispatch a custom event of type "my event":

dispatchEvent(new Event("my event"));

You can also use any AS3 event constant:

dispatchEvent(new Event(Event.INIT));

The below class dispatches an event after a one second timer has elapsed:

package {

    import flash.events.EventDispatcher;
    import flash.utils.Timer;
    import flash.events.*;

    public class DispatchEventExample extends EventDispatcher {

        private var _timer:Timer;

        public function DispatchEventExample() {
            _timer = new Timer(1000, 1);
            _timer.addEventListener(TimerEvent.TIMER, onTimer,
                                    false, 0, true);
            _timer.start();
        }

        private function onTimer(evt:TimerEvent):void {
            dispatchEvent(new Event("one second elapsed"));
        }
    }
}

To listen for the event, use the addEventListener() method. Similar to when dispatching events, as discussed previously, you can either listen for an event constant (such as Event.ENTER_FRAME, or your own custom event class), or a simple string. Here is an example document class that listens for the "one second elapsed" event:

package {

    import flash.display.Sprite;
    import flash.events.Event;

    public class Main extends Sprite {

        private var _dispatchExample:DispatchEventExample;

        public function Main() {
            _dispatchExample = new DispatchEventExample();
            _dispatchExample.addEventListener("one second elapsed",
                                      onOneSecond, false, 0, true);
        }

        private function onOneSecond(evt:Event):void {
            trace("_dispatchExample has dispatched an event");
        }
    }
}

Continue reading 'Dispatching Custom Events'

Earlier, in the "Event Phases in Action" post, we discussed using the event listener capture phase. This post shows an animation-based example of the capture phase in use.

Before AS3, if I wanted to reference a bunch of unnamed clips I would use a for..in loop:

// as2 style
for (var i:String in this) {
    trace(this[i]);
}

I would follow this up with a check to see if this[i] was a movie clip and, if it was, I would do something with it. This approach no longer makes much sense with the advent of the AS3 display list. Instead, you would use something like this:

for (var i:uint = 0; i < numChildren; i++) {
    trace(getChildAt(i));
}

If we wanted to get at all the nodes of the display list our code would start to look a bit more complicated. We addressed this in the book in Chapter 4, in the "Displaying the Display List" section beginning on page 54. As an interesting alternative we can use the ADDED_TO_STAGE event's capture phase to get at all the nodes on the display list. Here is a simple example:

var container:Sprite = new Sprite();
container.name = "container";
var one:Sprite = new Sprite();
one.name = "one";
var two:Sprite = new Sprite();
two.name = "two"
var three:Sprite = new Sprite();
three.name = "three";
var four:Sprite = new Sprite();
four.name = "four";

one.addChild(two);
two.addChild(three);
three.addChild(four);

container.addChild(one);

container.addEventListener(Event.ADDED_TO_STAGE, onAdded, true, 0, true);
addChild(container);

function onAdded(evt:Event):void {
    trace(evt.currentTarget.name + " " + evt.target.name);
}

This will trace the following to the output window:

container one
container two
container three
container four

The above code starts off by creating a set of nested sprites. Sprite container holds sprite one, sprite one contains sprite two, etc. Given this group of sprites we add a listener to the container sprite with the capturePhase boolean set to true. Because all sprites dispatch an ADDED_TO_STAGE event, the listener function runs for each sprite starting with one moving down the display list to two and so on. The currentTarget property of the event object remains container.

Continue reading 'Interesting Use for Capture Phase'

The familiar format we've used for event listeners includes five parameters.

//btn.addEventListener(eventType, listenerFunction, useCapture, priority,
//                     useWeakReference);
btn.addEventListener(MouseEvent.CLICK, onBtnClick, false, 0, true);

The first and second parameters are mandatory, and are the event type and function that is called when the listener is triggered. The third, fourth, and fifth parameters are optional. The third determines the event phase used (see "Event Phases in Action" for more information), and the last specifies whether or not a weak reference is used (see "Garbage Collection" on page 47 of the book for more information).

The fourth parameter, however, is an integer that sets the priority of the listener. Because a single object can use multiple listeners for the same event, it is sometimes useful to specify the order in which the similar listeners are executed.

The default value for the priority parameter is 0. If the optional parameter is omitted, all listeners will have a value of 0 and events will be handled in the order in which they were added. If unique integers are used, the listener with the highest priority will be executed first, and so on down the line.

The below code snippet uses the priority parameter to execute the events in the opposite order in which they were added:

This will trace:

priority 2 event
priority 1 event
priority 0 event

While it is not common for objects to have multiple listeners listening for the same event, if that need arises, you can still control their execution order using the priority parameter. For example, you may require that an initialization routine execute prior to another function. We'll revisit this topic again in future posts, so check back periodically if you're interested in this topic.