Creating View States purely in AS3

I've been building a bunch of custom AS3 components for clients lately, and have run across the need to use view states 
within an AS3 component.  Working with states in MXML is pretty trivial, using the AddChild, RemoveChild and SetProperty 
   tags, you can do virtually anything you need, but when working in an AS3 only environment, it becomes a bit trickier, since 
   there are no tags...

Of course, anyone that has worked with Flex for any length of time knows that MXML tags are interpreted into AS classes 
before the application is compiled into a swf, so anything you can do in a tag, you can also do with pure AS.

I was looking to do the AS3 equivilent of this:

<mx:states>

  <mx:State name="minimized">

    <mx:SetProperty target="{this}" property="height" value="{this.getStyle('headerHeight')+15)}"/>

    <mx:SetProperty target="{this}" property="width" value="{this.minWidth}"/>

    <mx:SetProperty target="{this}" property="vScrollPolicy" value="off"/> 

    <mx:SetProperty target="{this}" property="hScrollPolicy" value="off"/> 

  </mx:State>

</mx:states>

Here is my AS3 to do the same thing:

private function buildStates():void{
   var overrides:Array = new Array();
   var newState:State = new State();
   overrides.push(makeSetProp(this,"height",this.getStyle("headerHeight")+5));
   overrides.push(makeSetProp(this,"width",this.minWidth));
   overrides.push(makeSetProp(this,"vScrollPolicy","off"));
   overrides.push(makeSetProp(this,"hScrollPolicy","off"));
   newState.name="minimized";
   newState.overrides = overrides;
   this.states = new Array(newState);
}
private function makeSetProp(target:UIComponent, property:String, value:*):SetProperty{
   var sp:SetProperty = new SetProperty();
   sp.target = target;
   sp.property = property;
   sp.value = value;
   return sp; 
}

Essentially what we have is that each UIComponent has a property called states, which holds an array mx.states.State instances.  
Each State has an array of things to override, called "overrides."   In this case, each of the overrides is a SetProperty, although, it 
could just as easily be AddChild or RemoveChild.

When I get a bit more time, I'll put an example of this up in action.

tags: as3  flex  

links: digg this    del.icio.us    technorati    reddit