第10使用列表和表格

1、第10章 使用列表和表格用戶界面中，常利用表格和列表顯示數(shù)據(jù)的條目和詳細(xì)信息。flex設(shè)計(jì)了不同的控件來(lái)實(shí)現(xiàn)列表和表格，不僅能夠?qū)?shù)據(jù)顯示在表格和列表中，還可以實(shí)現(xiàn)對(duì)數(shù)據(jù)進(jìn)行操縱、修改等更為強(qiáng)大的功能。由于這些控件的數(shù)據(jù)格式都需是格式化的數(shù)據(jù)，數(shù)據(jù)提供器讀取結(jié)構(gòu)化的數(shù)據(jù)，這些控件也稱之為數(shù)據(jù)驅(qū)動(dòng)控件（data-driven controls）。與列表和表格相關(guān)的控件如下所示。列表控件（list control）：將數(shù)據(jù)顯示在垂直的列表中。水平列表控件（horizontallist control）：與列表控件相似，水平列表控件則是以水平的方式橫向?yàn)g覽數(shù)據(jù)。片式列表控件（tilelist con

2、trol）：與上述2種列表控件類似，片式列表中不僅可以顯示文字、數(shù)據(jù)，還可以顯示該數(shù)據(jù)相關(guān)的圖片。組合框控件（combobox control）與其他列表式控件不同，組合框控件只需占用很少的界面控件，單擊控件中的下拉箭頭，可動(dòng)態(tài)彈出列表欄選擇需要的數(shù)據(jù)選項(xiàng)。數(shù)據(jù)表格控件（datagrid control）對(duì)于某一類數(shù)據(jù)，往往包括很多數(shù)據(jù)項(xiàng)，比如一個(gè)學(xué)生的數(shù)據(jù)包括：年齡、性別、出生年月等，利用數(shù)據(jù)表格控件，可以以行和列的方式表達(dá)多個(gè)學(xué)生的詳細(xì)信息。樹形控件（tree control）：將結(jié)構(gòu)化的數(shù)據(jù)顯示到樹形的結(jié)構(gòu)中。在樹形控件中的，利用樹形的葉子節(jié)點(diǎn)以及葉子節(jié)點(diǎn)的雙親節(jié)點(diǎn)表示數(shù)據(jù)之間的關(guān)聯(lián)。1

3、0.1 列表和表格控件接口類 上述幾種控件在flex中，都同樣直接或間接地繼承mx.controls.listclasses.listbase類。所以在這些控件中均繼承該類的屬性和事件。本節(jié)簡(jiǎn)要介紹listbase類屬性和方法。10.1.1 listbase類屬性listbase類的屬性主要圍繞控件的行、列、數(shù)據(jù)和控件其他功能。由于屬性較多，這里只選擇常用的進(jìn)行講述。listbase類常用屬性如表所示。10.1.2 listbase類事件listbase類事件是使用列表和表格控件時(shí)涉及的相關(guān)事件，具體有如下幾種：change：當(dāng)控件的selectedindex和selecteditem屬性值發(fā)

4、生改變時(shí)，觸發(fā)該事件。datachange：在使用其他組件作為控件的條目渲染器時(shí)，利用data屬性指定在控件中顯示的內(nèi)容，當(dāng)該內(nèi)容改變時(shí)觸發(fā)該事件。itemclick：當(dāng)用戶單擊條目時(shí)，觸發(fā)該事件。itemdoubleclick：當(dāng)用戶雙擊條目時(shí)，觸發(fā)該事件。itemrollout：當(dāng)鼠標(biāo)在條目上滾動(dòng)時(shí)，觸發(fā)該事件。itemrollover：當(dāng)鼠標(biāo)停留在某個(gè)條目上，觸發(fā)該事件。每次鼠標(biāo)停留在條目上時(shí)，控件高亮顯示該條目。10.2 列表 列表控件（list control）將數(shù)據(jù)顯示在垂直的列表中。用戶在顯示的數(shù)據(jù)條目中選擇自己需要列項(xiàng)。如果列表數(shù)據(jù)的尺寸超出控件的尺寸時(shí)?？梢酝蟿?dòng)控件中的水平或

