在Flex 程序中,引入了状态设计的概念。在一个程序中,按照功能的需求,将界面切分成相对独立的部分。运行过程中,随着用户交互,界面在各个部分之间切换。比如在购物车程序中,登录界面、选购商品界面、购物车界面、付款界面,这些部分代表着不同的功能,显示当前程序的运行状态,每个界面便是一个状态(Status)。       在State对象中可以使用以下的方法:

setProperty:设置对象的属性

setStyle:设置对象的样式

setEventHandler:设置对象某一事件的监听方法

removeChild:删除一个子级元素

transition:设置状态的过渡动画效果

addChild:向对象添加一个子级元素 <?xml version="1.0" encoding="utf-8"?> <mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300">     <mx:Script>         <![CDATA[             import mx.events.CloseEvent;             import mx.controls.Alert;             private function clickHandler(event:Event):void{                 Alert.show("Do you want to save your changes?","Save Changes",3,this,alertClickHandler);             }             private function alertClickHandler(event:CloseEvent):void{                 if(event.detail==Alert.YES){                     label1.text="Please Login!";                     currentState="";                 }else{                     currentState='Register';                 }             }         ]]>     </mx:Script>         <mx:states>         <mx:State name="Register">             <mx:AddChild relativeTo="{loginForm}" position="lastChild">//addChild:向对象添加一个子级元素 lastChild表示在最后位置添加                 <mx:target>                     <mx:FormItem id="confirm" label="Confirm:">                         <mx:TextInput/>                     </mx:FormItem>                 </mx:target>             </mx:AddChild>             <mx:AddChild relativeTo="{loginForm}" position="lastChild">                 <mx:target>                     <mx:FormItem id="email" label="Email:">                         <mx:TextInput id="emailId"/>                     </mx:FormItem>                 </mx:target>             </mx:AddChild>             <mx:SetProperty target="{loginPanel}" name="title" value="Register"/>//设置id为loginPanel的Panel对象的title属性的值为Register             <mx:SetProperty target="{loginButton}" name="label" value="Register"/>             <mx:SetEventHandler target="{loginButton}" name="click" handlerFunction="clickHandler"/>//设置对象某一事件的监听方法             <mx:SetStyle target="{loginButton}" name="color" value="blue"/>//设置对象的样式             <mx:RemoveChild target="{registerLink}"/>删除一个子级元素             <mx:AddChild relativeTo="{spacer1}" position="before">//添加子元素在space1前面                 <mx:target>                     <mx:LinkButton id="loginLink" label="Return to login" click="currentState=''"/>                 </mx:target>             </mx:AddChild>         </mx:State>     </mx:states>     <mx:Panel title="Login" id="loginPanel" horizontalScrollPolicy="off" verticalScrollPolicy="off" paddingTop="10" paddingBottom="10"          paddingLeft="10" paddingRight="10">         <mx:Text width="100%" color="blue" id="label1" text="Click the 'Need to Register?'"/>         <mx:Form id="loginForm">             <mx:FormItem label="Username:">                 <mx:TextInput/>             </mx:FormItem>             <mx:FormItem label="Password:">                 <mx:TextInput/>             </mx:FormItem>         </mx:Form>         <mx:ControlBar>             <mx:LinkButton id="registerLink" label="Need to Register?" click="currentState='Register'"/>             <mx:Spacer width="100%" id="spacer1"/>             <mx:Button label="Login" id="loginButton"/>         </mx:ControlBar>     </mx:Panel>  </mx:Module>

