首 先介绍一下SystemManager.SystemManager是Flex应用的主控者, 它控制着应用窗口, Application实例, 弹出窗口, cursors, 并管理着ApplicationDomain中的类. SystemManager是FlashPlayer实例化的第一个类, 它存储了主应用窗口的大小和位置信息, 保存其子组件比如:浮动弹出窗口和模态窗口的痕迹. 通过SystemManager可以获得内嵌字体,样式和document对象.
自定义的可视化组件(UIComponent的子类)只有在调用过addChild()后, 才会有一个SystemManager赋给他们, 之前是Null. 所以在自定义可视化组件的构造函数中不要使用SystemManager.
通常, Application对象创建时, 发生如下事件:
1. 实例化Application对象
2. 初始化Application.systemManager
3. Application在初始化过程之前, 派发预初始化事件.
4. 调用createChild(). 此时, 所有应用组件被创建, 所有组件的createChild()被调用.
5. Application派发初始化事件, 表明所有的组件初始化完毕.
6. 派发creationComplete事件
7. Application对象添加到显示列表中
8. 派发applicationComplete事件
大 多数情况下, 我们使用<mx:Application>来创建application对象, 但如果使用ActionScript来创建的话, 那么建议不要在application的构造函数中创建组件, 推荐在crateChildren函数中, 主要是从性能方面考虑.
Flash包含的是一个时间线上的多个帧, 而Flex的SWF只包含2个帧. SystemManager, Preloader, DownloadProgressBar和少量工具类都在第一帧, 剩下的包括应用代码/ 内嵌资源全都在第二帧中. 当Flash Player下载下载SWF时, 只要接收到第一帧内足够的数据, 就会实例化SystemManager, 由它来创建Preloader, 然后创建DownloadProgressBar, 这两个对象会察看剩余字节的传输过程. 当第一帧的所有字节传输完毕后, SystemManager发送enterFrame到第二帧, 然后是其他事件. 最后Application对象派发applicationComplete事件.
Flex 是一个事件驱动的编程模型, 任何事情的发生, 其背后必然存在一个事件. 而开发者第一次看到MXML时, 很难体会到一个Xml标记的应用的事件流和实例化的生命周期. 这个对于HTML和Flash的开发者尤其会感到困惑, 因为其熟悉的方式与Flex的一点也不相似. HTML的实例化是从上到下的, Flash的执行是从Frame0开始一帧帧运行的. 而Flex则又有不同.
从我们开始学习Flex时, 我们就需要了解事件流和MXML的实例化. 我非常困惑因为我实在难以理解什么样的事件会被触发或者事件什么时候会被触发. 关键是要理解事件的基础并亲自观察事件流的初始化.
我们来看一个简单的MXML的应用.
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application
xmlns:mx=”http://www.adobe.com/2006/mxml”
layout=”absolute”
backgroundGradientColors=”[#67cbff, #fcffff]”
color=”#000000″
fontSize=”12″
preinitialize=”report( event , ‘preinitialize’ )”
initialize=”report( event , ‘initialize’ )”
creationComplete=”report( event , ‘creationComplete’ )”
applicationComplete=”report( event , ‘applicationComplete’ )”
>
<mx:Script>
<![CDATA[
[Bindable]
public var outTextData:String=”";
public function report( event:Event , value:String ):void
{
outTextData += String( flash.utils.getTimer() ) + ‘ms >> ‘
+ event.currentTarget + ‘.’ + value + ‘\n’;
}
]]>
</mx:Script>
<mx:TextArea
id=”outTextArea”
text=”{ outTextData }”
right=”10″ left=”10″ top=”50″ bottom=”10″ alpha=”0.5″
wordWrap=”false”
initialize=”report( event , ‘initialize’ )”
creationComplete=”report( event , ‘creationComplete’ )”
/>
<mx:Button
y=”10″ height=”30″ left=”168″ width=”150″
id=”HelloButton”
label=”Say Hello”
initialize=”report( event , ‘initialize’ )”
creationComplete=”report( event , ‘creationComplete’ )”
rollOver=”report( event , ‘rollOver’ )”
rollOut=”report( event , ‘rollOut’ )”
click=”report( event , ‘click > Hello!’ )”
/>
<mx:Button
id=”GoodByeButton”
label=”Say Goodbye”
y=”10″ left=”10″ height=”30″ width=”150″ color=”#000000″
initialize=”report( event , ‘initialize’ )”
creationComplete=”report( event , ‘creationComplete’ )”
click=”report( event , ‘click > Goodbye!’ )”
/>
<mx:Button
id=”ClearButton”
label=”Clear”
y=”10″ left=”326″ height=”30″ color=”#000000″ right=”10″
initialize=”report( event , ‘initialize’ )”
creationComplete=”report( event , ‘creationComplete’ )”
click=”outTextData=”;report( event , ‘click’ )”
/>
</mx:Application>
这个应用运行时, 输出了实例流程和事件流. 这校我们就能够看到所有事件的触发顺序. 可以发现应用启动后, 事件的顺序是一定的. 下面是输出的内容:
167ms >> EventFlow0.preinitialize
183ms >> EventFlow0.outTextArea.initialize
187ms >> EventFlow0.HelloButton.initialize
188ms >> EventFlow0.GoodByeButton.initialize
189ms >> EventFlow0.ClearButton.initialize
189ms >> EventFlow0.initialize
243ms >> EventFlow0.outTextArea.creationComplete
243ms >> EventFlow0.HelloButton.creationComplete
243ms >> EventFlow0.GoodByeButton.creationComplete
244ms >> EventFlow0.ClearButton.creationComplete
244ms >> EventFlow0.creationComplete
246ms >> EventFlow0.applicationComplete
一旦applicationComplete事件触发后, 组件就会在鼠标事件派发后触发自己的事件.
注意:在注册js调用的方法时,需要在applicationComplete上面初始化。
相关推荐
NULL 博文链接:https://raymondhekk.iteye.com/blog/371940
Flex启动与初始化Flex启动与初始化Flex启动与初始化
修改枯燥的flex默认的初始化页面。个性的进度条,个性的logo
深入讲解flex启动化调用的类,启动原理
selenium对flex程序的自动化测试.docx
Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex ...
flex 入门介绍 flex 如何结合 j2ee 开发应用程序以及 flex 的国际化等
学习Flex.flex源程序,很好的啊。
sfapi 可以expose flex应用程序的控件,以便测试程序通过执行js方法调用而操作flex界面控件
Flex 代码格式化工具 1. 将jar包放在Flex Builder或者Eclipse的plugins文件夹里(例如:C:\Program Files\Adobe\Flex Builder 3\plugins);...3. 工具栏出现2个新图标,对于一段程序,选中后,点图标,就格式化了。
微信小程序 FlexLayout布局 (源码)微信小程序 FlexLayout布局 (源码)微信小程序 FlexLayout布局 (源码)微信小程序 FlexLayout布局 (源码)微信小程序 FlexLayout布局 (源码)微信小程序 FlexLayout布局 (源码)微信小...
小程序源码 FlexLayout布局 (代码+截图)小程序源码 FlexLayout布局 (代码+截图)小程序源码 FlexLayout布局 (代码+截图)小程序源码 FlexLayout布局 (代码+截图)小程序源码 FlexLayout布局 (代码+截图)小程序源码 Flex...
flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分程序(管理系统)flex打分...
这是一本入门级的Flex电子书,适合入门的朋友看!
Flex程序如何获取html容器传递的URL参数值
介绍 Flex 项目 国际化的 具体方法
flex聊天程序客户端flex聊天程序客户端flex聊天程序客户端
微信小程序,Flex布局示例源代码,包括横向布局,纵向布局,基本涵盖了Flex布局的知识点,有相关的页面布局需求,可以直接拿来使用。
Flex与ActionScript3程序开发》一书由易到难、由浅人深、循序渐进地介绍了Flex与ActionScript3程序开发的一般步骤与常用的程序技巧,内容通俗易懂,使用大量实例贯穿全书,力求以实战的形式让读者快速掌握知识点。...