5、者垂直的滾動(dòng)條顯示。列表控件如圖所示。10.2.1 列表控件標(biāo)簽 在flex中使用標(biāo)簽創(chuàng)建列表控件。同時(shí)列表控件的外觀及事件都是由控件的屬性定義。列表控件的屬性除集成listbase類的屬性外，還包括如表所示的常用屬性。10.2.2 列表控件事件列表控件的事件除繼承l(wèi)istbase類的事件外還包括條目編輯時(shí)的事件。條目編輯事件如下所示：itemeditbegin：當(dāng)對(duì)條目進(jìn)行編輯，即editeditemposition屬性被賦值時(shí)，觸發(fā)該事件。該事件表明條目處于準(zhǔn)備被編輯的狀態(tài)。itemeditbeginning：用戶單擊條目時(shí)進(jìn)入itemeditbegin狀態(tài)，在用戶釋放鼠標(biāo)時(shí)，觸發(fā)該事件，

6、進(jìn)入條目編輯狀態(tài)。itemeditend：完成條目編輯。當(dāng)編輯后的數(shù)據(jù)從條目編輯器中保存到數(shù)據(jù)提供器中時(shí)，觸發(fā)該事件。itemfocusin：當(dāng)鼠標(biāo)焦點(diǎn)停留在條目渲染器時(shí)，觸發(fā)該事件。itemfocusout：當(dāng)條目渲染器失去鼠標(biāo)焦點(diǎn)時(shí)，觸發(fā)該事件。scroll：如果控件中出現(xiàn)滾動(dòng)條，則拖動(dòng)滾動(dòng)條時(shí)觸發(fā)該事件。上述幾個(gè)事件的事件對(duì)象類型均為mx.events.listevent。10.2.3 創(chuàng)建列表控件 創(chuàng)建列表控件使用的是標(biāo)簽。通過為列表控件設(shè)置不同的屬性和事件滿足不同的需求。為了更清楚的講述如何創(chuàng)建控件，如何使用控件的事件和更復(fù)雜的屬性。這里采用由淺至深的順序，首先從最簡(jiǎn)單的例子講述。1

7、0.2.4 列表控件事件定義列表控件事件是為與列表控件相關(guān)的事件創(chuàng)建事件處理函數(shù)。上面的兩個(gè)例子為簡(jiǎn)單的列表控件例子，只顯示需要的數(shù)據(jù)標(biāo)簽，而無(wú)其他功能。但是在實(shí)際需求中，在用單擊相應(yīng)條目時(shí)，或者當(dāng)鼠標(biāo)在各條目上滾動(dòng)時(shí)，都需要與用戶進(jìn)行交互。下面的這個(gè)例子顯示了，當(dāng)鼠標(biāo)在列表?xiàng)l目上滾動(dòng)時(shí)顯示條目的data值，在單擊條目時(shí)，彈出對(duì)話框顯示用戶選中條目?jī)?nèi)容。圖為鼠標(biāo)在條目上滾動(dòng)的效果，圖為單擊相應(yīng)數(shù)據(jù)條目時(shí)，顯示彈出對(duì)話框。10.3 列表控件中操作 在使用列表控件的過程還可以對(duì)列表控件相應(yīng)的操作，主要包括顯式提示、使用圖標(biāo)、編輯列表?xiàng)l目中數(shù)據(jù)。下面逐一介紹這些操作。10.3.1 使用數(shù)據(jù)提示在使用

8、列表過程中，當(dāng)鼠標(biāo)停留在條目上時(shí)，可以顯示該條目的相關(guān)數(shù)據(jù)提示。當(dāng)利用滾動(dòng)條時(shí)，可以顯示滾動(dòng)條的相關(guān)提示。在列表控件中使用showdatatips和showscrolltips屬性指明是否顯示條目提示和滾動(dòng)條提示。當(dāng)showdatatips為true時(shí)，鼠標(biāo)在每行的條目上停留時(shí)，都會(huì)顯示該條目的提示。默認(rèn)情況下顯示的是數(shù)據(jù)label屬性中的內(nèi)容。如果需要讀取數(shù)據(jù)中其他屬性的內(nèi)容，可以使用datatipfield屬性指定顯示的內(nèi)容。如果上述2種仍然不能滿足要求，可以使用datatipfunction屬性指明定義顯示內(nèi)容的方法，datatipfunction屬性方法的格式如下所示。mydatati

