- 浏览: 84741 次
- 性别:
- 来自: 龙城
最新评论
-
Fis:
阿呆jinsss 写道 楼主说的简单易懂,最适合我这些理解能力 ...
[原创]AS3.0的自定义事件 -
阿呆jinsss:
楼主说的简单易懂,最适合我这些理解能力差点的人,谢谢了~
[原创]AS3.0的自定义事件 -
Fis:
mengxiaolongcz 写道外层循环 i<arr. ...
去除数组中相同的元素 -
Fis:
mengxiaolongcz 写道外层循环 i<arr. ...
去除数组中相同的元素 -
mengxiaolongcz:
外层循环 i<arr.length-1
里层循环 var ...
去除数组中相同的元素
preloader->systemManager->FlexApplication started…
然后才是:
preinitialize
在所有的初始化之前触发,没有子组件的定义,但是可以引用组件的变量.
initialize
当所有子组件生成完成后触发,在这个时间点还没有组件被渲染出来.
creationComplete
组件定义完成并已经在显示列表.
applicationComplete
所有的组件初始化完成并显示.
大家都知道,我们在编写Flex应用程序时,通常是以<mx:Application>标签作为开头,实际上,Flex应用程序在启动运行的时候并不是直接从Application开始运行,在这之前还有一部分悄悄的先运行了,正如大家所看到的,当我们运行编写好的Flex应用程序时,尽管我们没有编写任何与启动进度载入条相关的代码,但无一例外的,应用程序均会为我们自动加上这一部分。因此才有我们看到的标准的Flex loading载入条。
通常我们所说的Flex应用程序,本质上来说是基于Flex框架、采用ActionScript 3.0编写的Flash应用程序,从这一点来说,它和普通的Flash应用程序没有任何差别。相对来说,传统的使用Flash IDE(如Flash CS3)创建Flash程序时更多的基于“时间线”(Timeline)及“帧”(Frame)的概念,更易于设计师理解;而基于Flex框架来创建的 Flash应用程序更多是强调程序性,很少提及“时间线”与“帧”的概念,更易于程序员理解。其实Flex应用程序一样也有时间线,只是这部分由Flex 框架隐藏起来了,通常不为大家所熟悉,在默认创建Flex程序时,这一切Flex已帮我们完成了,但了解这部分内容更有助于大家对Flex应用程序的启动有更深刻的认识,以便能对程序更灵活的控制与发挥~~
我们来看看上面这幅示意图,Flex应用程序共由两帧组成,第1帧为preloader部分,第2帧为主应用程序部分,此两部分由Flex应用程序的根 SystemManager统管,SystemManager是flash.display.MovieClip的子类,影片剪辑(movie clip)支持帧。由于swf属于一种渐进式(progressive)下载的格式,正是由于swf格式这个特性,Flash Player并不需要等待整个程序下载完成便可直接访问已载入帧的内容,因此第一帧通常用来作为应用程序载入时的loading画面显示,一般来说,第一帧包含的内容应该尽可能的少(在第一帧中尽量不要含有Flex框架的组件),以便能很快的下载并立即显示;第二帧才是主应用程序真正的内容,一旦 SystemManager实例进入到第二帧后,即开始内部主应用程序运行的生命周期(life cycle),也就是进入我们最为熟悉的<mx:Application>运行的部分(SystemManger实例有一 application的属性,在第1帧时,此属性为null,当进入到第2帧时,该属性才指向真正的主程序application实例)记住我们开始所说的,Flex应用程序总的来说是以事件驱动的程序。
在程序进入第2帧,主程序application开始运行后,便会相应的触发相应的一系列事件,按事件发生的先后顺序依次来介绍:
preinitialize
应用程序application已实例化,但此时还未创建任何相关的孩子组件(child component)
initialize
此时,创建了相应的孩子组件,但还未对这些子组件进行布局
creationComplete
应用程序application完成全部实例化,并完成所有子组件的布局
apllicationComplete
上面三处事件的完成,表明application内部启动的整个进程完成,接下来便会通知SystemManager派发applicationComplete事件。此时,启动程序启动完成并准备运行。
Flash包含的是一个时间线上的多个帧, 而Flex的SWF只包含2个帧. SystemManager, Preloader, DownloadProgressBar和少量工具类都在第一帧, 剩下的包括应用代码/ 内嵌资源全都在第二帧中. 当Flash Player下载下载SWF时, 只要接收到第一帧内足够的数据, 就会实例化SystemManager, 由它来创建Preloader, 然后创建DownloadProgressBar, 这两个对象会察看剩余字节的传输过程. 当第一帧的所有字节传输完毕后, SystemManager发送enterFrame到第二帧, 然后是其他事件. 最后Application对象派发applicationComplete事件.
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函数中, 主要是从性能方面考虑.
Flex 是一个事件驱动的编程模型, 任何事情的发生, 其背后必然存在一个事件. 而开发者第一次看到MXML时, 很难体会到一个Xml标记的应用的事件流和实例化的生命周期. 这个对于HTML和Flash的开发者尤其会感到困惑, 因为其熟悉的方式与Flex的一点也不相似. HTML的实例化是从上到下的, Flash的执行是从Frame0开始一帧帧运行的. 而Flex则又有不同.
我们来看一个简单的MXML的应用.
1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application
3. xmlns:mx="http://www.adobe.com/2006/mxml"
4. layout="absolute"
5. backgroundGradientColors="[#67cbff, #fcffff]"
6. color="#000000"
7. fontSize="12"
8. preinitialize="report( event , 'preinitialize' )"
9. initialize="report( event , 'initialize' )"
10. creationComplete="report( event , 'creationComplete' )"
11. applicationComplete="report( event , 'applicationComplete' )"
12. >
13.
14. <mx:Script>
15. <![CDATA[
16.
17. [Bindable]
18.
19. public var outTextData:String="";
20.
21. public function report( event:Event , value:String ):void
22. {
23. outTextData += String( flash.utils.getTimer() ) + 'ms >> '
24. + event.currentTarget + '.' + value + '\n';
25. }
26.
27. ]]>
28. </mx:Script>
29.
30. <mx:TextArea
31. id="outTextArea"
32. text="{ outTextData }"
33. right="10" left="10" top="50" bottom="10" alpha="0.5"
34. wordWrap="false"
35. initialize="report( event , 'initialize' )"
36. creationComplete="report( event , 'creationComplete' )"
37. />
38.
39. <mx:Button
40. y="10" height="30" left="168" width="150"
41. id="HelloButton"
42. label="Say Hello"
43. initialize="report( event , 'initialize' )"
44. creationComplete="report( event , 'creationComplete' )"
45. rollOver="report( event , 'rollOver' )"
46. rollOut="report( event , 'rollOut' )"
47. click="report( event , 'click > Hello!' )"
48. />
49.
50. <mx:Button
51. id="GoodByeButton"
52. label="Say Goodbye"
53. y="10" left="10" height="30" width="150" color="#000000"
54. initialize="report( event , 'initialize' )"
55. creationComplete="report( event , 'creationComplete' )"
56. click="report( event , 'click > Goodbye!' )"
57. />
58.
59. <mx:Button
60. id="ClearButton"
61. label="Clear"
62. y="10" left="326" height="30" color="#000000" right="10"
63. initialize="report( event , 'initialize' )"
64. creationComplete="report( event , 'creationComplete' )"
65. click="outTextData='';report( event , 'click' )"
66. />
67.
68. </mx:Application>
这个应用运行时, 输出了实例流程和事件流. 这校我们就能够看到所有事件的触发顺序. 可以发现应用启动后, 事件的顺序是一定的. 下面是输出的内容:
1. 167ms >> EventFlow0.preinitialize
2. 183ms >> EventFlow0.outTextArea.initialize
3. 187ms >> EventFlow0.HelloButton.initialize
4. 188ms >> EventFlow0.GoodByeButton.initialize
5. 189ms >> EventFlow0.ClearButton.initialize
6. 189ms >> EventFlow0.initialize
7. 243ms >> EventFlow0.outTextArea.creationComplete
8. 243ms >> EventFlow0.HelloButton.creationComplete
9. 243ms >> EventFlow0.GoodByeButton.creationComplete
10. 244ms >> EventFlow0.ClearButton.creationComplete
11. 244ms >> EventFlow0.creationComplete
12. 246ms >> EventFlow0.applicationComplete
13. 一旦applicationComplete事件触发后, 组件就会在鼠标事件派发后触发自己的事件.
14. 1807ms >> EventFlow0.HelloButton.rollOver
15. 2596ms >> EventFlow0.HelloButton.rollOut
16. 2954ms >> EventFlow0.HelloButton.rollOver
17. 3170ms >> EventFlow0.HelloButton.rollOut
18. 3543ms >> EventFlow0.HelloButton.rollOver
19. 4052ms >> EventFlow0.HelloButton.click > Hello!
20. 4267ms >> EventFlow0.HelloButton.click > Hello!
21. 4474ms >> EventFlow0.HelloButton.click > Hello!
22. 4569ms >> EventFlow0.HelloButton.rollOut
23. 4907ms >> EventFlow0.GoodByeButton.click > Goodbye!
24. 5130ms >> EventFlow0.GoodByeButton.click > Goodbye!
然后才是:
preinitialize
在所有的初始化之前触发,没有子组件的定义,但是可以引用组件的变量.
initialize
当所有子组件生成完成后触发,在这个时间点还没有组件被渲染出来.
creationComplete
组件定义完成并已经在显示列表.
applicationComplete
所有的组件初始化完成并显示.
大家都知道,我们在编写Flex应用程序时,通常是以<mx:Application>标签作为开头,实际上,Flex应用程序在启动运行的时候并不是直接从Application开始运行,在这之前还有一部分悄悄的先运行了,正如大家所看到的,当我们运行编写好的Flex应用程序时,尽管我们没有编写任何与启动进度载入条相关的代码,但无一例外的,应用程序均会为我们自动加上这一部分。因此才有我们看到的标准的Flex loading载入条。
通常我们所说的Flex应用程序,本质上来说是基于Flex框架、采用ActionScript 3.0编写的Flash应用程序,从这一点来说,它和普通的Flash应用程序没有任何差别。相对来说,传统的使用Flash IDE(如Flash CS3)创建Flash程序时更多的基于“时间线”(Timeline)及“帧”(Frame)的概念,更易于设计师理解;而基于Flex框架来创建的 Flash应用程序更多是强调程序性,很少提及“时间线”与“帧”的概念,更易于程序员理解。其实Flex应用程序一样也有时间线,只是这部分由Flex 框架隐藏起来了,通常不为大家所熟悉,在默认创建Flex程序时,这一切Flex已帮我们完成了,但了解这部分内容更有助于大家对Flex应用程序的启动有更深刻的认识,以便能对程序更灵活的控制与发挥~~
我们来看看上面这幅示意图,Flex应用程序共由两帧组成,第1帧为preloader部分,第2帧为主应用程序部分,此两部分由Flex应用程序的根 SystemManager统管,SystemManager是flash.display.MovieClip的子类,影片剪辑(movie clip)支持帧。由于swf属于一种渐进式(progressive)下载的格式,正是由于swf格式这个特性,Flash Player并不需要等待整个程序下载完成便可直接访问已载入帧的内容,因此第一帧通常用来作为应用程序载入时的loading画面显示,一般来说,第一帧包含的内容应该尽可能的少(在第一帧中尽量不要含有Flex框架的组件),以便能很快的下载并立即显示;第二帧才是主应用程序真正的内容,一旦 SystemManager实例进入到第二帧后,即开始内部主应用程序运行的生命周期(life cycle),也就是进入我们最为熟悉的<mx:Application>运行的部分(SystemManger实例有一 application的属性,在第1帧时,此属性为null,当进入到第2帧时,该属性才指向真正的主程序application实例)记住我们开始所说的,Flex应用程序总的来说是以事件驱动的程序。
在程序进入第2帧,主程序application开始运行后,便会相应的触发相应的一系列事件,按事件发生的先后顺序依次来介绍:
preinitialize
应用程序application已实例化,但此时还未创建任何相关的孩子组件(child component)
initialize
此时,创建了相应的孩子组件,但还未对这些子组件进行布局
creationComplete
应用程序application完成全部实例化,并完成所有子组件的布局
apllicationComplete
上面三处事件的完成,表明application内部启动的整个进程完成,接下来便会通知SystemManager派发applicationComplete事件。此时,启动程序启动完成并准备运行。
Flash包含的是一个时间线上的多个帧, 而Flex的SWF只包含2个帧. SystemManager, Preloader, DownloadProgressBar和少量工具类都在第一帧, 剩下的包括应用代码/ 内嵌资源全都在第二帧中. 当Flash Player下载下载SWF时, 只要接收到第一帧内足够的数据, 就会实例化SystemManager, 由它来创建Preloader, 然后创建DownloadProgressBar, 这两个对象会察看剩余字节的传输过程. 当第一帧的所有字节传输完毕后, SystemManager发送enterFrame到第二帧, 然后是其他事件. 最后Application对象派发applicationComplete事件.
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函数中, 主要是从性能方面考虑.
Flex 是一个事件驱动的编程模型, 任何事情的发生, 其背后必然存在一个事件. 而开发者第一次看到MXML时, 很难体会到一个Xml标记的应用的事件流和实例化的生命周期. 这个对于HTML和Flash的开发者尤其会感到困惑, 因为其熟悉的方式与Flex的一点也不相似. HTML的实例化是从上到下的, Flash的执行是从Frame0开始一帧帧运行的. 而Flex则又有不同.
我们来看一个简单的MXML的应用.
1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application
3. xmlns:mx="http://www.adobe.com/2006/mxml"
4. layout="absolute"
5. backgroundGradientColors="[#67cbff, #fcffff]"
6. color="#000000"
7. fontSize="12"
8. preinitialize="report( event , 'preinitialize' )"
9. initialize="report( event , 'initialize' )"
10. creationComplete="report( event , 'creationComplete' )"
11. applicationComplete="report( event , 'applicationComplete' )"
12. >
13.
14. <mx:Script>
15. <![CDATA[
16.
17. [Bindable]
18.
19. public var outTextData:String="";
20.
21. public function report( event:Event , value:String ):void
22. {
23. outTextData += String( flash.utils.getTimer() ) + 'ms >> '
24. + event.currentTarget + '.' + value + '\n';
25. }
26.
27. ]]>
28. </mx:Script>
29.
30. <mx:TextArea
31. id="outTextArea"
32. text="{ outTextData }"
33. right="10" left="10" top="50" bottom="10" alpha="0.5"
34. wordWrap="false"
35. initialize="report( event , 'initialize' )"
36. creationComplete="report( event , 'creationComplete' )"
37. />
38.
39. <mx:Button
40. y="10" height="30" left="168" width="150"
41. id="HelloButton"
42. label="Say Hello"
43. initialize="report( event , 'initialize' )"
44. creationComplete="report( event , 'creationComplete' )"
45. rollOver="report( event , 'rollOver' )"
46. rollOut="report( event , 'rollOut' )"
47. click="report( event , 'click > Hello!' )"
48. />
49.
50. <mx:Button
51. id="GoodByeButton"
52. label="Say Goodbye"
53. y="10" left="10" height="30" width="150" color="#000000"
54. initialize="report( event , 'initialize' )"
55. creationComplete="report( event , 'creationComplete' )"
56. click="report( event , 'click > Goodbye!' )"
57. />
58.
59. <mx:Button
60. id="ClearButton"
61. label="Clear"
62. y="10" left="326" height="30" color="#000000" right="10"
63. initialize="report( event , 'initialize' )"
64. creationComplete="report( event , 'creationComplete' )"
65. click="outTextData='';report( event , 'click' )"
66. />
67.
68. </mx:Application>
这个应用运行时, 输出了实例流程和事件流. 这校我们就能够看到所有事件的触发顺序. 可以发现应用启动后, 事件的顺序是一定的. 下面是输出的内容:
1. 167ms >> EventFlow0.preinitialize
2. 183ms >> EventFlow0.outTextArea.initialize
3. 187ms >> EventFlow0.HelloButton.initialize
4. 188ms >> EventFlow0.GoodByeButton.initialize
5. 189ms >> EventFlow0.ClearButton.initialize
6. 189ms >> EventFlow0.initialize
7. 243ms >> EventFlow0.outTextArea.creationComplete
8. 243ms >> EventFlow0.HelloButton.creationComplete
9. 243ms >> EventFlow0.GoodByeButton.creationComplete
10. 244ms >> EventFlow0.ClearButton.creationComplete
11. 244ms >> EventFlow0.creationComplete
12. 246ms >> EventFlow0.applicationComplete
13. 一旦applicationComplete事件触发后, 组件就会在鼠标事件派发后触发自己的事件.
14. 1807ms >> EventFlow0.HelloButton.rollOver
15. 2596ms >> EventFlow0.HelloButton.rollOut
16. 2954ms >> EventFlow0.HelloButton.rollOver
17. 3170ms >> EventFlow0.HelloButton.rollOut
18. 3543ms >> EventFlow0.HelloButton.rollOver
19. 4052ms >> EventFlow0.HelloButton.click > Hello!
20. 4267ms >> EventFlow0.HelloButton.click > Hello!
21. 4474ms >> EventFlow0.HelloButton.click > Hello!
22. 4569ms >> EventFlow0.HelloButton.rollOut
23. 4907ms >> EventFlow0.GoodByeButton.click > Goodbye!
24. 5130ms >> EventFlow0.GoodByeButton.click > Goodbye!
发表评论
-
LayaBox flash 转换项目心得
2015-08-28 13:50 4384一、熟悉从as3项目转到js的API和特性差异 1、Simpl ... -
Starling中AssetManager加载文件的流程整理
2015-06-16 20:15 1328Starling做移动开发,会用到大量的纹理和图片素材、X ... -
LayaBox flash 转换项目心得
2015-08-28 13:46 0一、熟悉从as3项目转到j ... -
air遍历目录里的文件
2015-02-12 15:52 883air开发移动应用时,用于遍历一个目录里的所有文件: var ... -
MovieClip 帧里面子对象为null 问题的解决
2014-10-11 17:19 779原因是进入其中一帧后,MovieClip对象不会立刻被创建出来 ... -
as3打包手机引用
2013-10-18 17:48 7221、新建手机项目 去掉其他平台选项 创建项目。 ... -
as3 ANE的打包小结
2013-10-18 15:15 2653工作关系要用到as3手游ANE的打包,之前因为用不到,也没 ... -
SWFLoader不响应Event.COMPLETE事件
2012-06-25 16:16 1172工作中遇到了一个问题,flex控件SWFLoader解决了 ... -
PHP中的生成XML文件的4种方法
2012-05-02 14:07 982原文:http://www.oschina.net/code/ ... -
AS3 位运算
2012-04-17 13:04 871原文转至http://www.tangpei.net/2011 ... -
支持参数的事件处理函数
2012-04-11 14:44 3通常情况下,我们使用事件机制时,编写的事件处理函数只需要一 ... -
关于as3运动效果的总结
2012-03-22 18:18 998看了《ActionScript3.0高级动画教程》一书,用 ... -
ActionScript3高级动画教程笔记
2012-03-14 17:09 7572012.3.14 基本三角函数的计算: 角的正弦值 = ... -
移除匿名函数定义的事件处理函数
2012-01-17 14:12 2720如果一个监听事件是匿名函数,那当要移除的时候就会有困扰,既 ... -
传参之事件代理
2012-01-17 14:04 667通常情况下,我们使用事件机制时,编写的事件处理函数只需要一 ... -
换页显示代码
2011-12-20 15:55 840var maxPage:int = Math.ceil(t ... -
全数段取值显示
2011-12-16 22:19 705这个叫法是自己取的,工作中用到了,这里记录一下。 p ... -
as3开发社交游戏的一些总结
2011-07-13 17:57 1191加入社交游戏开发 ... -
抛物线运动公式总结
2011-05-24 20:53 8057竖直上抛运动: 初始化 t = 0; a = ... -
as3编写3D原理(笔记)
2011-05-13 17:44 11011、基本原理:三角形相似原理 d/(d+z) = x1/x ...
相关推荐
NULL 博文链接:https://raymondhekk.iteye.com/blog/371940
Flex启动与初始化Flex启动与初始化Flex启动与初始化
修改枯燥的flex默认的初始化页面。个性的进度条,个性的logo
深入讲解flex启动化调用的类,启动原理
Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex 代码格式化Flex ...
Flex Application Performance: Tips and Techniques for Improving Client Application and Server Performance November 2004 Brandon Purcell Deepa Subramanian
flex 入门介绍 flex 如何结合 j2ee 开发应用程序以及 flex 的国际化等
Flex动态CSS,设定整个application的CSS样式
Flex Application Flex Application Flex Application
Flex 代码格式化工具 1. 将jar包放在Flex Builder或者Eclipse的plugins文件夹里(例如:C:\Program Files\Adobe\Flex Builder 3\plugins); 2. 重启Flex Builder或Eclipse,必要时使用-clean参数重启; 3. 工具栏...
Parsley的一个Demo 比pureMVC更适合用在Flex 也可以在java blazeDS 中运行 http://coenraets.org/blog/2009/07/building-a-flex-application-with-the-parsley-framework/
介绍 Flex 项目 国际化的 具体方法
Flex自定义组件,带最大化、最小化、还原及关闭按钮。
由于flex builder3自身不能格式化代码,本插件就是实现这个功能,方便代码整理
flex 代码格式化包 flex 代码格式化包flex 代码格式化包flex 代码格式化包
实现flex4窗体最大化 最小话 和关闭功能
flex两种右键菜单,RightClickManager修改后在非Application下也可以弹出来。
深入浅出Flex_Viewer.pdf