flex编程实现State

在Flash Builder 4 Beta 2版本中，使用mxml方式实现state的切换有了很大改进，使用起来更方便，具体可参见下文：

http://onflex.org/learn/fx4/index.php?page=States

看完这篇文章后，想到一个问题，如何用变成的方式实现切换呢，找了参考资料，实现了一个例子，代码如下：

开发环境：Flash Builder 4 Beta2

<?xml version="1.0" encoding="utf-8"?>
<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    creationComplete="creationCompleteHandler(event)">
    <fx:Script>
        <![CDATA[
            import mx.core.UIComponent;
            import mx.events.FlexEvent;
            import mx.states.SetProperty;
            import mx.states.State;
           
            import spark.components.Label;
            import spark.components.Panel;

            private var stateArray : Array;
            private var state1 : State;
            private var state2 : State;
           
            protected function creationCompleteHandler(event:FlexEvent):void
            {
                state1 = new State();
                state1.name="state1";
               
                state2 = new State();
                state2.name="state2";
               
                var stateArray1:Array = new Array();
                var stateArray2:Array = new Array();
               
                state1.overrides = stateArray1;
                state2.overrides = stateArray2;
               
                stateArray = new Array();
                stateArray.push(state1);
                stateArray.push(state2);
                this.states = stateArray;
               
                var panel:Panel = new Panel();
                group.addElement(panel);
                var label:Label = new Label();
                panel.addElement(label);
               
                buildStates(stateArray1, stateArray2, panel, label);
                this.currentState = "state1";
            }

            private function buildStates(stateArray1:Array, stateArray2:Array,
                compenent1:UIComponent, compenent2:UIComponent) : void{
               
                stateArray1.push(makeSetProp(compenent1, "title", "Panel1"));           
                stateArray1.push(makeSetProp(compenent2, "text", "One"));
               
                stateArray2.push(makeSetProp(compenent1, "title", "Panel2"));
                stateArray2.push(makeSetProp(compenent2, "text", "Two"));
            }
           
            private function makeSetProp(target:UIComponent, name:String, value:*):SetProperty{
                var sp:SetProperty = new SetProperty();
                sp.target = target;
                sp.name = name;
                sp.value = value;
                return sp;
            }
        ]]>
    </fx:Script>
       
    <s:VGroup autoLayout="true" horizontalAlign="center">
        <s:HGroup horizontalCenter="0">           
            <s:Button label="One"
                click="this.currentState='state1'"/>           
            <s:Button label="Two"
                click="this.currentState='state2'"/>           
        </s:HGroup>
        <s:HGroup id="group" horizontalCenter="0">           
        </s:HGroup>
    </s:VGroup>
   
</s:Application>