9、pfunction(item:object):string /定義方法的內(nèi)容return 顯示的內(nèi)容 10.3.2 在列表控件中使用圖標(biāo)上面的例子都是在列表的條目中顯示單一的文字，如果能為數(shù)據(jù)配上圖標(biāo)，那么就可以更形象表達(dá)數(shù)據(jù)。而列表控件提供了為數(shù)據(jù)項(xiàng)顯式圖標(biāo)的功能。在列表控件中，可以使用iconfield和iconfunction屬性定義圖標(biāo)相關(guān)的屬性以及方法。iconfield屬性指明在數(shù)據(jù)中圖標(biāo)文件的地址是由哪項(xiàng)數(shù)據(jù)提供的。圖為一個(gè)在列表控件中顯示數(shù)據(jù)項(xiàng)圖標(biāo)的例子。10.3.3 編輯列表?xiàng)l目中數(shù)據(jù)編輯列表中的數(shù)據(jù)時(shí)，需要將editable屬性設(shè)為true。在編輯數(shù)據(jù)的時(shí)候也觸發(fā)相應(yīng)的事件

10、。圖是一個(gè)編輯數(shù)據(jù)的例子，當(dāng)鼠標(biāo)單擊條目時(shí)，觸發(fā)itemeditbeginning事件條目顯示為一個(gè)文本輸入控件，在控件中可以修改文字。當(dāng)修改完畢后，鼠標(biāo)單擊條目之外的區(qū)域時(shí)觸發(fā)itemeditend事件，條目顯示為編輯后的文字。單擊該條目，在控件下方的文本區(qū)域顯示當(dāng)前條目的標(biāo)簽，如圖所示10.4 水平列表水平列表控件（horizontallist control）與列表控件的不同點(diǎn)在于，列表控件以垂直的方式顯示數(shù)據(jù)條目，水平列表控件使用水平方向顯示數(shù)據(jù)條目。如果只在列表中使用文字，則水平列表與列表控件的創(chuàng)建方式一樣的。但在實(shí)際的應(yīng)用中，水平列表控件較常用來(lái)表示圖片，例如相冊(cè)中圖片的顯示、產(chǎn)品

11、圖片的展示等。在水平斜砜丶校蓯譴幼蟮接蟻允咎蹌康摹如果列表項(xiàng)超出控件的范圍，可以利用滾動(dòng)條查看剩余的條目。圖是一個(gè)展示手機(jī)圖片的水平列表控件。10.4.1 水平列表控件標(biāo)簽 水平列表控件對(duì)應(yīng)的mxml標(biāo)簽為，該控件的屬性繼承l(wèi)istbase類的屬性。屬性和事件都可以參照列表控件的屬性。10.4.2 創(chuàng)建水平列表控件在創(chuàng)建水平列表控件時(shí)，只需插入控件的標(biāo)簽，定義相應(yīng)的屬性和事件即可。下面以圖為例介紹簡(jiǎn)單的水平列表創(chuàng)建。圖片的顯示是借助圖片控件（image control）實(shí)現(xiàn)的。水平列表控件利用條目渲染器將圖片控件嵌入其中。圖的代碼如下所示。 10.4.3 使用條目渲染器 上面的例子采用在條目中

12、完全顯示圖片的方式.有時(shí)，也需要為圖片配上說明文字。若要實(shí)現(xiàn)圖片和文字同時(shí)顯示，也需要使用條目渲染器。由于需要將文字和圖片顯示在同一區(qū)域內(nèi)，只能自己定制組件，再將組件嵌入到控件中，效果如圖所示。10.5 瓦片式列表 瓦片式列表控件（tilelist control）的外觀與水平列表控件的外觀相似。水平列表控件常用于在條目中同時(shí)顯示圖片和文字，而瓦片式列表控件中每個(gè)條目像瓦片一樣陳列中控件區(qū)域中。瓦片式控件的可以多行顯示，而與水平列表控件只能單行顯示。圖為瓦片式列表控件的一個(gè)例子。10.5.1 瓦片列表控件標(biāo)簽 瓦片列表控件對(duì)應(yīng)的標(biāo)簽為，控件的屬性和事件可以使用列表控件的屬性和事件設(shè)定。該控件默

