有道是:”出來(lái)混的,遲早都要還的~” [原文出自-無(wú)間道],前幾天答應(yīng) Flex 班上同學(xué)要幫他在 Blog 上寫如何使用 TreeControl ,說(shuō)到總是要做到,所以趕快在今天先寫一個(gè)最基礎(chǔ)的 Tree Control 的用法,再陸續(xù)補(bǔ)完使用技巧跟事件整合的部份。
說(shuō)到 Controls 就會(huì)想到它的資料來(lái)源 dataProvider ,每一種 Controls 所使用的資料來(lái)源皆不相同,有的用ArrayCollection 有的用 Object ,而 Tree 則使用了最容易表現(xiàn)資料樹狀結(jié)構(gòu)的 XML 資料,當(dāng)然其他 XML系列的例如 XMLList 也是可以作為資料來(lái)源的,接下來(lái)我們來(lái)示範(fàn)一下該如何將一個(gè) XML 的資料當(dāng)作 Tree Control 的資料來(lái)源。

像是這樣的樹狀組織結(jié)構(gòu)就還蠻適合用 Tree 來(lái)表示的,這時(shí)只要做一個(gè) XML 的資料給他就可以了,你可以獨(dú)立產(chǎn)生一個(gè) XML的檔案,再?gòu)耐獠孔x入進(jìn)來(lái),或者是直接在 Flex 中使用 <mx:XML> 標(biāo)籤來(lái)描述這些資料,在這篇中我們選用<mx:XML> 的方式來(lái)形容樹狀結(jié)構(gòu),其寫法可寫為:
<mx:XML id="treeData">
<node label="公司組織">
<node label="行銷部">
<node label="行銷處長(zhǎng)"/>
<node label="行銷經(jīng)理"/>
<node label="行銷專員"/>
</node>
<node label="資訊部">
<node label="資訊處長(zhǎng)"/>
<node label="資訊經(jīng)理"/>
</node>
</node>
</mx:XML>
描寫完再交由 Tree 來(lái) Binding 就可以了,怎麼樣,夠簡(jiǎn)單吧,由於我們要取用的資料是 <node> 中的 label 屬性,所以要記得用 labelField 來(lái)指定 label 要呈現(xiàn)的什麼資料,資料提供方法如下:
<mx:Tree x="28" y="27" dataProvider="{treeData}" showRoot="true"
labelField="@label" width="151" height="197"/>
完成後就有一個(gè)動(dòng)態(tài)展開和收合的 Tree 可以用了,最近實(shí)在是太忙了,今天先寫到這裡下次再回頭探討 Tree 的事件。
p.s. 至少我先把債環(huán)了…. *笑*
不過(guò)還有一個(gè)多執(zhí)行緒的問題還沒解答,好,下次來(lái)優(yōu)先處理這個(gè)問題。