flex 綁定元數(shù)據(jù)
更新時間:2009年05月31日 01:23:55 作者:
這篇文章算是flex初學者的的筆記吧,首先可以概覽一下下文中的代碼,然后我們主要是看看[Bindable]的這種用法。
這是一種將圖片或者flash綁定為數(shù)據(jù)的方法。在代碼中:
[Bindable]
[Embed("assets/closed.png")]
public var myFolderClosedIcon:Class;
這三行代碼是將clsed.png綁定為可用是數(shù)據(jù)。
其中[Embed(...)]是叫做”元數(shù)據(jù)”
注意,需要緊跟著要聲明一個class變量,這個class在隨后的代碼中就代表了closed.png這個元素。
最后看看在mxml中的調(diào)用:
folderClosedIcon=”{myFolderClosedIcon}”
我們看到在Tree組件中,直接調(diào)用了這個類作為tree中節(jié)點閉合時前面的ico圖標。
要綁定元數(shù)據(jù)還可以使用”元標簽”[mx:Metadata]
本文分析的代碼如下:[此段代碼的作用是改變Tree組件的列表圖標ICO]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
[Bindable]
[Embed("http://longstep.cn/closed.png")]
public var myFolderClosedIcon:Class;
[Bindable]
[Embed("http://longstep.cn/opened.png")]
public var myFolderOpenIcon:Class;
[Bindable]
[Embed("http://longstep.cn/pdf.png")]
public var pdfIcon:Class;
[Bindable]
[Embed("http://longstep.cn/doc.png")]
public var docIcon:Class;
]]>
</mx:Script>
<mx:XML id="xmlData" xmlns="">
<rootNode>
<directory label="dir">
<file icon="pdfIcon" label="label1" />
<file icon="docIcon" label="label2" />
</directory>
<directory label="dir1">
<file icon="pdfIcon" label="label3" />
<file icon="docIcon" label="label4" />
</directory>
</rootNode>
</mx:XML>
<mx:Panel title="Tree">
<mx:Tree
borderStyle="none"
backgroundAlpha="0"
labelField="@label"
iconField="@icon"
width="300"
height="200"
id="treeAdmin"
folderOpenIcon="{myFolderOpenIcon}"
folderClosedIcon="{myFolderClosedIcon}"
dataProvider="{xmlData.directory}" alpha="1" />
</mx:Panel>
</mx:Application>
[Bindable]
[Embed("assets/closed.png")]
public var myFolderClosedIcon:Class;
這三行代碼是將clsed.png綁定為可用是數(shù)據(jù)。
其中[Embed(...)]是叫做”元數(shù)據(jù)”
注意,需要緊跟著要聲明一個class變量,這個class在隨后的代碼中就代表了closed.png這個元素。
最后看看在mxml中的調(diào)用:
folderClosedIcon=”{myFolderClosedIcon}”
我們看到在Tree組件中,直接調(diào)用了這個類作為tree中節(jié)點閉合時前面的ico圖標。
要綁定元數(shù)據(jù)還可以使用”元標簽”[mx:Metadata]
本文分析的代碼如下:[此段代碼的作用是改變Tree組件的列表圖標ICO]
復制代碼 代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
[Bindable]
[Embed("http://longstep.cn/closed.png")]
public var myFolderClosedIcon:Class;
[Bindable]
[Embed("http://longstep.cn/opened.png")]
public var myFolderOpenIcon:Class;
[Bindable]
[Embed("http://longstep.cn/pdf.png")]
public var pdfIcon:Class;
[Bindable]
[Embed("http://longstep.cn/doc.png")]
public var docIcon:Class;
]]>
</mx:Script>
<mx:XML id="xmlData" xmlns="">
<rootNode>
<directory label="dir">
<file icon="pdfIcon" label="label1" />
<file icon="docIcon" label="label2" />
</directory>
<directory label="dir1">
<file icon="pdfIcon" label="label3" />
<file icon="docIcon" label="label4" />
</directory>
</rootNode>
</mx:XML>
<mx:Panel title="Tree">
<mx:Tree
borderStyle="none"
backgroundAlpha="0"
labelField="@label"
iconField="@icon"
width="300"
height="200"
id="treeAdmin"
folderOpenIcon="{myFolderOpenIcon}"
folderClosedIcon="{myFolderClosedIcon}"
dataProvider="{xmlData.directory}" alpha="1" />
</mx:Panel>
</mx:Application>
相關文章
Flex Gumbo 通過textJustify樣式設置TextBox文字對齊的例子
接下來的例子演示了Flex Gumbo中如何通過textJustify樣式,設置TextBox文字對齊。2009-06-06