13、認(rèn)的條目渲染器為tilelistitemrenderer。10.5.2 創(chuàng)建瓦片列表控件創(chuàng)建該控件時(shí)，方法與創(chuàng)建水平列表控件類似。在使用圖形和文字時(shí)可以使用默認(rèn)的條目渲染器，也可以根據(jù)需要自己定義條目渲染器。首先介紹默認(rèn)的條目渲染器tilelistitemrenderer。它包括兩個(gè)屬性：icon和text。icon屬性定義條目渲染器中的圖標(biāo)，text屬性定義了條目渲染器中的文字。在圖中使用了默認(rèn)的條目渲染器時(shí)圖標(biāo)在上，文字在圖標(biāo)下方。在使用默認(rèn)條目渲染器時(shí)，tilelistitemrenderer自動(dòng)讀取數(shù)據(jù)中text和icon屬性值。10.6 數(shù)據(jù)表格利用表格中行和列表示數(shù)據(jù)也是用戶常用的

14、界面元素。在flex中，使用數(shù)據(jù)表格控件（datagrid control）可以實(shí)現(xiàn)在表格中顯式數(shù)據(jù)的功能。數(shù)據(jù)表格控件可以看做使用多列條目的列表來(lái)表示數(shù)據(jù)。實(shí)際上，在表格控件中是利用行和列來(lái)確定數(shù)據(jù)中的元素。數(shù)據(jù)表格控件也是建立在列表控件基礎(chǔ)上，所以列表控件中的許多特性可在數(shù)據(jù)表格控件上體現(xiàn)。除此之外，數(shù)據(jù)表格控件還具有其他功能，如下所示。編輯表格中的數(shù)據(jù)元素。在運(yùn)行時(shí)對(duì)表格中的數(shù)據(jù)進(jìn)行排序。單擊表頭改變數(shù)據(jù)的排列順序。支持自定義的表格列表。10.6.1 數(shù)據(jù)表格控件標(biāo)簽 數(shù)據(jù)表格控件對(duì)應(yīng)的mxml標(biāo)簽為。該控件的屬性除繼承l(wèi)istbase類的屬性外，還包括一些常用屬性，如表所示。10.6.

15、2 數(shù)據(jù)表格列項(xiàng) 由于在數(shù)據(jù)表格中增加了列項(xiàng)（columns）來(lái)表達(dá)數(shù)據(jù)，所以控件需增加相應(yīng)的屬性來(lái)描述列以及列數(shù)據(jù)上發(fā)生的事件。 在flex中，數(shù)據(jù)表格列項(xiàng)也是作為一種控件出現(xiàn)的。它對(duì)應(yīng)的mxml標(biāo)簽為，在該標(biāo)簽內(nèi)可以定義與該列相關(guān)的內(nèi)容，如該列表頭元素的標(biāo)簽等。它的一部分于屬性與數(shù)據(jù)列表控件中的是一致的，如editable屬性。數(shù)據(jù)表格控件中的editable屬性為全局屬性。只有該屬性為true時(shí)，在列項(xiàng)控件中定義editable屬性為true或者false時(shí)才有效。10.6.3 數(shù)據(jù)列表控件事件數(shù)據(jù)列表控件中的事件除繼承l(wèi)istbase類中的事件外，還包括如下幾個(gè)事件：columnstr

