关于Flex 初始化的research

更新时间：2009年09月28日 18:01:46 作者：

前些天在写一个自定义的UI组件的时候，发现在override createChildren的,只能取到基本类型的自定义变量，而取不到Object类型的自定义变量。

后来研究发现，不是取不到，而是在createChildren的时候，自定义的objcet还没有被赋值，只有当该组件的init事件之后才会被赋值，代码如下：
APP:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" xmlns:com="com.*"> 
    <mx:Script> 
        <!--[CDATA[ 
            [Bindable] 
            private var o:Object = {}; 
        ]]--> 
    </mx:Script> 
    <com:CustomPanel width="100%" height="100%" label="FlexInitResearch"> 
        <com:CustomButton label="Button" 
            customString="customString test" customObject="{o}"/> 
    </com:CustomPanel> 
</mx:Application> 

CustomPanel：

复制代码代码如下:

package com 
{ 
    import mx.containers.Panel; 
    import mx.events.FlexEvent; 

    public class CustomPanel extends Panel 
    { 
        public function CustomPanel() 
        { 
            super(); 
            this.addEventListener(FlexEvent.PREINITIALIZE,             onPreInit); 
            this.addEventListener(FlexEvent.INITIALIZE,             onInit); 
            this.addEventListener(FlexEvent.CREATION_COMPLETE,         onCreationComplete); 
            this.addEventListener(FlexEvent.APPLICATION_COMPLETE,     onAppInitComplete); 
        } 

        //================================= 
        // event handler 
        //================================= 

        private function onPreInit(event:FlexEvent):void 
        { 
            trace("CustomPanel[ PreInit ]"); 
        } 

        private function onInit(event:FlexEvent):void 
        { 
            trace("CustomPanel[ Init ]"); 
        } 

        private function onCreationComplete(event:FlexEvent):void 
        { 
            trace("CustomPanel[ CreationComplete ]"); 
        } 

        private function onAppInitComplete(event:FlexEvent):void 
        { 
            trace("CustomPanel[ AppInitComplete ]"); 
        } 

        //================================= 
        // override function 
        //================================= 

        override protected function createChildren():void 
        { 
            trace("CustomPanel[ Begin to createChildren ]"); 
            super.createChildren(); 
            trace("CustomPanel[ The end of createChildren ]"); 
        } 

        override protected function measure():void 
        { 
            trace("CustomPanel[ Begin to measure ]"); 
            super.measure(); 
            trace("CustomPanel[ The end of measure ]"); 
        } 

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
        { 
            trace("CustomPanel[ Begin to updateDisplayList ]"); 
            super.updateDisplayList(unscaledWidth, unscaledHeight); 
            trace("CustomPanel[ The end of updateDisplayList ]"); 
        } 

        override protected function layoutChrome(unscaledWidth:Number, unscaledHeight:Number):void 
        { 
            trace("CustomPanel[ Begin to layoutChrome ]"); 
            super.layoutChrome(unscaledWidth, unscaledHeight); 
            trace("CustomPanel[ The end of layoutChrome ]"); 
        } 

        override protected function commitProperties():void 
        { 
            trace("CustomButton[ Begin to commitProperties ]"); 
            super.commitProperties(); 
            trace("CustomButton[ The end of commitProperties ]"); 
        } 
    } 
}

CustomButton：

复制代码代码如下:

