`

flex元数据解析

    博客分类:
  • flex
阅读更多

as3 元数据标签的意义解析(Flex 2 Metadata Tags)

 

http://bvu.iteye.com/blog/315323

 

英文原文:Flex 2 Metadata Tags
原文地址:http://mxdj.sys-con.com/read/361239.htm

原文作者:Rich Tretola(作者是everythingflex.com的创建人以及IFBIN的贡献者之一)
文章来自: 闪无忧(www.5uflash.com) 详文参考:http://5uflash.com/Flex -AIR/Flexziliao/1479.html
感谢译者:Dreamer,http://www.zhuoqun.net/

Flex 2 中的元数据标签
http://www.newflash3d.com ---flash3D先锋队:北京贝武易科技公司】
有疑问请联系我QQ:363596350
——告诉编译器如何编译

虽然多数Flex 开发者都使用过[Bindable]标签,但是很多人都不知道这个 标签的作用甚至不知道该标签为何物。[Bindable]就是所谓的元数据标签。元数据标签是一种特殊的标签,它在代码中的作用就是向编译器提供如何编译 程序的信息。实际上,这些标签并没有被编译到生成的SWF文件中,而只是告诉编译器如何生成SWF文件。文档中列出的元数据标签共有12个,本文将讲解这 些元数据标签的定义并给出使用它们的示例,在看完这篇文章之后,你就会明白应该在何时何处在你的Flex 2应用程序中使用元数据标签了。

[ArrayElementType]

实际上,定义一个数组通常来说是一件很平常的事情,因为数组中的元素可以是任何类型的。不过,使用ArrayElementType元数据标签可以让你定义数组元素的数据类型。下面的例子展示了如何使用[ArrayElementType]:
程序代码

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%20%20%20%5BArrayElementType(%22String%22)%5D%0A%20%20%20%20public%20var%20arrayOfStrings%3AArray%3B%0A%0A%20%20%20%20%5BArrayElementType(%22Number%22)%5D%0A%20%20%20%20public%20var%20arrayOfNumbers%3AArray%3B%0A%0A%20%20%20%20%5BArrayElementType(%22mx.core.UIComponent%22)%5D%0A%20%20%20%20public%20var%20arrayOfUIComponents%3AArray%3B%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [ArrayElementType( "String" )]  
  2.  public  var arrayOfStrings:Array;  
  3.   
  4.  [ArrayElementType("Number" )]  
  5.  public  var arrayOfNumbers:Array;  
  6.   
  7.  [ArrayElementType("mx.core.UIComponent" )]  
  8.  public  var arrayOfUIComponents:Array;   
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%20%20%20%5BArrayElementType(%22String%22)%5D%0A%20%20%20%20public%20var%20arrayOfStrings%3AArray%3B%0A%0A%20%20%20%20%5BArrayElementType(%22Number%22)%5D%0A%20%20%20%20public%20var%20arrayOfNumbers%3AArray%3B%0A%0A%20%20%20%20%5BArrayElementType(%22mx.core.UIComponent%22)%5D%0A%20%20%20%20public%20var%20arrayOfUIComponents%3AArray%3B%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [ArrayElementType( "String" )]  
  2.  public  var arrayOfStrings:Array;  
  3.   
  4.  [ArrayElementType("Number" )]  
  5.  public  var arrayOfNumbers:Array;  
  6.   
  7.  [ArrayElementType("mx.core.UIComponent" )]  
  8.  public  var arrayOfUIComponents:Array;   
   [ArrayElementType("String")]
    public var arrayOfStrings:Array;

    [ArrayElementType("Number")]
    public var arrayOfNumbers:Array;

    [ArrayElementType("mx.core.UIComponent")]
    public var arrayOfUIComponents:Array; 



[Bindable]

Bindable元数据标签是最经常用到的一个元数据标签,因为它使程序组件之间的数据同步变得很容易。Bindable可以用来绑定简单数据类 型、类、复杂数据类型以及函数。绑定数据的时候,你必须先使用元数据标签定义一下数据,正如Listing 1中所示的那样。图1是Listing 1的代码运行结果。

Bindable也可以用来绑定到事件。Listing 2展示了如何使用getter和setter函数将一个属性绑定到一个事件上。这个例子中有一个叫做phoneNumber的私有变量,还有一个公有的 setter和getter函数。使用Bindable标签将这个getter方法绑定到了一个叫做phoneNumberChanged的事件上,只要 数据发生改变setter方法就会分派phoneNumberChanged事件。通过使用setter方法,可以在数据赋予私有变量之前对其进行操作。 在这个例子中,数据只有在长度大于等于10的时候才会被格式化。当phoneNumberChanged事件被分派的时候,第二个TextInput组件 会被更新,因为他的text属性绑定到了phoneNumber变量上。

图2和图3显示了Listing 2代码的运行结果。
图2

图3


[DefaultProperty]

DefaultProperty元数据标签用来将一个单一属性设定为某个类的默认属性。它允许在一个容器标签内设定属性,而不用定义属性的名字。 一个简单的例子就是一个自定义Button类。Listing 3展示了一个简单的Button类,它将label属性设定为了DefaultProperty。
Listing 4展示了label属性是如何在自定义Button标签中作为一个字符串定义的。

[Embed]

Embed元数据标签用来导入图片到程序。可以通过两种方式使用Embed。你可以将图片嵌入到ActionScript中并将其指派给一个变量(如同下面代码中的第一个例子),或者你也可以将图片直接指派给组件的属性(使用下面代码中的第二个例子所示的语法规则)。

例1:
程序代码

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%5BEmbed(source%3D%22myIcon.gif%22)%5D%0A%5BBindable%5D%0Apublic%20var%20myIcon%3AClass%3B%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%201%22%20icon%3D%22%7BmyIcon%7D%22%2F%3E%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%202%22%20icon%3D%22%7BmyIcon%7D%22%2F%3E%20%0A" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [Embed(source= "myIcon.gif" )]  
  2. [Bindable]  
  3. public  var myIcon:Class;  
  4.   
  5. <mx:Button label="Icon Button 1"  icon= "{myIcon}" />  
  6.   
  7. <mx:Button label="Icon Button 2"  icon= "{myIcon}" />   
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%5BEmbed(source%3D%22myIcon.gif%22)%5D%0A%5BBindable%5D%0Apublic%20var%20myIcon%3AClass%3B%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%201%22%20icon%3D%22%7BmyIcon%7D%22%2F%3E%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%202%22%20icon%3D%22%7BmyIcon%7D%22%2F%3E%20%0A" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [Embed(source= "myIcon.gif" )]  
  2. [Bindable]  
  3. public  var myIcon:Class;  
  4.   
  5. <mx:Button label="Icon Button 1"  icon= "{myIcon}" />  
  6.   
  7. <mx:Button label="Icon Button 2"  icon= "{myIcon}" />   
[Embed(source="myIcon.gif")]
[Bindable]
public var myIcon:Class;

<mx:Button label="Icon Button 1" icon="{myIcon}"/>

<mx:Button label="Icon Button 2" icon="{myIcon}"/> 



例2:

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%3Cmx%3AButton%20label%3D%22Icon%20Button%201%22%20icon%3D%22%40Embed(source%3DmyIcon.gif')%22%2F%3E%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%202%22%20icon%3D%22%40Embed(source%3DmyIcon.gif')%22%2F%3E%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. <mx:Button label= "Icon Button 1"  icon= "@Embed(source=myIcon.gif')" />  
  2.   
  3. <mx:Button label="Icon Button 2"  icon= "@Embed(source=myIcon.gif')" />   
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cmx%3AButton%20label%3D%22Icon%20Button%201%22%20icon%3D%22%40Embed(source%3DmyIcon.gif')%22%2F%3E%0A%0A%3Cmx%3AButton%20label%3D%22Icon%20Button%202%22%20icon%3D%22%40Embed(source%3DmyIcon.gif')%22%2F%3E%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. <mx:Button label= "Icon Button 1"  icon= "@Embed(source=myIcon.gif')" />  
  2.   
  3. <mx:Button label="Icon Button 2"  icon= "@Embed(source=myIcon.gif')" />   
<mx:Button label="Icon Button 1" icon="@Embed(source=myIcon.gif')"/>

<mx:Button label="Icon Button 2" icon="@Embed(source=myIcon.gif')"/> 



上面这两个例子产生的结果是一样的。创建myIcon类的好处是,它在一个类中只定义一次并可以绑定到程序中的多个组件。

[Event]

Event元数据标签用来声明那些被自定义类分派的事件。将这个元数据标签添加到类定义中之后,你就可以在MXML标签中添加事件处理函数来初始 化该自定义类。Listing 5创建了一个自定义Button类,每当它的label属性改变的时候就会分派一个事件。Listing 6所显示的主程序文件初始化了这个自定义Button并创建了事件处理函数,该函数将新的labe属性值赋给了一个TextArea组件以显示当前发生的 更改。

图4显示了Listing 5 和 Listing 6中的代码运行结果。
图4


[Effect]

Effect元数据标签用来定义一个自定义效果,当某个事件发生的时候该效果会被分派。这个示例可以基于前面Event的例子来创建,通过简单地 更改ButtonLabel类(Listing 7)中的一行代码,就定义了一个效果,该效果可以在MXML标签中直接使用(Listing

[IconFile]

IconFile是用来定义一个jpg,gif或者png文件的文件名的,它在你的自定义类中作为图标来使用。[Embed]元数据标签可以用来 嵌入图片、SWF文件、音乐文件以及视频文件等,而IconFile则只是用来嵌入用来作为自定义类图标的文件。下面是一个IconFile的例子:



程序代码

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%5BIconFile(%22icon.png%22)%5D%0Apublic%20class%20CustomButton%20extends%20Button%0A%7B%0A%0A%7D" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [IconFile( "icon.png" )]  
  2. public   class  CustomButton  extends  Button  
  3. {  
  4.   
  5. }  
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%5BIconFile(%22icon.png%22)%5D%0Apublic%20class%20CustomButton%20extends%20Button%0A%7B%0A%0A%7D" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [IconFile( "icon.png" )]  
  2. public   class  CustomButton  extends  Button  
  3. {  
  4.   
  5. }  
[IconFile("icon.png")]
public class CustomButton extends Button
{

}




[Inspectable]

在使用Flex Builder 2的时候,你可能会希望某些自定义组件的属性在代码提示和属性检查器(property inspector)中显示,Inspectable元数据标签就是用来定义那些属性的。Listing 9展示的例子定义了一个inspectable的ccType变量,它定义了Visa为默认值、Credit Card为类别并将取值范围定义为包含了Visa, Mastercard, Discover, 和 American Express的枚举。

图5展示了当将组件添加到程序中的时候所显示的代码提示。

图5:


图6与上面展示的是同样的代码,但是这次是设计视图,所以我们能看到属性检查器。你可以看到属性ccType的类别为Credit Card,它的所有可选的值都在下拉列表中。

图6:


[InstanceType]

当在一个模板对象中声明一个像IDeferredInstance这样的变量时,InstanceType元数据标签就用来声明对象的类型。下面是InstanceType的用法:

程序代码

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%5BInstanceType(%22package.className%22)%5D%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [InstanceType( "package.className" )]   
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%5BInstanceType(%22package.className%22)%5D%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. [InstanceType( "package.className" )]   
[InstanceType("package.className")] 




[NonCommittingChangeEvent]

NonCommittingChangeEvent元数据标签在某个特定事件发生的时候可以防止变量在事件发生的过程中被更改。Listing 10展示了它是如何工作的。一个名为s的字符串类型的私有变量被绑定到了名为ti2的TextInput组件上。另外一个id为ti1的 TextInput组件在它的text发生更改的时候就会将s的值设置为它的text属性的值。另外,当triggerBinding 事件被分派的时候,附加在s变量上的Binding元数据标签就会进行绑定。只有在Enter键在ti1 TextInput组件中被按下时才会分派triggerBinding事件。

[RemoteClass]

RemoteClass可以用来将一个ActionScript类绑定到一个Java类或一个ColdFusion CFC。这样做可以自动转换数据类型。下面的例子将包com.mydomain中的名为MyClass的ActionScript类绑定到了同一个包中名 为MyClass的Java类:

程序代码

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=package%20com.mydomain%20%7B%0A%20%20%20%5BBindable%5D%0A%20%20%20%5BRemoteClass(alias%3D%22com.mydomain.MyClass%22)%5D%0A%20%20%20public%20class%20MyClass%20%7B%0A%20%20%20%20%20public%20var%20id%3Aint%3B%0A%0A%20%20%20%20%20public%20var%20myText%3AString%3B%0A%0A%20%20%20%7D%0A%7D%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. package  com.mydomain {  
  2.    [Bindable]  
  3.    [RemoteClass(alias="com.mydomain.MyClass" )]  
  4.    public   class  MyClass {  
  5.      public  var id: int ;  
  6.   
  7.      public  var myText:String;  
  8.   
  9.    }  
  10. }   
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.mydomain%20%7B%0A%20%20%20%5BBindable%5D%0A%20%20%20%5BRemoteClass(alias%3D%22com.mydomain.MyClass%22)%5D%0A%20%20%20public%20class%20MyClass%20%7B%0A%20%20%20%20%20public%20var%20id%3Aint%3B%0A%0A%20%20%20%20%20public%20var%20myText%3AString%3B%0A%0A%20%20%20%7D%0A%7D%20" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. package  com.mydomain {  
  2.    [Bindable]  
  3.    [RemoteClass(alias="com.mydomain.MyClass" )]  
  4.    public   class  MyClass {  
  5.      public  var id: int ;  
  6.   
  7.      public  var myText:String;  
  8.   
  9.    }  
  10. }   
package com.mydomain {
   [Bindable]
   [RemoteClass(alias="com.mydomain.MyClass")]
   public class MyClass {
     public var id:int;

     public var myText:String;

   }
} 



[Style]

Style元数据标签用来为组件定义自定义样式属性的。只需要简单地将Sytle元数据标签添加到类的定义当然,然后就可以使用getSytle 方法获取它的值了。Listing 11 和 12中的例子定义了两个样式,分别为borderColor 和fillColor,它们的数据类型都是uint。当类初始化的时候这两个样式就会在标签中被设定。代码中覆写了updateDisplayList函 数,用自定义的样式画了一个圆形边框并将其填充。

图7展示了Listing 11 和 Listing 12中代码运行的结果。

图7:


现在你应该会有这样的感觉了:“喔,现在我知道在哪里可以使用它们了”或者“嗯,我想我会在新的项目中尝试使用这些元数据标签”。如果你没有,那么你可能需要回过头去再看一遍这篇文章。OK,我想说的是Adobe Flex 小组提供给我们的元数据标签不只是非常的强大,可以让我们扩展或自定义我们要做的东西,而且它还非常易于使用。通过使用它们,仅仅几行代码就可以完成一大堆事情。如果不使用这些标签,你会发现在Flex 2中实现一些东西是很辛苦的。

代码集合(Listing 1-12):

Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/%E6%94%B6%E8%97%8F%E7%9A%84html/flash/flex/flexMeteDate%E8%A7%A3%E9%87%8A_files/clipboard_new.swf" flashvars="clipboard=%2F%2FListing%201%20A%20simple%20use%20of%20%5BBindable%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0A%5BBindable%5D%0Aprivate%20var%20me%3AString%3D%22Rich%20Tretola%22%3B%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22Simple%20Binding%22%20width%3D%22500%22%20height%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ALabel%20text%3D%22%7Bme%7D%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%202%20Using%20%5BBindable%5D%20with%20getters%20and%20setters%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aprivate%20var%20_phoneNumber%3AString%20%3D%20%3F%3B%0A%2F%2F%20Bind%20getter%20function%20to%20phoneNumberChanged%20event%0A%5BBindable(event%3D%22phoneNumberChanged%22)%5D%0Apublic%20function%20get%20phoneNumber()%3AString%20%7B%0Areturn%20_phoneNumber%3B%0A%7D%0A%2F%2F%20Setter%20method.%0Apublic%20function%20set%20phoneNumber(value%3AString)%3Avoid%20%7B%0Aif%20(value.length%3C10)%20%7B%0A_phoneNumber%20%3D%20value%3B%0A%7D%20else%20%7B%0A_phoneNumber%20%3D%20phoneFormatter.format(value)%3B%0A%7D%0A%2F%2F%20Create%20and%20dispatch%20event%0Avar%20eventObj%3AEvent%20%3D%20new%20Event(%E6%90%8DhoneNumberChanged%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APhoneFormatter%20id%3D%22phoneFormatter%22%0AformatString%3D%22(%23%23%23)%20%23%23%23-%23%23%23%23%22%20validPatternChars%3D%22%23-()%0A%3F%3E%0A%3Cmx%3APanel%20title%3D%22Bind%20with%20Getters%20and%20Setters%22%0Awidth%3D%22500%22%20height%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ATextInput%20id%3D%22ti1%22%20change%3D%22phoneNumber%3Dti1.text%22%0AmaxChars%3D%2210%22%20restrict%3D%220-9%22%2F%3E%0A%3Cmx%3ATextInput%20id%3D%22ti2%22%20text%3D%22%7BphoneNumber%7D%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%203%20Custom%20Button%20class%20named%20MyButton%0A%0Apackage%0A%7B%0Aimport%20mx.controls.Button%3B%0A%5BDefaultProperty(%E6%90%87abel%22)%5D%0Apublic%20class%20MyButton%20extends%20Button%0A%7B%0A%7D%0A%7D%0A%0A%2F%2FListing%204%20Using%20the%20MyButton%20class%20wih%20%5BDefaultProperty%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0Axmlns%3Acomps%3D%22*%22%3E%0A%3Ccomps%3AMyButton%3E%0A%3Cmx%3AString%3ETest%3C%2Fmx%3AString%3E%0A%3C%2Fcomps%3AMyButton%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%205%20Custom%20ButtonLabel%20class%20using%20%5BEvent%5D%0A%0Apackage%0A%7B%0Aimport%20mx.controls.Button%3B%0Aimport%20flash.events.Event%3B%0A%2F%2F%20Define%20the%20custom%20event%0A%5BEvent(name%3D%22labelChanged%22%2C%20type%3D%22flash.events.Event%22)%5D%0Apublic%20class%20ButtonLabel%20extends%20Button%20%7B%0A%2F%2F%20property%20to%20hold%20label%20value%0Aprivate%20var%20_myLabel%3AString%3B%0A%2F%2F%20public%20setter%20method%0Apublic%20function%20set%20myLabel(s%3AString)%3Avoid%20%7B%0A_myLabel%20%3D%20s%3B%0Athis.label%20%3D%20s%3B%0A%2F%2F%20Create%20and%20dispatch%20custom%20event%0Avar%20eventObj%3AEvent%20%3D%20new%20Event(%E6%90%87abelChanged%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%7D%0A%7D%0A%0A%2F%2FListing%206%20Using%20the%20ButtonLabel%20class%20with%20the%20labelChanged%20%5BEvent%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0Axmlns%3Acomps%3D%22*%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aimport%20mx.controls.Alert%3B%0Aimport%20flash.events.Event%3B%0A%2F%2F%20method%20to%20handle%20custom%20event%0Apublic%20function%20labelChanged(eventObj%3AEvent)%3Avoid%20%7B%0AmyTA.text%3D%20myTA.text%20%2B%20%E6%8F%ACn%22%2B%20eventObj.target.label%3B%0AmyTA.verticalScrollPosition%20%3D%20myTA.verticalScrollPosition%20%2B%0A20%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22Event%20Sample%22%20width%3D%22500%22%20height%3D%22275%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22absolute%22%3E%0A%3Cmx%3ATextInput%20id%3D%22buttonLabelTI%22%0Achange%3D%22myButton.myLabel%3DbuttonLabelTI.text%22%20x%3D%2210%22%20y%3D%229%22%2F%3E%0A%3C!--Instantiate%20custom%20class%20and%20define%20method%20to%20handle%20label-%0AChanged%20event--%3E%0A%3Ccomps%3AButtonLabel%20id%3D%22myButton%22%20labelChanged%3D%22labelChanged(event)%0A%3B%22%0Ax%3D%2210%22%20y%3D%2239%22%2F%3E%0A%3Cmx%3ATextArea%20id%3D%22myTA%22%20width%3D%22200%22%20height%3D%22200%22%20x%3D%22249%22%20y%3D%2210%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%207%20Add%20the%20Effect%20metadata%20tag%0A%0A...%0A%2F%2F%20Define%20the%20custom%20event%0A%5BEvent(name%3D%22labelChanged%22%2C%20type%3D%22flash.events.Event%22)%5D%0A%5BEffect(name%3D%22labelChangedEffect%22%2C%20event%3D%22labelChanged%22)%5D%0Apublic%20class%20ButtonLabel%20extends%20Button%20%7B%0A...%0A%0A%2F%2FListing%208%20Add%20labelChangedEffect%20to%20the%20Component%0A%0AInstantiation%20MXML%20Tag%0A%3Ccomps%3AButtonLabel%20id%3D%22myButton%22%20labelChanged%3D%22labelChanged(event)%3B%22%0AlabelChangedEffect%3D%22myEffect%22%20x%3D%2210%22%20y%3D%2239%22%2F%3E%0A%0A%2F%2FListing%209%20Custom%20component%20with%20%5BInspectable%5D%20defined%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AHBox%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0A%5BInspectable(defaultValue%3D%22Visa%22%2C%0Aenumeration%3D%22Visa%2CMastercard%2CDiscover%2CAmerican%20Express%22%0Acategory%3D%22Credit%20Card%22%20type%3D%22String%22)%5D%0Apublic%20var%20ccType%3AString%3B%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3C%2Fmx%3AHBox%3E%0A%0A%2F%2FListing%2010%20Using%20%5BNonCommittingChangeEvent%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aimport%20flash.events.Event%3B%0Aprivate%20var%20eventObj%3AEvent%3B%0A%5BBindable(event%3D%22triggerBinding%22)%5D%0A%5BNonCommittingChangeEvent(%E6%8F%B7hange%22)%5D%0Aprivate%20var%20s%3AString%3B%0Aprivate%20function%20triggerBinding()%3Avoid%7B%0AeventObj%20%3D%20new%20Event(%E6%90%95riggerBinding%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22NonCommittingChangeEvent%20Sample%22%20width%3D%22500%22%0Aheight%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ATextInput%20id%3D%22ti1%22%20change%3D%22s%3Dti1.text%22%20enter%3D%22triggerBinding()%22%0A%2F%3E%0A%3Cmx%3ATextInput%20id%3D%22ti2%22%20text%3D%22%7Bs%7D%22%20%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%2011%20Custom%20Class%20CustomCircle%20using%20%5BStyle%5D%20tags%0A%0Apackage%0A%7B%0Aimport%20mx.core.UIComponent%3B%0A%5BStyle(name%3D%22borderColor%22%2Ctype%3D%22uint%22%2Cformat%3D%22Color%22%2Cinherit%3D%22no%22)%5D%0A%5BStyle(name%3D%22fillColor%22%2Ctype%3D%22uint%22%2Cformat%3D%22Color%22%2Cinherit%3D%22no%22)%5D%0Apublic%20class%20CustomCircle%20extends%20UIComponent%20%7B%0Apublic%20function%20CustomCircle()%7B%0Asuper()%3B%0A%7D%0Aoverride%20protected%20function%20updateDisplayList(unscaledWidth%3ANumber%2C%0AunscaledHeight%3ANumber)%3Avoid%20%7B%0Asuper.updateDisplayList(unscaledWidth%2C%20unscaledHeight)%3B%0Agraphics.lineStyle(1%2C%20getStyle(%E6%8F%B5orderColor%22)%2C%201.0)%3B%0Agraphics.beginFill(getStyle(%E6%8F%BBillColor%22)%2C1.0)%3B%0Agraphics.drawEllipse(0%2C0%2C100%2C100)%3B%0A%7D%0A%7D%0A%7D%0A%0A%2F%2FListing%2012%20Using%20CustomCircle%20and%20assigning%20custom%20style%20properties%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0Axmlns%3Acomps%3D%22*%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3APanel%20title%3D%22Style%20Sample%22%20width%3D%22200%22%20height%3D%22200%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Ccomps%3ACustomCircle%20borderColor%3D%22%23000000%22%20fillColor%3D%22%23FF0000%22%20%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
  1. //Listing 1 A simple use of [Bindable]   
  2.   
  3. <?xml version="1.0"  encoding= "utf-8" ?>  
  4. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   
  5. backgroundColor="#FFFFFF" >  
  6. <mx:Script>  
  7. <![CDATA[  
  8. [Bindable]  
  9. private  var me:String= "Rich Tretola" ;  
  10. ]]>  
  11. </mx:Script>  
  12. <mx:Panel title="Simple Binding"  width= "500"  height= "90"   
  13. paddingTop="10"  paddingLeft= "10"  paddingRight= "10"  paddingBottom= " 10"  layout= "horizontal" >  
  14. <mx:Label text="{me}" />  
  15. </mx:Panel>  
  16. </mx:Application>  
  17.   
  18. //Listing 2 Using [Bindable] with getters and setters   
  19.   
  20. <?xml version="1.0"  encoding= "utf-8" ?>  
  21. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >  
  22. <mx:Script>  
  23. <![CDATA[  
  24. private  var _phoneNumber:String = ?;  
  25. // Bind getter function to phoneNumberChanged event   
  26. [Bindable(event="phoneNumberChanged" )]  
  27. public  function get phoneNumber():String {  
  28. return  _phoneNumber;  
  29. }  
  30. // Setter method.   
  31. public  function set phoneNumber(value:String): void  {  
  32. if  (value.length< 10 ) {  
  33. _phoneNumber = value;  
  34. else  {  
  35. _phoneNumber = phoneFormatter.format(value);  
  36. }  
  37. // Create and dispatch event   
  38. var eventObj:Event = new  Event(損honeNumberChanged");  
  39. dispatchEvent(eventObj);  
  40. }  
  41. ]]>  
  42. </mx:Script>  
  43. <mx:PhoneFormatter id="phoneFormatter"   
  44. formatString="(###) ###-####"  validPatternChars="#-()  
  45. ?>  
  46. <mx:Panel title="Bind with Getters and Setters"   
  47. width="500"  height= "90"   
  48. paddingTop="10"  paddingLeft= "10"  paddingRight= "10"  paddingBottom= " 10"  layout= "horizontal" >  
  49. <mx:TextInput id="ti1"  change= "phoneNumber=ti1.text"   
  50. maxChars="10"  restrict= "0-9" />  
  51. <mx:TextInput id="ti2"  text= "{phoneNumber}" />  
  52. </mx:Panel>  
  53. </mx:Application>  
  54.   
  55. //Listing 3 Custom Button class named MyButton   
  56.   
  57. package   
  58. {  
  59. import  mx.controls.Button;  
  60. [DefaultProperty(搇abel")]  
  61. public   class  MyButton  extends  Button  
  62. {  
  63. }  
  64. }  
  65.   
  66. //Listing 4 Using the MyButton class wih [DefaultProperty]   
  67.   
  68. <?xml version="1.0"  encoding= "utf-8" ?>  
  69. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   
  70. xmlns:comps="*" >  
  71. <comps:MyButton>  
  72. <mx:String>Test</mx:String>  
  73. </comps:MyButton>  
  74. </mx:Application>  
  75.   
  76. //Listing 5 Custom ButtonLabel class using [Event]   
  77.   
  78. package   
  79. {  
  80. import  mx.controls.Button;  
  81. import  flash.events.Event;  
  82. // Define the custom event   
  83. [Event(name="labelChanged" , type= "flash.events.Event" )]  
  84. public   class  ButtonLabel  extends  Button {  
  85. // property to hold label value   
  86. private  var _myLabel:String;  
  87. // public setter method   
  88. public  function set myLabel(s:String): void  {  
  89. _myLabel = s;  
  90. this .label = s;  
  91. // Create and dispatch custom event   
  92. var eventObj:Event = new  Event(搇abelChanged");  
  93. dispatchEvent(eventObj);  
  94. }  
  95. }  
  96. }  
  97.   
  98. //Listing 6 Using the ButtonLabel class with the labelChanged [Event]   
  99.   
  100. <?xml version="1.0"  encoding= "utf-8" ?>  
  101. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   
  102. xmlns:comps="*"   
  103. backgroundColor="#FFFFFF" >  
  104. <mx:Script>  
  105. <![CDATA[  
  106. import  mx.controls.Alert;  
  107. import  flash.events.Event;  
  108. // method to handle custom event   
  109. public  function labelChanged(eventObj:Event): void  {  
  110. myTA.text= myTA.text + 揬n"+ eventObj.target.label;  
  111. myTA.verticalScrollPosition = myTA.verticalScrollPosition +  
  112. 20 ;  
  113. }  
  114. ]]>  
  115. </mx:Script>  
  116. <mx:Panel title="Event Sample"  width= "500"  height= "275"   
  117. paddingTop="10"  paddingLeft= "10"  paddingRight= "10"  paddingBottom= " 10"  layout= "absolute" >  
  118. <mx:TextInput id="buttonLabelTI"   
  119. change="myButton.myLabel=buttonLabelTI.text"  x= "10"  y= "9" />  
  120. <!--Instantiate custom class  and define method to handle label-  
  121. Changed event-->  
  122. <comps:ButtonLabel id="myButton"  labelChanged="labelChanged(event)  
  123. ;"  
  124. x="10"  y= "39" />  
  125. <mx:TextArea id="myTA"  width= "200"  height= "200"  x= "249"  y= "10" />  
  126. </mx:Panel>  
  127. </mx:Application>  
  128.   
  129. //Listing 7 Add the Effect metadata  tag   
  130.   
  131. ...  
  132. // Define the custom event   
  133. [Event(name="labelChanged" , type= "flash.events.Event" )]  
  134. [Effect(name="labelChangedEffect" , event= "labelChanged" )]  
  135. public   class  ButtonLabel  extends  Button {  
  136. ...  
  137.   
  138. //Listing 8 Add labelChangedEffect to the Component   
  139.   
  140. Instantiation MXML Tag  
  141. <comps:ButtonLabel id="myButton"  labelChanged= "labelChanged(event);"   
  142. labelChangedEffect="myEffect"  x= "10"  y= "39" />  
  143.   
  144. //Listing 9 Custom component with [Inspectable] defined   
  145.   
  146. <?xml version="1.0"  encoding= "utf-8" ?>  
  147. <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" >  
  148. <mx:Script>  
  149. <![CDATA[  
  150. [Inspectable(defaultValue="Visa" ,  
  151. enumeration="Visa,Mastercard,Discover,American Express"   
  152. category="Credit Card"  type= "String" )]  
  153. public  var ccType:String;  
  154. ]]>  
  155. </mx:Script>  
  156. </mx:HBox>  
  157.   
  158. //Listing 10 Using [NonCommittingChangeEvent]   
  159.   
  160. <?xml version="1.0"  encoding= "utf-8" ?>  
  161. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   
  162. backgroundColor="#FFFFFF" >  
  163. <mx:Script>  
  164. <![CDATA[  
  165. import  flash.events.Event;  
  166. private  var eventObj:Event;  
  167. [Bindable(event="triggerBinding" )]  
  168. [NonCommittingChangeEvent(揷hange")]  
  169. private  var s:String;  
  170. private  function triggerBinding(): void {  
  171. eventObj = new  Event(搕riggerBinding");  
  172. dispatchEvent(eventObj);  
  173. }  
  174. ]]>  
  175. </mx:Script>  
  176. <mx:Panel title="NonCommittingChangeEvent Sample"  width= "500"   
  177. height="90"   
  178. paddingTop="10"  paddingLeft= "10"  paddingRight= "10"  paddingBottom= " 10"  layout= "horizontal" >  
  179. <mx:TextInput id="ti1"  change= "s=ti1.text"  enter= "triggerBinding()"   
  180. />  
  181. <mx:TextInput id="ti2"  text= "{s}"  />  
  182. </mx:Panel>  
  183. </mx:Application>  
  184.   
  185. //Listing 11 Custom Class CustomCircle using [Style] tags   
  186.   
  187. package   
  188. {  
  189. import  mx.core.UIComponent;  
  190. [Style(name="borderColor" ,type= "uint" ,format= "Color" ,inherit= "no" )]  
  191. [Style(name="fillColor" ,type= "uint" ,format= "Color" ,inherit= "no" )]  
  192. public   class  CustomCircle  extends  UIComponent {  
  193. public  function CustomCircle(){  
  194. super ();  
  195. }  
  196. override protected  function updateDisplayList(unscaledWidth:Number,  
  197. unscaledHeight:Number):void  {  
  198. super .updateDisplayList(unscaledWidth, unscaledHeight);  
  199. graphics.lineStyle(1 , getStyle(揵orderColor"),  1.0 );  
  200. graphics.beginFill(getStyle(揻illColor"),1.0 );  
  201. graphics.drawEllipse(0 , 0 , 100 , 100 );  
  202. }  
  203. }  
  204. }  
  205.   
  206. //Listing 12 Using CustomCircle and assigning custom style properties   
  207.   
  208. <?xml version="1.0"  encoding= "utf-8" ?>  
  209. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   
  210. xmlns:comps="*"   
  211. backgroundColor="#FFFFFF" >  
  212. <mx:Panel title="Style Sample"  width= "200"  height= "200"   
  213. paddingTop="10"  paddingLeft= "10"  paddingRight= "10"  paddingBottom= " 10"  layout= "horizontal" >  
  214. <comps:CustomCircle borderColor="#000000"  fillColor= "#FF0000"  />  
  215. </mx:Panel>  
  216. </mx:Application>  
Java代码 <embed type="application/x-shockwave-flash" width="14" height="15" src="file:///javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%2F%2FListing%201%20A%20simple%20use%20of%20%5BBindable%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0A%5BBindable%5D%0Aprivate%20var%20me%3AString%3D%22Rich%20Tretola%22%3B%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22Simple%20Binding%22%20width%3D%22500%22%20height%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ALabel%20text%3D%22%7Bme%7D%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%202%20Using%20%5BBindable%5D%20with%20getters%20and%20setters%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aprivate%20var%20_phoneNumber%3AString%20%3D%20%3F%3B%0A%2F%2F%20Bind%20getter%20function%20to%20phoneNumberChanged%20event%0A%5BBindable(event%3D%22phoneNumberChanged%22)%5D%0Apublic%20function%20get%20phoneNumber()%3AString%20%7B%0Areturn%20_phoneNumber%3B%0A%7D%0A%2F%2F%20Setter%20method.%0Apublic%20function%20set%20phoneNumber(value%3AString)%3Avoid%20%7B%0Aif%20(value.length%3C10)%20%7B%0A_phoneNumber%20%3D%20value%3B%0A%7D%20else%20%7B%0A_phoneNumber%20%3D%20phoneFormatter.format(value)%3B%0A%7D%0A%2F%2F%20Create%20and%20dispatch%20event%0Avar%20eventObj%3AEvent%20%3D%20new%20Event(%E6%90%8DhoneNumberChanged%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APhoneFormatter%20id%3D%22phoneFormatter%22%0AformatString%3D%22(%23%23%23)%20%23%23%23-%23%23%23%23%22%20validPatternChars%3D%22%23-()%0A%3F%3E%0A%3Cmx%3APanel%20title%3D%22Bind%20with%20Getters%20and%20Setters%22%0Awidth%3D%22500%22%20height%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ATextInput%20id%3D%22ti1%22%20change%3D%22phoneNumber%3Dti1.text%22%0AmaxChars%3D%2210%22%20restrict%3D%220-9%22%2F%3E%0A%3Cmx%3ATextInput%20id%3D%22ti2%22%20text%3D%22%7BphoneNumber%7D%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%203%20Custom%20Button%20class%20named%20MyButton%0A%0Apackage%0A%7B%0Aimport%20mx.controls.Button%3B%0A%5BDefaultProperty(%E6%90%87abel%22)%5D%0Apublic%20class%20MyButton%20extends%20Button%0A%7B%0A%7D%0A%7D%0A%0A%2F%2FListing%204%20Using%20the%20MyButton%20class%20wih%20%5BDefaultProperty%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0Axmlns%3Acomps%3D%22*%22%3E%0A%3Ccomps%3AMyButton%3E%0A%3Cmx%3AString%3ETest%3C%2Fmx%3AString%3E%0A%3C%2Fcomps%3AMyButton%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%205%20Custom%20ButtonLabel%20class%20using%20%5BEvent%5D%0A%0Apackage%0A%7B%0Aimport%20mx.controls.Button%3B%0Aimport%20flash.events.Event%3B%0A%2F%2F%20Define%20the%20custom%20event%0A%5BEvent(name%3D%22labelChanged%22%2C%20type%3D%22flash.events.Event%22)%5D%0Apublic%20class%20ButtonLabel%20extends%20Button%20%7B%0A%2F%2F%20property%20to%20hold%20label%20value%0Aprivate%20var%20_myLabel%3AString%3B%0A%2F%2F%20public%20setter%20method%0Apublic%20function%20set%20myLabel(s%3AString)%3Avoid%20%7B%0A_myLabel%20%3D%20s%3B%0Athis.label%20%3D%20s%3B%0A%2F%2F%20Create%20and%20dispatch%20custom%20event%0Avar%20eventObj%3AEvent%20%3D%20new%20Event(%E6%90%87abelChanged%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%7D%0A%7D%0A%0A%2F%2FListing%206%20Using%20the%20ButtonLabel%20class%20with%20the%20labelChanged%20%5BEvent%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0Axmlns%3Acomps%3D%22*%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aimport%20mx.controls.Alert%3B%0Aimport%20flash.events.Event%3B%0A%2F%2F%20method%20to%20handle%20custom%20event%0Apublic%20function%20labelChanged(eventObj%3AEvent)%3Avoid%20%7B%0AmyTA.text%3D%20myTA.text%20%2B%20%E6%8F%ACn%22%2B%20eventObj.target.label%3B%0AmyTA.verticalScrollPosition%20%3D%20myTA.verticalScrollPosition%20%2B%0A20%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22Event%20Sample%22%20width%3D%22500%22%20height%3D%22275%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22absolute%22%3E%0A%3Cmx%3ATextInput%20id%3D%22buttonLabelTI%22%0Achange%3D%22myButton.myLabel%3DbuttonLabelTI.text%22%20x%3D%2210%22%20y%3D%229%22%2F%3E%0A%3C!--Instantiate%20custom%20class%20and%20define%20method%20to%20handle%20label-%0AChanged%20event--%3E%0A%3Ccomps%3AButtonLabel%20id%3D%22myButton%22%20labelChanged%3D%22labelChanged(event)%0A%3B%22%0Ax%3D%2210%22%20y%3D%2239%22%2F%3E%0A%3Cmx%3ATextArea%20id%3D%22myTA%22%20width%3D%22200%22%20height%3D%22200%22%20x%3D%22249%22%20y%3D%2210%22%2F%3E%0A%3C%2Fmx%3APanel%3E%0A%3C%2Fmx%3AApplication%3E%0A%0A%2F%2FListing%207%20Add%20the%20Effect%20%3Cspan%20class%3D%22hilite2%22%3Emetadata%3C%2Fspan%3E%20tag%0A%0A...%0A%2F%2F%20Define%20the%20custom%20event%0A%5BEvent(name%3D%22labelChanged%22%2C%20type%3D%22flash.events.Event%22)%5D%0A%5BEffect(name%3D%22labelChangedEffect%22%2C%20event%3D%22labelChanged%22)%5D%0Apublic%20class%20ButtonLabel%20extends%20Button%20%7B%0A...%0A%0A%2F%2FListing%208%20Add%20labelChangedEffect%20to%20the%20Component%0A%0AInstantiation%20MXML%20Tag%0A%3Ccomps%3AButtonLabel%20id%3D%22myButton%22%20labelChanged%3D%22labelChanged(event)%3B%22%0AlabelChangedEffect%3D%22myEffect%22%20x%3D%2210%22%20y%3D%2239%22%2F%3E%0A%0A%2F%2FListing%209%20Custom%20component%20with%20%5BInspectable%5D%20defined%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AHBox%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0A%5BInspectable(defaultValue%3D%22Visa%22%2C%0Aenumeration%3D%22Visa%2CMastercard%2CDiscover%2CAmerican%20Express%22%0Acategory%3D%22Credit%20Card%22%20type%3D%22String%22)%5D%0Apublic%20var%20ccType%3AString%3B%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3C%2Fmx%3AHBox%3E%0A%0A%2F%2FListing%2010%20Using%20%5BNonCommittingChangeEvent%5D%0A%0A%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Cmx%3AApplication%20xmlns%3Amx%3D%22http%3A%2F%2Fwww.adobe.com%2F2006%2Fmxml%22%0AbackgroundColor%3D%22%23FFFFFF%22%3E%0A%3Cmx%3AScript%3E%0A%3C!%5BCDATA%5B%0Aimport%20flash.events.Event%3B%0Aprivate%20var%20eventObj%3AEvent%3B%0A%5BBindable(event%3D%22triggerBinding%22)%5D%0A%5BNonCommittingChangeEvent(%E6%8F%B7hange%22)%5D%0Aprivate%20var%20s%3AString%3B%0Aprivate%20function%20triggerBinding()%3Avoid%7B%0AeventObj%20%3D%20new%20Event(%E6%90%95riggerBinding%22)%3B%0AdispatchEvent(eventObj)%3B%0A%7D%0A%5D%5D%3E%0A%3C%2Fmx%3AScript%3E%0A%3Cmx%3APanel%20title%3D%22NonCommittingChangeEvent%20Sample%22%20width%3D%22500%22%0Aheight%3D%2290%22%0ApaddingTop%3D%2210%22%20paddingLeft%3D%2210%22%20paddingRight%3D%2210%22%20paddingBottom%3D%22%2010%22%20layout%3D%22horizontal%22%3E%0A%3Cmx%3ATextInput%20id%3D%22ti1%22%20change%3D%22s%3Dti1.text%22%20enter%3D%22triggerBinding()%22%0A%2F%3E%0A
分享到:
评论

相关推荐

    flex解析json的swc包(entity-flex-v1-02)及例子

    SWC是Adobe Flex的库文件格式,它包含了编译后的ActionScript代码和相关的元数据,可以被其他Flex或Flash项目引用。 JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于...

    flex as3 元数据标签综合

    ### Flex AS3 元数据标签综合解析 #### 一、元数据标签概述 在Flex与AS3(ActionScript 3)开发中,元数据标签(Metadata Tags)是一种重要的语法结构,用于向编译器提供有关类或成员的额外信息。这些标签能够帮助...

    flex json解析包(corelib.swc)

    SWC是Adobe Flex Compiler生成的库文件格式,它包含了ActionScript代码、资源、元数据等,可以被其他Flex项目作为依赖引用,以实现代码复用和模块化开发。 在Flex中,进行JSON操作主要依赖于`...

    flex air 导出 excel

    而"catalog.xml"可能是这个库的清单文件,列出了库中所有可用的组件和它们的元数据。这两个文件在实现上述导出Excel功能时并不是直接相关的,但它们可能用于构建Flex Air应用的用户界面,比如创建用于导出数据的按钮...

    flex做的googlemaps

    而`catalog.xml`可能是Flex项目或库的元数据文件,描述了库中的组件和资源。 9. **学习资源**: 开发者可以参考Google Maps API官方文档、Adobe Flex官方文档,以及各种在线教程和社区资源来学习如何将这两者结合。 ...

    Flash(Flex)反编译及修改

    - 反编译的代码可能与原始源代码有所不同,因为编译过程会进行优化,可能丢失某些元数据或注释。 - 代码质量不保证:反编译的代码可能不是最优或最清晰的,因为它是从二进制格式转换而来的。 总之,Flash和Flex反...

    Flex WebService Demo

    1. **ActionScript类**:这些是使用AS3编写的类,用于处理Web服务的调用、数据解析和用户界面的更新。它们可能包括自定义的WebService类,这些类扩展了Flex提供的BaseAsyncResponder类,用于异步调用Web服务。 2. *...

    googleMap-Flex

    而"catalog.xml"可能是Flex项目的资源清单文件,它包含了关于项目元数据的信息,如库中的组件、类或资源的引用。通过解析这个XML文件,Flex编译器能够了解如何组织和编译项目,包括哪些库需要被链接以及它们之间的...

    Flex2StyleExplorer.zip_Flex2StyleExplor_Flex2StyleExplorer_flex

    - `Flex2StyleExplorer.mxml`:主应用程序文件,包含Flex项目的元数据和MXML代码。 - `ListRenderer.mxml`:可能是一个自定义列表渲染器的示例,用于展示如何自定义组件显示。 - `www.pudn.com.txt`:可能是下载...

    flex-sdk-4.5.1.21328A.zip

    开发者可以通过解析此XML文件获取SDK的相关元数据,这对于管理和集成SDK到构建环境中至关重要。 "include"目录包含了一系列的头文件,这些文件是ActionScript编译器和Flash Player需要的,它们定义了各种类库和接口...

    flex 工作流设计器

    2. **元数据驱动**:使用元数据来描述工作流的结构和行为,元数据可以被解析以生成相应的执行代码。 3. **组件化**:工作流中的每个步骤或环节都可以视为一个独立的组件,这些组件可以复用,降低了开发复杂性。 三...

    Flex Mate框架swc包及Mate用法

    SWC文件是Adobe Flash和Flex的二进制库格式,包含了类定义、资源和其他元数据。在本例中,“library.swf”包含Flex Mate框架的实现,可以直接导入到项目中,以避免在源代码中包含框架的所有源文件。 “catalog.xml...

    Flex4之DataGrid四个的示例【客户端和服务器端】

    而`catalog.xml`则可能是库项目的元数据文件,用于描述SWF文件中包含的组件和类。 总结起来,"Flex4之DataGrid四个的示例【客户端和服务器端】"这一主题涵盖了使用Flex4的DataGrid组件展示和处理数据的基本技巧,...

    Baidu-Mobile-Flex.rar_flex_flex mobile

    3. **SWC文件**: SWC是Flex的库文件格式,可以包含ActionScript类、资源、元数据和库元数据。开发者可以将SWC文件作为库引入到他们的项目中,以便重用代码和组件。 4. **百度地图API**: 百度地图提供了丰富的API...

    FLEX简单的Flex 相册(附源码)

    - `model`和`valueObjects`:这些可能是数据模型和值对象,负责存储和传递相册数据,例如图片元信息。 3. Flex相册的工作流程: - 用户启动应用,`PhotoGallery.mxml`加载并解析XML配置文件,获取图片列表。 - ...

    Flex中文本高亮显示

    - `.project`:Eclipse项目配置文件,定义了项目的类型和其他元数据。 - `html-template`:可能是Flex应用程序的HTML包装器模板,用于在浏览器中运行SWF文件。 - `.settings`:Eclipse项目的首选项存储目录,包含了...

    ArcGIS for Flex开发中Graphic的attributes解析

    属性信息存储在`attributes`属性中,这是一个Object类型的键值对集合,用来存储图形的各种元数据。然而,在实际应用中,特别是需要将这些属性展示在DataGrid控件中时,会遇到一些挑战,因为`attributes`对象不能直接...

    flex全屏代码 界面全屏

    HTML部分提供了关于Flex应用的一些元数据,包括版权信息、版本检查以及对Flash Player的引用。这部分内容对于理解Flex应用的工作原理和环境配置有帮助,但与全屏功能的实现关系不大。 ### 实现全屏的注意事项 1. *...

    flex3 java 文件上传源码

    5. **URLVariables和URLRequest**:配置上传请求时,可能需要添加额外的参数,如用户ID或其他元数据。这可以通过URLVariables对象实现,并附加到URLRequest对象。 Java端(UpLoadServer)是文件上传的接收者,负责...

    Rss.zip_flex

    总的来说,“Rss.zip_flex”项目提供了一个学习Flex开发RSS订阅器的实例,涵盖了从网络通信到数据解析,再到UI展现等多个关键环节,对于理解和实践Flex编程具有很大的帮助。通过深入研究该项目的源代码,开发者可以...

Global site tag (gtag.js) - Google Analytics