16、etch：用戶改變某一行的高度時(shí)，觸發(fā)該事件。如果控件不允許使用滾動(dòng)條，在改變某一行高度的同時(shí)，其他行也進(jìn)行收縮，以顯示在控件區(qū)域內(nèi)。headerrelease：在用戶單擊表頭對(duì)表項(xiàng)排序后，釋放鼠標(biāo)按鍵時(shí)，觸發(fā)該事件。只有控件允許排序，該事件才處于可觸發(fā)的狀態(tài)。headershift：當(dāng)單擊表頭排序后，表中的行移至其他位置，順序發(fā)生改變時(shí)觸發(fā)該事件。itemeditbegin：當(dāng)對(duì)于條目進(jìn)行編輯，即editeditemposition屬性被賦值時(shí)，觸發(fā)該事件。itemeditbeginning：用戶單擊條目時(shí)進(jìn)入itemeditbegin狀態(tài)，在用戶釋放鼠標(biāo)時(shí)，觸發(fā)該事件。itemediten

17、d：完成條目編輯。當(dāng)編輯后的數(shù)據(jù)從條目編輯器中保存到數(shù)據(jù)提供器中時(shí)，觸發(fā)該事件。itemfocusin：鼠標(biāo)焦點(diǎn)停留在條目渲染器時(shí)，觸發(fā)該事件。itemfocusout：條目渲染器失去鼠標(biāo)焦點(diǎn)時(shí)，觸發(fā)該事件。10.6.4 創(chuàng)建數(shù)據(jù)列表控件 創(chuàng)建數(shù)據(jù)列表時(shí)，在代碼中插入標(biāo)簽，定義標(biāo)簽的屬性和控件的事件后，還需定義每列數(shù)據(jù)顯示的詳細(xì)信息。下面以圖為例介紹創(chuàng)建列表控件的過程。該例使用xmllist格式的數(shù)據(jù)。在數(shù)據(jù)列表控件中也可以使用其他的層次化數(shù)據(jù)格式，詳細(xì)情況可以查看數(shù)據(jù)篇中的相應(yīng)內(nèi)容。10.6.5 定義數(shù)據(jù)表格控件事件 在數(shù)據(jù)表格中顯示數(shù)據(jù)后，往往需要對(duì)用戶在表格上的操作做出響應(yīng)。常用的事件為

18、單擊表格項(xiàng)（itemclick）事件。在圖中當(dāng)用戶單擊數(shù)據(jù)項(xiàng)，在控件下方的文本區(qū)域顯示具體信息。10.6.6 編輯數(shù)據(jù)表格中的數(shù)據(jù)項(xiàng)編輯數(shù)據(jù)表格中的數(shù)據(jù)項(xiàng)，需要將控件的editable屬性設(shè)為true。如果在中將屬性設(shè)為true，整個(gè)控件的數(shù)據(jù)都可以進(jìn)行編輯。但有些時(shí)候，有的條目是不能被更改的，如員工的姓名等。對(duì)于不能更改的條目，在內(nèi)將editable屬性設(shè)為false。圖中允許對(duì)表格內(nèi)數(shù)據(jù)編輯，但是禁止對(duì)姓名和性別進(jìn)行編輯。10.6.7 對(duì)數(shù)據(jù)表格控件中數(shù)據(jù)排序?qū)?shù)據(jù)表格控件中數(shù)據(jù)排序是通過單擊數(shù)據(jù)項(xiàng)的表頭實(shí)現(xiàn)的。默認(rèn)為升序或者降序排列該表頭下的內(nèi)容。排序的過程實(shí)際上只是改變數(shù)據(jù)在控件中的外

19、部表現(xiàn)，并沒有改變其在原始數(shù)據(jù)文件中的位置。排列的順序根據(jù)表格控件中相應(yīng)的屬性進(jìn)行。在數(shù)據(jù)表格控件中sortablecolumns屬性指明是否允許排序，默認(rèn)值為true。在列項(xiàng)控件中使用sortable定義該列的數(shù)據(jù)是否參與排序。設(shè)定sortable屬性后，該列的排序使用默認(rèn)的排序方式。如果需要自定義排序方式，可以使用sortcomparefunction指定排序的方法，編寫該方法時(shí)采用固定的結(jié)構(gòu)，如下所示。mysortcomparefunction(obj1:object, obj2:object):int /定義排序的方式return 序號(hào)10.7 樹形控件樹形控件用來(lái)表示結(jié)構(gòu)化的數(shù)據(jù)。在