Flex State相关推荐

  1. html左右超出显示滚动条,div内容宽度超出边界后怎样设置为左右滑动,而且不显示滚动条?...

    div内容宽度超出边界后怎样设置为左右滑动,而且不显示滚动条? 纯手写 滚动条隐藏掉就行了 CSS: *{ margin:0px;padding:0px; } .wrap{ overflow: hid ...

  2. Flex实现页面多态--state对象

    在Flex 程序中,引入了状态设计的概念.在一个程序中,按照功能的需求,将界面切分成相对独立的部分.运行过程中,随着用户交互,界面在各个部分之间切换.比如在购物车程序中,登录界面.选购商品界面.购物车 ...

  3. 积少成多 Flash(ActionScript 3.0 Flex 3.0) 系列文章索引

    [源码下载] 积少成多 Flash(ActionScript 3.0 & Flex 3.0) 系列文章索引 作者:webabcd Flash 之 ActionScript 3.0  1.积少成 ...

  4. 推荐60+ Flex开发参考网站

    推荐60+ Flex开发参考网站 下面是一些好的Flex开发的网站或者Flex资源,如果你使用Flex开发,可以参考一下. 网上找的,可以参考参考!呵呵 新手入门参考: Adobe Flex 3 - ...

  5. 了解一下Flex 4里的fx、mx以及s命名空间

    2019独角兽企业重金招聘Python工程师标准>>> Flex 4带给我们的,是全新的命名空间.了解这些命名空间必定是一件好事情.Flex 4有三个非常重要的命名空间,分别是: x ...

  6. Flex/Silverlight的技术比较转

    基于个人的使用经验,我从语言.框架.开发环境和运行环境四个方面对Flex和Silverlight这两门技术做一个比较,自己认为这个比较还是比较全面的.(这样的比较有意义吗?个人意见,只要别把自己当成宗 ...

  7. 【错误记录】编译 Linux 内核报错 ( /bin/sh: 1: flex: not found )

    文章目录 一.报错信息 二.解决方案 一.报错信息 编译 Linux 内核 , 执行 make menuconfig 配置菜单命令 , 报如下错误 : root@ubuntu:~/kernel/lin ...

  8. Flex/Silverlight的技术比较

    Flex/Silverlight的技术比较 别人博客上看见的,一文下去,引起口水大战,其实仁者见仁,智者见智,每种语言都不可能是完善的,扬长避短才是王道. 基于个人的使用经验,我从语言.框架.开发环境 ...

  9. arcgis api for flex 开发入门(五)查询

    在gis中,针对要素的查询是一个最基本的操作,也是最常用的操作之一. 下面我们介绍如何使用arcgis api for flex 来查询我们需要的东西. 要在arcgis api for flex中进 ...

最新文章

  1. Svg.Js A标签,链接操作
  2. MySQL B+树索引和哈希索引的区别
  3. 加密_easy_crypto
  4. 【GOTC 预告】王思宇:从 OpenKruise 看云原生应用负载发展趋势
  5. ArcObject开发,“异常在 ESRI.ArcGIS.Version.dll”错误
  6. 安全开发 | 如何让Django框架中的CSRF_Token的值每次请求都不一样
  7. FreeSql (十八)导航属性
  8. 前端工程师都会喜欢的5个JavaScript库
  9. 直播丨2020数据技术嘉年华·金融峰会暨数据库大咖讲坛(第4期)
  10. 用C语言实现字符串的右旋
  11. 几款开源聊天软件对比
  12. 怎么p出模糊的照片_照片模糊了怎么办 如何利用美图秀秀变清晰
  13. HZOI20190819模拟26题解
  14. 数据只有被交换共享,才能创造价值 | 推荐收藏
  15. 牛客网暑期ACM多校训练营(第二场)G.transform (二分+思维)
  16. 安装Oracle 11g数据库服务器类
  17. Docker 部署在线文件转换服务--Libre Office Online
  18. VPC对等连接(VPC Peering)
  19. python中的%s%是什么意思
  20. golang https服务

热门文章

  1. 经典C语言程序100例之三七
  2. linux组群账户存放在,linux用户和群组
  3. 「Docker」Docker教程+学习笔记
  4. spark sql基本使用方法介绍(转载)
  5. CSS中让一个div的高度随着另外个一个统计的div的高度变化而变化的代码
  6. websocket 连接本地端口_聊聊 WebSocket,还有 HTTP
  7. 路由器网口1一直闪烁正常吗_电信光猫上的网口1一直在闪 网络一直都在闪断
  8. div 不受父级标签影响_前端H5开发中常用的标签
  9. 怎么调整字段长短_木北造型:空气刘海卷发筒怎么用 木北造型告诉您
  10. Pytorch模型(.pth)转onnx模型(.onnx)