package com 
{ 
    import mx.controls.Button; 
    import mx.events.FlexEvent; 

    public class CustomButton extends Button 
    { 
        //================================= 
        // properties 
        //================================= 
        private var _customString:String     = ""; 
        private var _customObject:Object     = null; 

        public function get customString():String 
        { 
            return _customString; 
        } 
        //string 
        public function set customString(value:String):void 
        { 
            trace("CustomButton( set customString )"); 
            _customString = value; 
        } 

        //object 
        public function get customObject():Object 
        { 
            return _customObject; 
        } 

        public function set customObject(value:Object):void 
        { 
            trace("CustomButton( set customObject )"); 
            _customObject = value; 
        } 

        //================================= 
        // Constructor 
        //================================= 

        public function CustomButton() 
        { 
            trace("CustomButton( Begin to Constructor )"); 
            super(); 
            this.addEventListener(FlexEvent.PREINITIALIZE,             onPreInit); 
            this.addEventListener(FlexEvent.INITIALIZE,             onInit); 
            this.addEventListener(FlexEvent.CREATION_COMPLETE,         onCreationComplete); 
            this.addEventListener(FlexEvent.APPLICATION_COMPLETE,     onAppInitComplete); 
            trace("CustomButton( The end of Constructor )"); 
        } 

        //================================= 
        // event handler 
        //================================= 

        private function onPreInit(event:FlexEvent):void 
        { 
            trace("CustomButton( PreInit )"); 
        } 

        private function onInit(event:FlexEvent):void 
        { 
            trace("CustomButton( Init )"); 
        } 

        private function onCreationComplete(event:FlexEvent):void 
        { 
            trace("CustomButton( Creation Complete )"); 
        } 

        private function onAppInitComplete(event:FlexEvent):void 
        { 
            trace("CustomButton( AppInitComplete )"); 
        } 

        //================================= 
        // override function 
        //================================= 

        override protected function createChildren():void 
        { 
            trace("CustomButton( Begin to createChildren )"); 
            super.createChildren(); 
            trace("CustomButton( The end of createChildren )"); 
        } 

        override protected function measure():void 
        { 
            trace("CustomButton( Begin to measure )"); 
            super.measure(); 
            trace("CustomButton( The end of measure )"); 
        } 

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
        { 
            trace("CustomButton( Begin to updateDisplayList )"); 
            super.updateDisplayList(unscaledWidth, unscaledHeight); 
            trace("CustomButton( The end of updateDisplayList )"); 
        } 

        override protected function commitProperties():void 
        { 
            trace("CustomButton( Begin to commitProperties )"); 
            super.commitProperties(); 
            trace("CustomButton( The end of commitProperties )"); 
        } 
    } 
}

最后运行的结果是：
CustomPanel[ PreInit ]
CustomPanel[ Begin to createChildren ]
CustomButton( Begin to Constructor )
CustomButton( The end of Constructor )
CustomButton( set customString ) //基本变量（String，Number（int，uint），Boolean）在PreInit 之前就被赋值
CustomButton( PreInit )
CustomButton( Begin to createChildren )
CustomButton( The end of createChildren )
CustomButton( Init )
CustomButton( set customObject ) //自定义对象变量在 Init之后才能被赋值，所以在createChildren中取不到
CustomPanel[ Init ] //有子控件的时候，Init 事件是在createChildren中发出的
CustomPanel[ The end of createChildren ]
CustomButton( set customObject )
CustomButton[ Begin to commitProperties ]
CustomButton[ The end of commitProperties ]
CustomButton( Begin to commitProperties )
CustomButton( The end of commitProperties )
CustomButton( Begin to measure )
CustomButton( The end of measure )
CustomPanel[ Begin to measure ]
CustomPanel[ The end of measure ]
CustomPanel[ Begin to updateDisplayList ]
CustomPanel[ Begin to layoutChrome ]
CustomPanel[ The end of layoutChrome ] //证明layoutChrome是在updateDisplayList 中被调用的
CustomPanel[ The end of updateDisplayList ]
CustomButton( Begin to updateDisplayList )
CustomButton( The end of updateDisplayList )
CustomButton( Creation Complete )
CustomPanel[ CreationComplete ]
后来又发现，在MXML中设置基本变量和对象变量有一定区别，那就是对象变量必须要用大括号{}包起来，于是就想，会不会是绑定造成的，将APP改成如下,发现跟预想中的一样，最后的输出结果与上面的一样：

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" xmlns:com="com.*"> 
    <mx:Script> 
        <!--[CDATA[ 
            [Bindable] 
            private var o:String = "String test";//将原对象换成字符串 
        ]]--> 
    </mx:Script> 
    <com:CustomPanel width="100%" height="100%" label="FlexInitResearch"> 
        <com:CustomButton label="Button" 
            customString="customString test" customObject="{o}"/> 
    </com:CustomPanel> 
