- 浏览: 143334 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
di1984HIT:
谢谢,不错。
javadoc生成API 常见问题 -
hzywy:
你的myeclipse是什么版本的 我的8.6为什么不没有xf ...
webSerivce 用XFire自动生成客户端 -
click_guobin:
解。
详解Java Singleton(单例)模式的好处 -
pengting:
敢用钱来衡量我,我直接让她跪啤酒瓶盖....
计算你的女朋友值多少钱 -
argont:
用 window.location = url 可以解决。
IE6 location.href不跳转
元数据标签是一种特殊的标签,它在代码中的作用就是向编译器提供如何编译程序的信息。实际上,这些标签并没有被编译到生成的SWF文件中,而只是告诉编译器如何生成SWF文件。
Flex 元数据标签
1、[ArrayElementType]
使用ArrayElementType元数据标签可以让你定义数组元素的数据类型。
使用ArrayElementType元数据标签可以让你定义数组元素的数据类型。
程序代码:
[ArrayElementType("String")]
public var arrayOfStrings:Array;
[ArrayElementType("String")]
public var arrayOfStrings:Array;
[ArrayElementType("Number")]
public var arrayOfNumbers:Array;
public var arrayOfNumbers:Array;
[ArrayElementType("mx.core.UIComponent")]
public var arrayOfUIComponents:Array;
public var arrayOfUIComponents:Array;
2、[Bindable]
Bindable可以用来绑定简单数据类型、类、复杂数据类型以及函数。绑定数据的时候,你必须先使用元数据标签定义一下数据。
A simple use of [Bindable]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
backgroundColor="#FFFFFF">
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
[Bindable]
private var me:String="Rich Tretola";
]]>
</mx:Script>
<mx:Panel title="Simple Binding" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:Label text="{me}"/>
</mx:Panel>
</mx:Application>
<![CDATA[
[Bindable]
private var me:String="Rich Tretola";
]]>
</mx:Script>
<mx:Panel title="Simple Binding" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:Label text="{me}"/>
</mx:Panel>
</mx:Application>
Bindable也可以用来绑定到事件
Using [Bindable] with getters and setters
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml ">
<mx:Script>
<![CDATA[
private var _phoneNumber:String = " ";
// Bind getter function to phoneNumberChanged event
[Bindable(event="phoneNumberChanged")]
public function get phoneNumber():String
{
return _phoneNumber;
}
// Setter method.
public function set phoneNumber(value:String):void
{
if (value.length<10)
{
_phoneNumber = value;
}
else
{
_phoneNumber = phoneFormatter.format(value);
}
// Create and dispatch event
var eventObj:Event = new Event("phoneNumberChanged");
dispatchEvent(eventObj);
}
]]>
</mx:Script>
<mx:PhoneFormatter id="phoneFormatter"
formatString="(###) ###-####" validPatternChars="#-() " />
<mx:Panel title="Bind with Getters and Setters" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:TextInput id="ti1" change="phoneNumber=ti1.text" maxChars="10" restrict="0-9"/>
<mx:TextInput id="ti2" text="{phoneNumber}"/>
</mx:Panel>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml ">
<mx:Script>
<![CDATA[
private var _phoneNumber:String = " ";
// Bind getter function to phoneNumberChanged event
[Bindable(event="phoneNumberChanged")]
public function get phoneNumber():String
{
return _phoneNumber;
}
// Setter method.
public function set phoneNumber(value:String):void
{
if (value.length<10)
{
_phoneNumber = value;
}
else
{
_phoneNumber = phoneFormatter.format(value);
}
// Create and dispatch event
var eventObj:Event = new Event("phoneNumberChanged");
dispatchEvent(eventObj);
}
]]>
</mx:Script>
<mx:PhoneFormatter id="phoneFormatter"
formatString="(###) ###-####" validPatternChars="#-() " />
<mx:Panel title="Bind with Getters and Setters" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:TextInput id="ti1" change="phoneNumber=ti1.text" maxChars="10" restrict="0-9"/>
<mx:TextInput id="ti2" text="{phoneNumber}"/>
</mx:Panel>
</mx:Application>
3、[DefaultProperty]
DefaultProperty元数据标签用来将一个单一属性设定为某个类的默认属性。它允许在一个容器标签内设定属性,而不用定义属性的名字。
package comps
{
import mx.controls.Button;
[DefaultProperty("label")]
public class MyButton extends Button
{
}
}
{
import mx.controls.Button;
[DefaultProperty("label")]
public class MyButton extends Button
{
}
}
Using the MyButton class wih [DefaultProperty]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*">
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*">
<comps:MyButton>
<mx:String>Test</mx:String>
</comps:MyButton>
</mx:Application>
<mx:String>Test</mx:String>
</comps:MyButton>
</mx:Application>
4、[Embed]
Embed元数据标签用来导入图片到程序。可以通过两种方式使用Embed。你可以将图片嵌入到ActionScript中并将其指派给一个变量,或者你也可以将图片直接指派给组件的属性。
Embed元数据标签用来导入图片到程序。可以通过两种方式使用Embed。你可以将图片嵌入到ActionScript中并将其指派给一个变量,或者你也可以将图片直接指派给组件的属性。
方式一:
[Embed(source="myIcon.gif")]
[Bindable]
public var myIcon:Class;
[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}"/>
方式二:
<mx:Button label="Icon Button 1" 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类的好处是,它在一个类中只定义一次并可以绑定到程序中的多个组件。
5、[Event]
Event元数据标签用来声明那些被自定义类分派的事件。将这个元数据标签添加到类定义中之后,你就可以在MXML标签中添加事件处理函数来初始化该自定义类。
Event元数据标签用来声明那些被自定义类分派的事件。将这个元数据标签添加到类定义中之后,你就可以在MXML标签中添加事件处理函数来初始化该自定义类。
Custom ButtonLabel class using [Event]
package comps
{
import mx.controls.Button;
import flash.events.Event;
// Define the custom event
[Event(name="labelChanged", type="flash.events.Event")]
{
import mx.controls.Button;
import flash.events.Event;
// Define the custom event
[Event(name="labelChanged", type="flash.events.Event")]
public class ButtonLabel extends Button
{
// property to hold label value
private var _myLabel:String;
// public setter method
public function set myLabel(s:String):void
{
_myLabel = s;
this.label = s;
// Create and dispatch custom event
var eventObj:Event = new Event("labelChanged");
dispatchEvent(eventObj);
}
}
}
{
// property to hold label value
private var _myLabel:String;
// public setter method
public function set myLabel(s:String):void
{
_myLabel = s;
this.label = s;
// Create and dispatch custom event
var eventObj:Event = new Event("labelChanged");
dispatchEvent(eventObj);
}
}
}
Using the ButtonLabel class with the labelChanged [Event]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import flash.events.Event;
// method to handle custom event
public function labelChanged(eventObj:Event):void
{
myTA.text= myTA.text + "\n"+ eventObj.target.label;
myTA.verticalScrollPosition = myTA.verticalScrollPosition +20;
}
]]>
</mx:Script>
<mx:Panel title="Event Sample" width="500" height="275"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="absolute">
<mx:TextInput id="buttonLabelTI"
change="myButton.myLabel=buttonLabelTI.text" x="10" y="9"/>
<!--Instantiate custom class and define method to handle label- Changed event-->
<comps:ButtonLabel id="myButton" labelChanged="labelChanged(event);" x="10" y="39"/>
<mx:TextArea id="myTA" width="200" height="200" x="249" y="10"/>
</mx:Panel>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import flash.events.Event;
// method to handle custom event
public function labelChanged(eventObj:Event):void
{
myTA.text= myTA.text + "\n"+ eventObj.target.label;
myTA.verticalScrollPosition = myTA.verticalScrollPosition +20;
}
]]>
</mx:Script>
<mx:Panel title="Event Sample" width="500" height="275"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="absolute">
<mx:TextInput id="buttonLabelTI"
change="myButton.myLabel=buttonLabelTI.text" x="10" y="9"/>
<!--Instantiate custom class and define method to handle label- Changed event-->
<comps:ButtonLabel id="myButton" labelChanged="labelChanged(event);" x="10" y="39"/>
<mx:TextArea id="myTA" width="200" height="200" x="249" y="10"/>
</mx:Panel>
</mx:Application>
6、[Effect]
Effect元数据标签用来定义一个自定义效果,当某个事件发生的时候该效果会被分派。
Add the Effect metadata tag
...
// Define the custom event
[Event(name="labelChanged", type="flash.events.Event")]
[Effect(name="labelChangedEffect", event="labelChanged")]
public class ButtonLabel extends Button {
...
...
// Define the custom event
[Event(name="labelChanged", type="flash.events.Event")]
[Effect(name="labelChangedEffect", event="labelChanged")]
public class ButtonLabel extends Button {
...
Add labelChangedEffect to the Component
Instantiation MXML Tag
<comps:ButtonLabel id="myButton" labelChanged="labelChanged(event);"
labelChangedEffect="myEffect" x="10" y="39"/>
Instantiation MXML Tag
<comps:ButtonLabel id="myButton" labelChanged="labelChanged(event);"
labelChangedEffect="myEffect" x="10" y="39"/>
7、[IconFile]
IconFile是用来定义一个jpg,gif或者png文件的文件名的,它在你的自定义类中作为图标来使用。[Embed]元数据标签可以用来嵌入图片、SWF文件、音乐文件以及视频文件等,而IconFile则只是用来嵌入用来作为自定义类图标的文件。下面是一个IconFile的例子:
[IconFile("icon.png")]
public class CustomButton extends Button
{
}
IconFile是用来定义一个jpg,gif或者png文件的文件名的,它在你的自定义类中作为图标来使用。[Embed]元数据标签可以用来嵌入图片、SWF文件、音乐文件以及视频文件等,而IconFile则只是用来嵌入用来作为自定义类图标的文件。下面是一个IconFile的例子:
[IconFile("icon.png")]
public class CustomButton extends Button
{
}
8、[Inspectable]
Inspectable元数据标签可以用来定义那些能在代码提示和属性检测器(property inspector)中显示的属性。
Inspectable元数据标签可以用来定义那些能在代码提示和属性检测器(property inspector)中显示的属性。
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml ">
<mx:Script>
<![CDATA[
[Inspectable(defaultValue="Visa",
enumeration="Visa,Mastercard,Discover,American Express",
category="Credit Card", type="String")]
public var ccType:String;
]]>
</mx:Script>
</mx:HBox>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml ">
<mx:Script>
<![CDATA[
[Inspectable(defaultValue="Visa",
enumeration="Visa,Mastercard,Discover,American Express",
category="Credit Card", type="String")]
public var ccType:String;
]]>
</mx:Script>
</mx:HBox>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" >
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" >
<comps:MyComponent ccType=""/>
</mx:Application>
9、[InstanceType]
当在一个模板对象中声明一个像IDeferredInstance这样的变量时,InstanceType元数据标签就用来声明对象的类型。
用法:
[InstanceType("package.className")]
10、[NonCommittingChangeEvent]
NonCommittingChangeEvent元数据标签在某个特定事件发生的时候可以防止变量在事件发生的过程中被更改。
Using [NonCommittingChangeEvent]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
backgroundColor="#FFFFFF">
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
import flash.events.Event;
private var eventObj:Event;
[Bindable(event="triggerBinding")]
[NonCommittingChangeEvent("change")]
private var s:String;
private function triggerBinding():void
{
eventObj = new Event("triggerBinding");
dispatchEvent(eventObj);
}
]]>
</mx:Script>
<mx:Panel title="NonCommittingChangeEvent Sample" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:TextInput id="ti1" change="s=ti1.text" enter="triggerBinding()"/>
<mx:TextInput id="ti2" text="{s}" />
<![CDATA[
import flash.events.Event;
private var eventObj:Event;
[Bindable(event="triggerBinding")]
[NonCommittingChangeEvent("change")]
private var s:String;
private function triggerBinding():void
{
eventObj = new Event("triggerBinding");
dispatchEvent(eventObj);
}
]]>
</mx:Script>
<mx:Panel title="NonCommittingChangeEvent Sample" width="500" height="90"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<mx:TextInput id="ti1" change="s=ti1.text" enter="triggerBinding()"/>
<mx:TextInput id="ti2" text="{s}" />
</mx:Panel>
</mx:Application>
11、[RemoteClass]
RemoteClass 可以用来将一个ActionScript类绑定到一个Java类或一个ColdFusion CFC。这样做可以自动转换数据类型。下面的例子将包com.mydomain中的名为MyClass的ActionScript类绑定到了同一个包中名为MyClass的Java类:
RemoteClass 可以用来将一个ActionScript类绑定到一个Java类或一个ColdFusion CFC。这样做可以自动转换数据类型。下面的例子将包com.mydomain中的名为MyClass的ActionScript类绑定到了同一个包中名为MyClass的Java类:
package com.mydomain
{
[Bindable]
[RemoteClass(alias="com.mydomain.MyClass")]
public class MyClass
{
public var id:int;
{
[Bindable]
[RemoteClass(alias="com.mydomain.MyClass")]
public class MyClass
{
public var id:int;
public var myText:String;
}
}
}
12、[Style]
Style元数据标签用来为组件定义自定义样式属性的。只需要简单地将Sytle元数据标签添加到类的定义当然,然后就可以使用getSytle方法获取它的值了。
Custom Class CustomCircle using [Style] tags
package comps
{
import mx.core.UIComponent;
[Style(name="borderColor",type="uint",format="Color",inherit="no")]
[Style(name="fillColor",type="uint",format="Color",inherit="no")]
public class CustomCircle extends UIComponent
{
public function CustomCircle()
{
super();
}
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
graphics.lineStyle(1, getStyle("borderColor"), 1.0);
graphics.beginFill(getStyle("fillColor"),1.0);
graphics.drawEllipse(0,0,100,100);
}
}
}
package comps
{
import mx.core.UIComponent;
[Style(name="borderColor",type="uint",format="Color",inherit="no")]
[Style(name="fillColor",type="uint",format="Color",inherit="no")]
public class CustomCircle extends UIComponent
{
public function CustomCircle()
{
super();
}
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
graphics.lineStyle(1, getStyle("borderColor"), 1.0);
graphics.beginFill(getStyle("fillColor"),1.0);
graphics.drawEllipse(0,0,100,100);
}
}
}
Using CustomCircle and assigning custom style properties
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" backgroundColor="#FFFFFF">
<mx:Panel title="Style Sample" width="200" height="200"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<comps:CustomCircle borderColor="#000000" fillColor="#FF0000" />
</mx:Panel>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
xmlns:comps="comps.*" backgroundColor="#FFFFFF">
<mx:Panel title="Style Sample" width="200" height="200"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom=" 10" layout="horizontal">
<comps:CustomCircle borderColor="#000000" fillColor="#FF0000" />
</mx:Panel>
</mx:Application>
发表评论
-
Flex中限制TextInput输入
2011-09-01 15:18 16011. 限制某个字符的输入,用符号 ^ 跟上要 ... -
Flex Event中属性currentTarget与target的区别
2011-05-04 11:12 1161- 官方解释 currentTarget是事件的处理对 ... -
Flex用BlazeDS与JAVA交互
2010-11-26 14:50 1734以前我整FLEX项目时都是用MYECLIPSE的,FLEX代码 ... -
FLEX嵌入HTML或JSP
2010-11-20 17:41 3554跟JAVA使用外部框架一样首先得下载JAR包,不过FLEX不是 ... -
flex 滚动信息(类似struts2的marquee)
2010-11-15 15:07 2843FLEX的滚动信息制做,类似STRUTS2里面的marquee ... -
FLEX中显示类型为BMP的图片
2010-09-21 15:55 1376FLEX的Image控件是不能直接显示BMP图片的,要进过一些 ... -
Flex中Image加载图片出错时显示默认图片的几种方法&url中文问题
2010-09-07 10:48 2118Flex中Image加载图片出错时显示默认图片的方法主要有以下 ... -
Flex程序开发心得小结
2010-08-24 10:02 977在Flex的帮助手册中,有一个专门的章节讲了程序的优化,下面是 ... -
Flex 搜索定位DataGrid里的数据
2009-12-17 13:07 2747实现的功能: 在输入框中输入你要找的城市(city)名,点击 ... -
过滤筛选DataGrid里的数据
2009-12-16 15:14 1294<?xml version="1.0" ... -
Flex里解析XML数据
2009-12-16 10:07 2992我加了附件,里面是整个工程FLEX+WEB,包括JAR包,只要 ... -
webService+flex
2009-12-01 12:23 2320下面是 webService+Flex 项目的主要 ... -
一些FLEX的试题
2009-11-30 18:03 16091. 使用Flex Bulider3 建立一下新的.mxm ... -
兴趣的RIA
2009-11-27 22:21 1147RIA的定义 有人预言,2008年将是RIA技术竞争非常激 ... -
flex Random() 随机
2009-11-27 22:18 1844flex的一些函数随机数random(),round(),ce ... -
MXML里跳页面
2009-11-27 22:11 1829<?xml version="1.0" ... -
Flex中trace()
2009-11-27 21:44 2933Flex中trace()调试时flash player版本问题 ... -
MyEclipse+Flex
2009-11-26 21:43 3925在MyEclipse下配置Flex 新建一个简单的Flex+ ... -
利用MyEclipse搭建企业级Flex开发环境
2009-11-25 21:59 2643初学FLEX建议大家看一下我的更一个文章《MyEclipse+ ...
相关推荐
Flex 中的元数据标签的用法和详细介绍
flex as3 元数据标签综合 flex as3 元数据标签综合 flex as3 元数据标签综合
Flex 2 中的元数据标签
flex标签flex标签flex标签flex标签flex标签flex标签flex标签
Flex 3D云标签 源代码
Flex 3D标签云 Flex实现3d FlexCumulusTagCloud Flex学习3d教程 flex builder 如何做出3D标签云
抓取AMF协议的flex页面,支持模拟登录和页面抓取。
Flex 标签云 特效 漂亮 Flex 标签云 特效 漂亮
flex数据绑定的原理
Flex 本地数据共享与压缩存储,因为flex本地共享空间存储数据有限,在面对大数据,如xml或大数组存储时,我们可能要考虑对数据进行压缩后再存;本类以xmllist 数据为例来进行压缩存储;
一个flex写的实现数据表格datagrid的实例。
flex 表单数据合法性验证flex 表单数据合法性验证flex 表单数据合法性验证flex 表单数据合法性验证
flex数据交互_方式
flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图...
Flex Builder数据可视化应用开发(英文)
Flex与java交换数据 Flex数据交换 Flex与java交换数据教程。
FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效
Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex ...
flex olap 数据展现 ,样例代码.