转 Flex MXML编译成AS类

2009-09-22 23:25

Flex MXML编译成AS类

由“Flex 基础”文中可知：每一个mxml文件首先要编译成as文件，然后再译成swf文件。app.mxml文件编译后会产生一系列中间类，其中app_generated.as文件是主文件，文件中定义了转换后app的类定义。

以下将对转换后的类进行详细阐述。

1    转换后类的名称与应用程序同名（以app为例），继承自mx.core.Application。

2    在<mx:application>标签中定义的且有id的mx控件，转换成类app的共有成员。构造函数中初始化类对象，包括events、styles、properties等

3    mxml文件中定义的控件层次结构，通过mx.core.UIComponentDescriptor实例对象定义，控件的属性通过UIComponentDescriptor对象的propertiesFactory属性以键/值对的形式设置，控件的事件响应由UIComponentDescriptor对象的events属性设置，编译器自动生成一个新的事件响应函数，函数体为mxml中定义的内容，在events属性值中使用新的响应函数。举例如下：

mxml中定义如下控件<mx:Button id="addBtn" click="addToCart()" label="Add to Cart" x="36" y="124">

as中定义如下：

new mx.core.UIComponentDescriptor({
              type: mx.controls.Button                                        //控件类型
              ,
              id: "addBtn"                                                            //控件ID
              ,
              events: {                                                                  //事件响应函数
                click: "__addBtn_click"                                         //自动生成一个新事件函数
              }
              ,
              propertiesFactory: function():Object { return {      //普通属性
                label: "Add to Cart",
                x: 36,
                y: 124
              }}
            })

。。。。。

public function __addBtn_click(event:flash.events.MouseEvent):void
        {
             addToCart();                                                               //函数体为mx:Button的click属性值
        }

4    以mx标签形式定义的非可视化对象，如<mx:Number id="selectedBookIndex">{myDataGrid.selectedIndex}</mx:Number>

编译器在编译时自动生成一个相对应的函数，用于创建对象，并在构造函数中调用该对象。依上例，编译器生成如下函数

private function _app_Number1_i() : Number
            {
             var temp : Number = undefined;
             selectedBookIndex = temp;                                //作为类成员已在前面声明
             mx.binding.BindingManager.executeBindings(this, "selectedBookIndex", selectedBookIndex);    //为对象赋值
             return temp;
            }

在构造函数中调用其函数创建类成员的实例对象

public function app()

{

.........

_app_Number1_i() ;

........

}

5    _app_bindingsSetup():Array 函数创建绑定对象数组，每个绑定对象对应mxml文件中的{}数据绑定，如上所示的{myDataGrid.selectedIndex}，在as中转换为：

binding = new mx.binding.Binding(this,
                function():Number
                {
                    return (myDataGrid.selectedIndex);
                },
                function(_sourceFunctionReturnValue:Number):void
                {
                    selectedBookIndex = _sourceFunctionReturnValue;
                },
                "selectedBookIndex");
        result[0] = binding;

_app_bindingExprs():void    设置绑定目标表达式

var destination:*;
          [Binding(id='0')]
          destination = (myDataGrid.selectedIndex);

通过编译生成的其他类来执行具体的数据绑定（待后续研究）