在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>
分享到:
相关推荐
Flex白皮书 Flex cookbok Flex编程指南 Flex设计模式等
Flex 编程小技巧 1. 复制内容到剪贴板 1. System.setClipboard(strContent); 2. 复制一个 ArrayCollection 1. //dummy solution( well, it works ) 2. var bar:ArrayCollection = new ArrayCollection(); 3. for ...
Flex拖拽编程详解,Flex拖动方法。
Flex 4 高级编程Flex 4 高级编程Flex 4 高级编程Flex 4 高级编程
编程基础语法 流程控制语句 控制语句和数据类型 面对对象编程 静态常量继承和接口 数组和类型转换
flex编程指南pdf文档,是flex初级者的必备教材
《Adobe Flex 3 高级编程》官网源码 第28章有619兆而没有上传
flex3 programing,中文版分享于同僚~~
Flex 编程入门教程 Flex BUILD 3 界面操作及基础介绍等等
最详细的FLEXA编程教程PPT课件.pptx
flexa 编程,供SMT行业同仁使用。
了解 flex State对象 以及关于flex state的demo的代码
Adobe Flex 3 高级编程 源码
flex实现了图片的拖拽功能,包括,拖动图片不删除原来图片,和拖动图片删除原来图片
富士PLC编程软件FUJI NB系列编程软件Flex PC Programmer V2.1.0.28中英文版及其编程手册内含富士PLC_SPB编程软件使用手册,以及富士N系列PLC编程手册FLEX PC Programmer是FLEX-N系列用的Windows版程序开发工具...
ArcGIS_server发布Webservice通过Flex编程的详细图解教程
《ACTIONSCRIPT 3.0 编程指南》-----Flex编程必备,值得一看的必备资料
flex+socket编程实例,提供源码参考,请查看
动态实现多文件上传,基于flex技术,可以动态监控上传进度。
分别用ArcGIS Flex API和SuperMap Flex API实现的军标箭头库,有需要源码的可回复邮箱索取。