20、樹形結(jié)構(gòu)中包括葉子（leaf）節(jié)點(diǎn)和樹枝（branch）節(jié)點(diǎn)。其中樹枝節(jié)點(diǎn)還可以包含葉子節(jié)點(diǎn)，而葉子節(jié)點(diǎn)不可以再分解。在樹形控件中，葉子節(jié)點(diǎn)用文本圖標(biāo)進(jìn)行標(biāo)識(shí)，而樹枝節(jié)點(diǎn)使用文件夾圖標(biāo)，類似于windows中的文件夾圖標(biāo)。圖是一個(gè)樹形控件，它顯示了某個(gè)文件的目錄。10.7.1 樹形控件標(biāo)簽 樹形控件對(duì)應(yīng)的mxml標(biāo)簽為，該控件的屬性除繼承l(wèi)istbase類的屬性外，常用屬性如表所示。10.7.2 樹形控件事件 在樹形控件中，除發(fā)生change之類listbase中的事件外，單擊打開樹枝節(jié)點(diǎn)、關(guān)閉樹枝節(jié)點(diǎn)等都會(huì)觸發(fā)相應(yīng)的事件。常用的事件如下。 itemclose：當(dāng)閉合樹枝節(jié)點(diǎn)時(shí)，觸發(fā)該事件。

21、itemopen：當(dāng)樹枝節(jié)點(diǎn)打開或者展開時(shí)，觸發(fā)該事件。 itemopening：當(dāng)初始化樹枝節(jié)點(diǎn)展開和閉合時(shí)，觸發(fā)該事件。 上述事件的類型均為mx.events.treeevent。 在編輯控件中節(jié)點(diǎn)的內(nèi)容時(shí)，觸發(fā)的編輯事件與列表控件一致，可以參考列表控件。10.7.3 樹形控件類的方法在編寫樹形控件的事件處理中，常需要獲得節(jié)點(diǎn)的雙親等屬性以及對(duì)控件進(jìn)行動(dòng)態(tài)操作，例如展開某個(gè)節(jié)點(diǎn)，可以通過樹形控件類的方法獲得。常用的方法如下。expandchildrenof()：展開或者關(guān)閉節(jié)點(diǎn)下所有的子節(jié)點(diǎn)。方法有兩個(gè)參數(shù)：第一個(gè)是操作的節(jié)點(diǎn)，類型為object；第二個(gè)是操作的類型，true為展開，fal

22、se為關(guān)閉。expanditem()：展開或關(guān)閉節(jié)點(diǎn)。當(dāng)展開或關(guān)閉節(jié)點(diǎn)時(shí)，控件保存子節(jié)點(diǎn)的狀態(tài)。該方法包含4個(gè)參數(shù)：第一個(gè)是操縱的節(jié)點(diǎn)，類型為object；第二個(gè)是操作狀態(tài)，true為展開，false為關(guān)閉；第三個(gè)是否激活轉(zhuǎn)換，默認(rèn)為false，當(dāng)節(jié)點(diǎn)的孩子超過20個(gè)時(shí)，當(dāng)節(jié)點(diǎn)第一次打開時(shí)，不進(jìn)行轉(zhuǎn)換；第四個(gè)展開或者關(guān)閉節(jié)點(diǎn)時(shí)是否觸發(fā)事件。getparentitem()：獲得當(dāng)前節(jié)點(diǎn)的雙親節(jié)點(diǎn)。setitemicon()：設(shè)置控件中的圖標(biāo)。該方法包含3個(gè)參數(shù)：第一個(gè)要更改的節(jié)點(diǎn)，第二個(gè)是葉子節(jié)點(diǎn)或者閉合樹枝節(jié)點(diǎn)的圖標(biāo)，第三個(gè)是樹枝節(jié)點(diǎn)打開狀的圖標(biāo)。10.7.4 創(chuàng)建樹形控件創(chuàng)建樹形控件，通過定