</mx:Application> 

为了进一步确定是由于绑定造成的赋值时期不一致，我又做了如下的一个试验，不使用绑定给对象变量赋值：

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" xmlns:com="com.*"> 
    <com:CustomPanel width="100%" height="100%" label="FlexInitResearch"> 
        <com:CustomButton label="Button" 
            customString="customString test"> 
            <com:customObject> 
                <mx:ArrayCollection/> 
            </com:customObject> 
        </com:CustomButton> 
    </com:CustomPanel> 
</mx:Application> 

其结果为:
CustomPanel[ PreInit ]
CustomPanel[ Begin to createChildren ]
CustomButton( Begin to Constructor )
CustomButton( The end of Constructor )
CustomButton( set customString )
CustomButton( set customObject ) //赋值时间与基本变量相同
CustomButton( PreInit )
CustomButton( Begin to createChildren )
CustomButton( The end of createChildren )
CustomButton( Init )
CustomPanel[ Init ]
CustomPanel[ The end of createChildren ]
CustomButton[ Begin to commitProperties ]
CustomButton[ The end of commitProperties ]
CustomButton( Begin to commitProperties )
CustomButton( The end of commitProperties )
CustomButton( Begin to measure )
CustomButton( The end of measure )
CustomPanel[ Begin to measure ]
CustomPanel[ The end of measure ]
CustomPanel[ Begin to updateDisplayList ]
CustomPanel[ Begin to layoutChrome ]
CustomPanel[ The end of layoutChrome ]
CustomPanel[ The end of updateDisplayList ]
CustomButton( Begin to updateDisplayList )
CustomButton( The end of updateDisplayList )
CustomButton( Creation Complete )
CustomPanel[ CreationComplete ]
问题确定，所以以后再createChildren 中使用自定义对象变量的时候必须要注意，否则就会出现空指针之类的问题了。

flex 简单例子(含实例效果图源码)
要过节了,工作任务也完成了,闲来没事,研究svg，感觉市场上对svg支持度不高,导致了这项技术不能够被IT群众充分的接纳，一个没有人支持的技术,她必然也不会有很大的前景。研究来研究去,还是觉得flex比较好玩。
2009-09-09
FluorineFx.NET的认证(Authentication )与授权(Authorization)Flex与.NE
FluorineFx.NET的认证(Authentication )与授权(Authorization)和ASP.NET中的大同小异,核实用户的身份既为认证，授权则是确定一个用户是否有某种执行权限
2009-06-06
Flex与.NET互操作(十三)：FluorineFx.Net实现视频录制与视频回放
本文主要介绍使用FluorineFx.Net来实现视频录制与视频回放，FluorineFx如同FMS一样，除了有AMF通信，RTMP协议，RPC 和远程共享对象外，它同样具备视频流服务的功能。
2009-06-06
Flex中最好的MVC框架Mate框架
个人感觉Mate框架非常适合开发一般运用程序，可以提高开发效率，节约成本，同时也比较好维护。但如果要做游戏或是其它控制更强的程序并不适合。
2008-10-10
Flex 如何得到itemRenderer里面的内容
itemRenderer里面的内容获取技巧。
2009-07-07
让Flex Builder 3.0与Eclipse3.4整合起来
Flex Builder 3.0 For Eclipse 3.3 安装方法
2009-02-02
Flex clipContent 编程注意
在做Flex项目的时候，碰到了一个修改，具体请看下面的原型图
2009-07-07
Flex 处理服务器端传来的数据
对于Java端返回的各种Java类型的对象，Flex中能否有相应的数据类型来映射。这是Flex与服务器通信使用remoteObject的关键。
2009-08-08
Flex 对象持久化
总有人问我关于Flex对象序列化和持久化的问题，很多人认为对象不能拷贝到服务器，其实浅度的拷贝是可以做到的。
2009-06-06
Flex dynamic 关键字的用法
Flex dynamic 关键字使用实例代码。对于学习flex的朋友也许有所帮助。
2009-05-05