My Coding Life
The MovieClip life cycle revisited. From Event.ADDED to Event.REMOVED_FROM_STAGE.
June 15th, 2009 This post is a follow up to my previous post on the MovieClip life cycle. Previously I took a look at the sequence of events that occur during the life of a single frame. This post adds to the discussion by covering event types relevant to MovieClip display object children. Those events are Event.ADDED, Event.ADDED_TO_STAGE, Event.REMOVED, and Event.REMOVED_FROM_STAGE.
What follows is the same order of events from before, plus the four new events. The four have been around since Flash Player 9, they’re just new to my discussion. And to keep things short, I’m only going to discuss the new events in depth.
- Event of event type Event.ENTER_FRAME dispatched
- Constructor code of children display objects is executed
- Event of event type Event.ADDED dispatched from children display objects
- Event of event type Event.ADDED_TO_STAGE dispatched from children display objects
- Event of event type Event.FRAME_CONSTRUCTED dispatched
- MovieClip frame actions are executed
- Frame actions of children MovieClips are executed
- Event of event type Event.EXIT_FRAME dispatched
- Event of event type Event.RENDER dispatched
- Event of event type Event.REMOVED dispatched from children display objects
- Event of event type Event.REMOVED_FROM_STAGE dispatched from children display objects
A special note about these events. The order of the above is only specific to MovieClips added or removed from the timeline in the Flash IDE. Manually calling addChild() or addChildAt() will dispatch Event.ADDED and Event.ADDED_TO_STAGE events immediately after the add child call. The same holds true for the removeChild() and removeChildAt() calls, and the related Event.REMOVED and Event.REMOVED_FROM_STAGE events.
Steps 3 and 4
Event.ADDED and Event.ADDED_TO_STAGE are both dispatched when the playhead moves across the MovieClip timeline and encounters a keyframe with a new child display object. If the child exists in the frame immediately previous to the keyframe there a number of conditions that will still cause both events to be dispatched. Both events will be dispatched if the child exists on a different layer, or has a different instance name, or is being masked/unmasked. Masked is defined as the mask being added by keyframe to the mask layer. Unmasked means that in the next frame the mask layer is empty.
Regardless of the order that listeners are added, Event.ADDED is dispatched before Event.ADDED_TO_STAGE. If a child, in the frame the playhead is on, is not being added neither event will be dispatched.
Steps 10 and 11
Event.REMOVED and Event.REMOVED_FROM_STAGE are dispatched at the end of the current frame when a child exists on the timeline and does not exist in the next frame. There are other conditions that cause the remove events to be dispatched from a child that remains on the timeline. Conditions mirror those of the added events and include when the child in question appears on a new keyframe on a different layer, or the child has a different instance name, or the child is about to be masked/unmasked.
Regardless of the order that listeners are added, Event.REMOVED is dispatched before Event.REMOVED_FROM_STAGE. If a child is not being removed in the next frame, then neither event will be dispatched.
The MovieClip life cycle, Event.FRAME_CONSTRUCTED,
and Event.EXIT_FRAME.
The release of Flash Player 10 introduces two new frame related event types. Event.FRAME_CONSTRUCTED, and Event.EXIT_FRAME are the two new event types. These two new event types add another level of control for making animation sensitive changes to display list objects. The purpose of this post is to illustrate when these event types occur within a frame’s life cycle. Details will discuss the order that the events occur relative to Event.ENTER_FRAME, Event.RENDER, frame scripts, and constructor code of children display objects.
To provide context to the discussion it’s best to start with the order of events that are fired during a frame’s life cycle. This list was made by creating a Flash test file and looking at the currentFrame property of a MovieClip with the different frame event type listeners.
- Event of event type Event.ENTER_FRAME dispatched
- Constructor code of children MovieClips is executed
- Event of event type Event.FRAME_CONSTRUCTED dispatched
- MovieClip frame actions are executed
- Frame actions of children MovieClips are executed
- Event of event type Event.EXIT_FRAME dispatched
- Event of event type Event.RENDER dispatched
Steps 1 and 2
Flash Player 9 introduced Event.ENTER_FRAME, which is dispatched every time the playhead enters a new frame and is tied to the frame rate being run by the Flash Player. Event.ENTER_FRAME functions in much the same way as onEnterFrame() did in AS 2.0. In step 2 constructor code for any display list children is executed. This includes any display list objects extending from the native display list classes of the Flash API. The order of these two steps is the same as it was in Flash Player 9. Nothing new to report here.
Step 3
New to Flash Player 10 the event, Event.FRAME_CONSTRUCTED is executed. It’s important to remember the order for when this event is executed. At frame construction is the first time that it’s possible to start referencing newly added display list children of the MovieClip that is being listened to. This caused all sort of issues in Flash Player 9 after issuing a gotoAndStop call to a frame with display list objects that didn’t exist on the frame where the gotoAndStop call was made. Due to the fact that display list children had yet to be instantiated, targeting a display object child would return null the first time an Event.ENTER_FRAME was called after the gotoAndStop.
Steps 4 and 5
Steps 4 and 5 remain the same in Flash Player 10 as they did in Flash Player 9. First the frame actions of the MovieClip acting as a display object container are executed. Then the frame actions for display list children are executed. Note that in the Flash CS3 IDE the load order, a setting adjustable in publish settings panel, would affect the order that the display list children would execute their constructors and frame scripts. I haven’t found that dialogue in the Flash CS4 IDE publish settings, maybe Adobe removed it? In any case, by default, it uses a load order of bottom up in CS4. That means that display objects that are on a lower layer will have their constructor and frame scripts executed before display list objects on higher layers.
Steps 6 and 7
New to Flash Player 10, Event.EXIT_FRAME is executed in step 6. As it’s at the end of the frame life cycle, it would be good to use when there is a need to manipulate a display list object after its constructor and frame scripts have been executed.
Another possible use for Event.EXIT_FRAME is to replace calls in Flash Player 9 that were using Event.RENDER. Flash Player 9 introduced Event.RENDER, which according to Adobe documentation is dispatched right before the display list is scheduled to be updated. Depending on how one looks at it this may be true, as it’s at the end of the life cycle above, that would mean it’s at the beginning of the next frame life cycle. During testing for this article I found that according to the value of currentFrame on the MovieClip I had assigned all my listeners to, Event.RENDER was the last event to execute. In addition Event.RENDER first requires a Stage.Invalidate call before it is dispatched. On top of those two issues there were issues with dispatching Event.RENDER in the first few versions of Flash Player 9. Developers need to do sub-version detection of Flash Player 9 to ensure consistent behavior. For these reasons I suggest investigating Event.EXIT_FRAME to see if it works in place of Event.RENDER.
Despite the issues with Event.RENDER there are still times when Stage.Invalidate can be used. For example, calling Stage.Invalidate during mouse movements in Flash movies with a low FPS setting will smooth drag and drop animations.
GotoClip. A solution for Error #1009, gotoAndStop, gotoAndPlay and targeting children MovieClips.
One of the differences between ActionScript 2.0 and 3.0 is the behavior of MovieClip timelines and code targeting display list children. For example in AS 2.0 it was possible to call gotoAndStop or gotoAndPlay and then directly manipulate MovieClips at the targeted frame.
gotoAndStop(25);In AS 3.0 calling the equivalent code
child_mc._rotation = 25;
gotoAndStop(25);will yield a runtime error such as this.
child_mc.rotation = 25;
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at MyFla_fla::MainTimeline/frame1()
GotoClip is a class that restores some of the AS 2.0 timeline functionality to AS 3.0 MovieClips. It will allow calls to be made like this
gotoAndStop(25);while avoiding runtime errors. The class makes it possible to target a display list child MovieClip anywhere on the timeline after a gotoAndStop, or gotoAndPlay call. Then within the same code block properties can be set on the child MovieClip. During runtime the GotoClip class behaves as a proxy to store the commands made to the child MovieClip. GotoClip then applies those commands when the Flash Player has successfully drawn the child MovieClip to the stage, thereby avoiding the typical runtime Error #1009.
var child:MovieClip = getChildByName("child_mc") as MovieClip;
child.rotation = 25;
GotoClip resides within a small ActionScript library I created called the AS3 Display List Library. The library resides on Google Code. It includes a Wiki and the downloads section includes samples with source code and a swc which can be used for compiling with Flash and Flex projects.
TheCaminus.com live now!
After months of development, all during off hours outside of my regular day job, it feels great to finally launch thecaminus.com. The site is the portfolio of Calgary based photographer Jamie Clark. The page design was a collaboration between Jamie and myself. I handled all the programming and motion design. There are nine sections and approximately 125 photos to view. A basic MVC framework was used to control the site, and the galleries are all driven by XML. Check the site out now and take a look at some amazing photographs. Congrats Jamie!
Embedding Flash, which method to use?
There’s a great article on A List Apart about the different ways to embed Flash content. It’s a great read if you’ve ever scratched your head when you’re wondering, “should I use the code that is written within the Adobe Flash Player detection kit, use SWFObject, or write my own?”
Embed methods covered include:
- Twice-cooked
- Nested-objects
- Flash Satay
- Adobe Flash player detection kit
- UFO and SWFObject
