Month: December 2007

What happens when something leaves the stage?

I noticed that problems can occur when something leaves the stage. At times when a movie clip leaves the stage you will want to clean up or put things in order. I found there are two events that occur when a display object leaves the stage: REMOVED and REMOVED_FROM_STAGE. These have the potential to be very useful.

Here’s a short snippet of code to show how they work. Imagine you have a movie clip named box_mc. The script below adds a the clip to the satge, then assigns a CLICK event listener to it. When the box_mc is clicked it removes itself from the stage. This enabled by adding the REMOVED_FROM_STAGE event listener.

var box_mc:MovieClip = new Box();
addChild( box_mc );
box_mc.addEventListener( MouseEvent.CLICK, click_box );
box_mc.addEventListener( Event.REMOVED_FROM_STAGE, remove_me );

function click_box( event:Event ):void {
	trace( "Click box" );
	removeChild( box_mc );
}

function remove_me( event:Event ):void {
	trace( event.target + " has been removed from the stage" );
}

Here’s another exmaple. Imagine you have a class that is used as he base class for a MovieClip. That is the class is set as the Base Class for a MovieClip Symbol in your library. This class might create objects that live on after it is removed from the stage.

To take care of these object you can give your class a destroy() method and add an event listener for REMOVED_FROM_STAGE. This way the clip takes care of cleaning up after itself.

Here’s an example of a class with a destroy() method set up as described:

package {
	import flash.display.MovieClip;
	import flash.events.*;

	public class OrangeBox extends MovieClip {

		public function OrangeBox() {
			addEventListener( Event.REMOVED_FROM_STAGE, destroy );
		}

		public function destroy( evt:Event ):void {
			trace( "Destroy the Orange box" );
		}
	}
}

Content Manager Class

These are some ideas that I have been working on. The goal was to make a simple system to display images or movie clip symbols on the stage. These use Tween for animation duties so be sure to include the Tweener class in the folder with any project that might use the Content_Manger class.

The basic idea is to animate any currently displayed clip off the stage and remove it from the display list. Then add a new clip to the display list and move  this clip in to view.

The first version, Content_Manager, extends the MovieClip class and so itself must be added to the display list. Content_Manager_1 example files: Content_Manager

The second version, Content_Manager2 takes three parameters when it is instantiated, these are:

  1. open_tween:Object
  2. close_tween:Object
  3. start_values:Object

These parameters determine the animation object that will be passed to Tweener for clips that are added to a page, open_tween. The animation object passed to Tweener for clips that are removed, close_tween. And an object containing the starting properties for clips that have been added to the stage, start_values.

Start_values set the intial starting properties for a clip, open_tween sets the animation applied to a clip as it moves on to the stage. Close_Tween sets the animation that moves a clip off the stage. Content_Manager_2 Example files: Content_Manager2

This last version of the content manger, Content_Manager3, adds a new parameter for the host clip. THe host clip is when an instance of Content_Manager3 is created. The host clip determines the MovieClip that Content_Manager3 will be adding, removing and animating clips within. Otherwise it is the same as Content_Manager2.

The example files show several ways in which this class can be used.

Add_Page3.fla, shows serveral different ways that clips can be animated by passing different objects to the Content_Manager3.

Add_Page4, shows how the content manager can be nested. Here the main movie uses content manager to add clips that also contain other instances of the Content_Manager3. Here are the Content_Manager3 example files: Content_Manager3