It’s been a while that I’m trying to post the screen manager how to use (also because the code has already been on my code.google for a while).

So… aren’t you tired of building screens for every new site? Linking it to a movieclip? Manage all transitions?… And also having problems with scope access or listener?

On the net you’ll find some code that really fix the problems, like GAIA, but not in a simple and easy way. Personally I’ve being using this class for all my projects (games or simple websites) since I wrote it and I’ve noticed how fast I can start a project by using it.

To be able to build a screen you’ll need some class like this:

package com.filipesilvestrim.screenexample.screen
{
	import com.filipesilvestrim.screenexample.utils.ButtonManipulator;
	import com.filipesilvestrim.screenexample.utils.Consts;
	import com.filipesilvestrim.ui.screen.AbstractScreen;
	import com.filipesilvestrim.ui.screen.ScreenManager;

	import flash.events.Event;

	import gs.TweenLite;

	/**
	 * ...
	 * @author Filipe Silvestrim
	 */
	public class ScreenHome extends AbstractScreen
	{
		private var content : mcScreenHome;

		public function ScreenHome( name : String )
		{
			/* The AbstractScreen has 4 params:
				@param: String - being the name of the screen registered in the ScreenManager
				@param: Boolean - exist transition to the entrance of the screen
				@param: Boolean - exist transition to the exit of the screen
				@param: Boolean - if this screen have something to preload
			*/
			super(name, false, true);
		}

		//When someone calls the change to screen this is the first method to be called
		override public function build():void
		{
			//creating the view
			content = new mcScreenHome();
			//an AbstractScreen is a subclass of Sprite
			//so, we're adding the view created in flash to the ScreenHome instance
			addChild(content);

			//repositioning the view (anchor point is in the middle)
			content.x = 275;
			content.y = 200;

			//reset propeties
			this.alpha = 1;

			//getting access to the buttons created via flash
			ButtonManipulator.createButton(content.$instr, "Instructions", gotoInstr);
			ButtonManipulator.createButton(content.$more, "More Info", gotoInfo);
		}

		//helper callback event manipulated by the ButtonManipulator
		private function gotoInstr(e:Event):void
		{
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_INSTR);
		}

		private function gotoInfo(e:Event):void
		{
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_INFO);
		}

		//If the current screen is active and someone else calls the changeToScreen method
		//this method is called to destroy the current screen
		override public function destroy():void
		{
			TweenLite.killTweensOf(this);

			//cleaning the memory
			removeChild(content);
			content = null;
		}

		//All the optional screen functions as transitions in and out and preload
		//must to override their methods and when done call theirs end methods (event)
		override protected function transitionOut():void
		{
			TweenLite.to(this, 1, { alpha:0, onComplete:super.endTransitionOut } );
		}
	}

}

I’m showing here one example to show how easy and fast is to create screens in an ActionScript project using the ScreenManager.

And here is a example of a game screen:

This movie requires Flash Player 10

To download the example (source code) just click here to download the FlashBuilder project and link it to my library (donwload at my google code)

The document class of the project is this:

package
{
	import com.filipesilvestrim.screenexample.screen.ScreenHome;
	import com.filipesilvestrim.screenexample.screen.ScreenInfo;
	import com.filipesilvestrim.screenexample.screen.ScreenInstructions;
	import com.filipesilvestrim.screenexample.utils.Consts;
	import com.filipesilvestrim.ui.screen.ScreenManager;

	import flash.display.Sprite;

	[SWF(width=550, height=400)]
	public class ScreenManagerExample extends Sprite
	{
		public function ScreenManagerExample()
		{
			/*
				First we need to start the ScreenManager.
				The first param is the DocumentClass - we need this because
				the ScreenManager need to have direct access to the stage
				to get focus back to the current screen and if we would
				to access the main class or stage directly via the property scope.
				The second parameter is the local (DisplayObjectContainer)
				were the screen will be attached later.
			*/
			ScreenManager.getInstance().init(this, this);

			//Before start we need to register all the screens to be used later
			ScreenManager.getInstance().addScreen(new ScreenHome(Consts.SCREEN_HOME));
			ScreenManager.getInstance().addScreen(new ScreenInstructions(Consts.SCREEN_INSTR));
			ScreenManager.getInstance().addScreen(new ScreenInfo(Consts.SCREEN_INFO));

			//vamos inicializar/chamar a nossa tela de escolha
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_HOME);
		}
	}
}