23、義控件的數(shù)據(jù)，插入控件的標(biāo)簽，定義控件的屬性和事件即可。下面以圖10.20為例介紹簡(jiǎn)單樹形控件的創(chuàng)建。在圖10.20中，只對(duì)數(shù)據(jù)進(jìn)行展示，未添加其他功能，其代碼如下。 10.7.5 樹形控件事件處理 在用戶單擊樹形控件中的節(jié)點(diǎn)時(shí)，常需要對(duì)的事件進(jìn)行處理。圖是一個(gè)單擊節(jié)點(diǎn)后判斷是否為文件夾節(jié)點(diǎn)的例子。10.7.6 展開樹形控件中的節(jié)點(diǎn) 默認(rèn)情況下，在控件初始化時(shí)，總是顯示閉合狀的根節(jié)點(diǎn)，如圖所示。如果希望節(jié)點(diǎn)呈展開狀，可以使用expanditem()方法。10.7.7 改變控件中的圖標(biāo)有時(shí)為了更加形象地表達(dá)數(shù)據(jù)，需要改變樹形控件中不同節(jié)點(diǎn)的圖標(biāo)。在樹形控件中可以通過3種方式設(shè)定圖標(biāo)。使用fold

24、eropenicon、folderclosedicon和defaultleaficon屬性設(shè)定圖標(biāo)。使用控件數(shù)據(jù)中的icon屬性為每個(gè)節(jié)點(diǎn)定義圖標(biāo)。通過setitemicon()方法動(dòng)態(tài)改變圖標(biāo)。使用folderopenicon、folderclosedicon和defaultleaficon定義圖表示只需為相應(yīng)的屬性賦值即可，這里不再詳述，只介紹后2種方式。圖使用icon字段定義圖標(biāo)。圖的基礎(chǔ)上，通過單擊【改變圖標(biāo)】按鈕再次改變圖標(biāo)。10.8 渲染條目在列表類的控件中，如何顯示列表都是由控件的條目渲染器（itemrenderer）實(shí)現(xiàn)的。條目渲染器在flex 1.5以及actionscrip

25、t中都被稱之為單元渲染器（cellrenderer）。flex 2將單元渲染器進(jìn)行修訂更名為條目渲染器，更加靈活的定制條目顯示。在每個(gè)控件中都有默認(rèn)的條目渲染器。同時(shí)這些控件也提供相應(yīng)的屬性以及方法，去使用其他組件或者自定義組件作為控件的條目渲染器。在本章前面的控件介紹中已經(jīng)講述過條目渲染器的使用，如水平列表控件和瓦片式列表控件。使用條目渲染器有多種方式。例如使用列表類控件中內(nèi)置的渲染器和編輯器、使用其他控件定義、自定義組件，本節(jié)將從這幾個(gè)方面介紹如何使用條目渲染器。10.8.1 使用默認(rèn)的條目渲染器在列表類控件中，每個(gè)控件都擁有自己的默認(rèn)的條目渲染器。如在數(shù)據(jù)表格中使用datagridite

26、mrenderer。datagriditemrenderer使用文本控件表示數(shù)據(jù)表格中的條目。而其他幾種默認(rèn)的條目渲染器，如listitemrenderer、menuitemrenderer、menubaritem、tilelistitemrenderer和treeitemrenderer都使用文本和圖片組合的方式表示條目。在前面講述列表控件時(shí)，為列表項(xiàng)添加圖標(biāo)就使用了listitemrenderer。圖是一個(gè)使用默認(rèn)條目渲染器的示例。10.8.2 使用其他控件作為條目渲染器在flex中，有很多控件可以作為列表類控件的條目渲染器，如按鈕控件、復(fù)選框控件、日期選擇控件、圖片控件、標(biāo)簽控件、數(shù)字步進(jìn)器控件文本控件和文本區(qū)控件文本輸入控件。在使用這些控件時(shí)，在組件的itemrenderer屬性后填寫相應(yīng)組件的類名即可。例如使用按鈕控件時(shí)的代碼如下。itemrenderer=“mx.controls.button”下面的例子在數(shù)據(jù)表格的第一列和最后一列分別使用了圖片和數(shù)字步進(jìn)器控件作為條目渲染器。如圖所示。10.8.3 自定義組件作為條目渲染器 上面的例子中使用flex中的控件作