有 道是:”出來混的，遲早都要還的~” [原文出自-無間道]，前幾天答應(yīng) Flex 班上同學(xué)要幫他在 Blog 上寫如何使用 Tree Control ，說到總是要做到，所以趕快在今天先寫一個最基礎(chǔ)的 Tree Control 的用法，再陸續(xù)補完使用技巧跟事件整合的部份。

說到 Controls 就會想到它的資料來源 dataProvider ，每一種 Controls 所使用的資料來源皆不相同，有的用 ArrayCollection 有的用 Object ，而 Tree 則使用了最容易表現(xiàn)資料樹狀結(jié)構(gòu)的 XML 資料，當(dāng)然其他 XML 系列的例如 XMLList 也是可以作為資料來源的，接下來我們來示範(fàn)一下該如何將一個 XML 的資料當(dāng)作 Tree Control 的資料來源。

像是這樣的樹狀組織結(jié)構(gòu)就還蠻適合用 Tree 來表示的，這時只要做一個 XML 的資料給他就可以了，你可以獨立產(chǎn)生一個 XML 的檔案，再從外部讀入進來，或者是直接在 Flex 中使用 <mx:XML> 標(biāo)籤來描述這些資料，在這篇中我們選用 <mx:XML> 的方式來形容樹狀結(jié)構(gòu)，其寫法可寫為：


 <mx:XML id="treeData">
  <node label="公司組織">
   <node label="行銷部">
    <node label="行銷處長"/>
    <node label="行銷經(jīng)理"/>
       <node label="行銷專員"/>
   </node>
   <node label="資訊部">
       <node label="資訊處長"/>
       <node label="資訊經(jīng)理"/>
   </node>
  </node>
    </mx:XML>

描寫完再交由 Tree 來 Binding 就可以了，怎麼樣，夠簡單吧，由於我們要取用的資料是 <node> 中的 label 屬性，所以要記得用 labelField 來指定 label 要呈現(xiàn)的什麼資料，資料提供方法如下：


<mx:Tree x="28" y="27" dataProvider="{treeData}" showRoot="true"
  labelField="@label" width="151" height="197"/>

完成後就有一個動態(tài)展開和收合的 Tree 可以用了，最近實在是太忙了，今天先寫到這裡下次再回頭探討 Tree 的事件。

p.s. 至少我先把債環(huán)了…. *笑*
不過還有一個多執(zhí)行緒的問題還沒解答，好，下次來優(yōu)先處理這個問題。