在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>
posted on 2009-11-11 21:59
The Matrix 阅读(1586)
评论(0) 编辑 收藏 所属分类:
Flex