在MXML中使用ActionScript3(1)

 你可以在MXML中混合使用ActionScript，如下：

1.在MXML事件事件中定义事件监听器

2.在<fx:Script>标签内添加脚本

3.包含外部的ActionScript文件

4.导入ActionScript类

5.创建ActionScript组件

为了在ActionScript中使用组件，你通常要在MXML标签中定义此组件的ID。举个例子，下面的代码设置按钮控件的ID为myButton。

<s:Button id="myButton" label="Click Me"/>

例子说明:点击按钮 在按钮上显示"Clicked"

 <?xml version="1.0"?>

<!-- usingas/ButtonExample.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script>
<![CDATA[
private function setLabel():void {
if (myButton.label=="Click Me") {
myButton.label = "Clicked";
} else {
myButton.label = "Click Me";
}
}
]]>
</fx:Script>
<s:Button id="myButton" label="Click Me" click="setLabel();"/>
</s:Application>

运行 

在MXML中的ID，无论它嵌套多深,都会被定义成一个公共变量。其结果是，所有的ID属性必须在文档中是唯一的。这就是说，如果

你指定了一个组件实例的ID，你可以在此程序的任何地方访问此组件：函数，外部类文件，导入的ActionScript或者MXML内部的

脚本。 

例：将sprite对象放在Panel容器中。

 <?xml version="1.0"?>

<!-- usingas/AddingChildrenAsUIComponents.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import flash.display.Sprite;
import mx.core.UIComponent;
private var xLoc:int = 20;
private var yLoc:int = 20;
private var circleColor:Number = 0xFFCC00;
private function addChildToPanel():void {
var circle:Sprite = new Sprite();
circle.graphics.beginFill(circleColor);
circle.graphics.drawCircle(xLoc, yLoc, 15);
var c:UIComponent = new UIComponent();
c.addChild(circle);
panel1.addElement(c);
xLoc = xLoc + 5;
yLoc = yLoc + 1;
circleColor = circleColor + 20;
}
]]>
</fx:Script>
<s:Panel id="panel1" height="250" width="300"/>
<s:Button id="myButton" label="Click Me" click="addChildToPanel();"/>
</s:Application>

运行

包含与导入ActionScript的对比

 include会从一个文件复制代码到另一个文件。<me:就像c中的#include作用一样>。Import添加一个类文件或包的引用，你可以访问被外部的类定义的对象及属性。你导入的文件必须在源码路径上能找到。你包含的文件必须定位到相关的文件中。可以使用include,或用绝对路径。

你作用include或<fx:script source="filename">标签来向你的程序添加ActionScript代码。

你在fx:script块中使用import来定义一个ActionScript类和包的位置。

使用fx:Script source包含ActionScript文件

为了包含ActionScript代码，你要在你的<fx:Script>标签中引用 外部ActionScript文件。在编译时，编译器复制文件中所有的内容到你的MXML程序中，就好像你手动输入它一样。由于在<fx:Script>使用了ActionScript，ActionScript只能在函数内部使用。 

例：求和

IncludedFile.as文件位于bin\includes目录中，内容如下：

// usingas/includes/IncludedFile.as
public function computeSum(a:Number, b:Number):Number {
return a + b;

}

SourceInclude.mxml 文件在bin目录中。内容如下：

 <?xml version="1.0"?>

<!-- usingas/SourceInclude.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script source="includes/IncludedFile.as"/>
<s:TextInput id="ta1st" text="3" width="40" x="170" y="24" textAlign="right"/>
<s:TextInput id="ta2nd" text="3" width="40" x="170" y="52" textAlign="right"/>
<s:TextArea id="taMain" height="25" width="78" x="132" y="82" textAlign="right"/>
<s:Button id="b1" label="Compute Sum"
click="taMain.text=String(computeSum(Number(ta1st.text), Number(ta2nd.text)));"
x="105" y="115"/>
<s:Label x="148" y="52" text="+" fontWeight="bold" fontSize="17" width="23"/>
</s:Application>

 编译命令如下

 mxmlc SourceInclude.mxml

运行 

直接使用include 

语法为include "file_name"

例子如下

<?xml version="1.0"?>
<!--IncludeASFile.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script>
    <![CDATA[
    include "includes/IncludedFile.as";
    ]]>
</fx:Script>
<s:TextInput id="ta1st" text="3" width="40" x="170" y="24" textAlign="right"/>
<s:TextInput id="ta2nd" text="3" width="40" x="170" y="52" textAlign="right"/>
<s:TextArea id="taMain" height="25" width="78" x="132" y="82" textAlign="right"/>
<s:Button id="b1" label="Compute Sum"
click="taMain.text=String(computeSum(Number(ta1st.text), Number(ta2nd.text)));"
x="105" y="115"/>
<s:Label x="148" y="52" text="+" fontWeight="bold" fontSize="17" width="23"/>

</s:Application> 

运行  

import方法

如果你import一个类，但是在你的程序没有使用此类，此类并不包含在SWF文件的字节码中。 由于这个结论，导入整个包而不会创建一个巨大的SWF文件。

例：

AccessingPackagedClasses.mxml 

<?xml version="1.0"?>
<!-- usingas/AccessingPackagedClasses.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import Util.MyClass;
private var mc:MyClass = new MyClass;
]]>
</fx:Script>
<s:Button id="myButton" label="Click Me" click="myButton.label=mc.returnAString()"/>

</s:Application>

MyClass.as文件位于bin/Util文件夹中，内容如下

package Util
{
    public class MyClass
    {
        public function returnAString():String
        {
            return "TestImportClass";
        }
    }

}

运行 

创建ActionScript组件

MyButtonX.as 文件放在bin\myControls目录中

package myControls {
import mx.controls.Button;
    public class MyButtonX extends Button 
    {
        public function MyButtonX() 
        {
            label="MyBtnX";
        }
    }

}

TestComponent.mxml 文件在bin目录下

 运行D:\flex_sdk_4.6\bin>mxmlc TestComponent.mxml

 运行

参考 flex_4.6_help