Flex实践——States Practice
来源:互联网 发布:源码资本待遇 编辑:程序博客网 时间:2024/05/18 21:48
上一次用组合效果完成了一些变化,这一次,来学习一下如何实现当单击一个按钮时改变页面状态(包括布局,内容,颜色等)
引:你可以在Adobe Flex 中使用视图状态和变换来创建更为丰富、更为互动性的用户经历。
举个例子,你可以使用视图状态去创建用户界面,它可以根据用户所执行的任务来改变它的
外观。
视图状态/view states 是你为一个MXML 程序或组件定义的布局命名。你可以为一个程
序或组件定义几种视图状态,并且根据用户的行为在它们之间进行切换。视图状态允许你动
态地改变用户界面,以便来对用户的活动或增加的内容作出响应。
备注:当然,你还可以使用ViewStack 导航容器来实现同样的效果。
变换/transition 是当一个视图状态发生变化时成组播放的几种效果。变换的目的是使视
觉上的变化更为平滑和有趣。
在这次实践中,涉及到两种状态的设计
设计基础状态
在你使用视图状态之前,你必须设计好应用程序或组件的基础状态。所谓的基础状态,就是指程序或定制组件的默认状态。
设计视图状态
范例程序提供了一个满足大多用户需要的,简单的搜索机制。然而,一些用户可能会比
较喜欢更多的搜索选项。你可以使用视图状态来提供这些需求。
开始实践吧,Ready?GO!
首先,创建一个 MXML Application——>ViewStates
然后拖控件,这些控件在这次实践中将会被视为是基础状态的设计
接下来,新建一个state, 选择 Window—>States,在设计模式中,在状态查看(Window > States)上点击新状态/New State 按钮。
完成后,新状态出现在状态查看中。
接下来,在Advanced状态下拖控件,这些控件将会被视为视图状态
视图状态设计完成后,在source下可以看到 state 代码:
注:<mx:state> </mx: states>标签内的内容是设计的视图状态下的结果
调用视图状态(当点击 Advanced Options 按钮时,页面切换到视图状态)
1. 在设计模式中,在状态视图中的列表里选择基础状态。
因为你将为Link 控件定义的事件处理器是基础状态的一部分,所以你需要将MXML
编辑器的焦点变到基础状态上。
当你在这一步选择基础状态时,MXML 编辑器并没有显示那三个CheckBox 控件,因
为它们并不是基础状态的一部分。
2. 选择布局中的LinkButton 控件,在On Click 文本框中输入如下数值:
currentState='Advanced'
点击属性表明,当用户点击LinkButton 控件时,应用程序从当前状态变换成高级查看
状态,它将显示额外那三个check 框。
接下来,当用户第二次点击LinkButton 控件时,隐藏那三个check 框,并恢复到基础
状态。
3. 在状态视图中,选择Advanced state。
4. 在高级查看状态的布局中选择LinkButton 控件,指定点击属性:
currentState=''
在source下可以看到代码:
第一次点击 Advanced Options 时调用视图状态代码:
第二欠点击Advanced Options 时切换到原始状态代码:
运行结果:
基本状态
点击Advanced Options后切换到视图状态
再次点击 Advanced Options 将切换到原始状态
这次的实践完成了,不知道对你有没有帮助呢,呵呵。。。
- Flex实践——States Practice
- Flex实践——Parallel Practice
- Flex 中的States(状态)
- Flex实践——Flex+Jsp+EJB
- FLEX practice
- FLEX实践—自创相册
- flex学习----states和transitions
- Caffe —— Deep learning in Practice 深度学习实践
- FLEX实践—在FLEX中调用WebService
- FLEX AIR实践—FLEX AIR XML Encode Bug
- Flex实践——Personal Card制作
- Flex实践——XML文件读取
- Flex实践——XML文件读取
- Flex实践—So beautiful webpage.....
- Flex实践—ActionScript函数功能
- Flex实践—Simple Copy Panel
- FLEX实践—加载XML文件错误
- FLEX实践—获取当前窗口大小
- JSPServletJSF--谈JSP与XML的交互
- vb的RSA公钥和私钥
- 动态sql语句基本语法
- html:hidden的使用
- TRIE树
- Flex实践——States Practice
- Oracle关于时间/日期的操作
- 在 Fedora 5 Linux 下实现了一个基于 libmad 的 MP3 流媒体播放器
- 你的领导风格和哪种动物最像?
- 如何系统的学习linux 系统学习Linux的十一点建议
- IBM和联想无法安装Oracle问题
- Jena Tutorial(一)
- 如何交叉编译应用程序,技巧,注意事项
- 如何使用Lightbox效果