在網(wǎng)上看過(guò)很多人轉載darronschall的 LabelCellRenderer 例子，其中有個(gè)錯誤，把myList.cellRenderer = "LabelCellRenderer";這行代碼放到了注釋里面去了，但是到處轉載的依然沒(méi)有修正（其實(shí)原文是正確的）。
其實(shí)看了這個(gè)我們并沒(méi)有求甚解，要知道授人予魚(yú)，不如授人予漁。我們再來(lái)看下為什么通過(guò)cellrenderer可以給List、DataGrid、Tree 和 Menu 組件以及其它列表組件增強單元格內容顯示。
我們首先要從List組件開(kāi)始分析，List 類(lèi)至關(guān)重要。DataGrid、Tree 和 Menu 組件是 List 類(lèi)的擴展。
List 類(lèi)由行構成。這些行顯示滑過(guò)和選區突出顯示，用作行選區的點(diǎn)擊狀態(tài)，并在滾動(dòng)中扮演重要的角色。除了選區突出顯示和圖標（如節點(diǎn)圖標和 Tree 組件的展開(kāi)箭頭）之外，行還包含一個(gè)單元格（或者，如果是 DataGrid，則包含多個(gè)單元格）。在默認情況下，這些單元格是實(shí)現 CellRenderer API 的 TextField 對象。但是，您可以讓 List 使用不同的組件類(lèi)作為每一行的單元格。*的要求是該類(lèi)必須實(shí)現 List 用于與單元格通信的 CellRenderer API。
List 類(lèi)使用一種非常復雜的算法進(jìn)行滾動(dòng)。一個(gè)列表只會(huì )列出它一次能顯示的最多行數，超出 rowCount 屬性的值的項目根本不會(huì )獲得行。在列表滾動(dòng)時(shí)，它會(huì )將所有行上下移動(dòng)（取決于滾動(dòng)方向）。然后，列表將重復使用滾出視圖的行；列表會(huì )重新初始化這些行，并使用它們作為正在滾入視圖的新行，方法是將舊行的值設置為視圖中的新行，然后將舊行移到新項目滾入視圖的位置。
要使用 CellRenderer API，您必須編寫(xiě)包含下面四個(gè)方法的類(lèi)
CellRenderer.getPreferredHeight() 返回單元格的*高度
CellRenderer.getPreferredWidth() 返回單元格的*寬度
CellRenderer.setSize() 設置單元格的寬度和高度
CellRenderer.setValue() 設置要顯示在單元格中的內容
基于列表的組件將使用該類(lèi)與單元格通信。這就是我們看到的darronschall定義的LabelCellRenderer類(lèi)。
系統將為單元格自動(dòng)指定兩個(gè)方法和一個(gè)屬性
CellRenderer.getCellIndex() 返回包含單元格渲染器數據字段的名稱(chēng)的字符串
CellRenderer.getDataLabel() 返回包含兩個(gè)字段（columnIndex 和 rowIndex）的對象，這兩個(gè)字段指明單元格的位置
CellRenderer.listOwner 指向包含單元格的列表的引用
以便允許它與基于列表的組件通信。例如，假設單元格內包含一個(gè)復選框，該復選框導致行在單擊時(shí)被選中。單元格渲染器需要引用包含它的基于列表的組件，以便調用基于列表的組件的 selectedIndex 屬性。同時(shí)，單元格需要知道它當前正在渲染的項目索引，以便能夠將 selectedIndex 設置為正確的編號；單元格可以使用 CellRenderer.listOwner 和 CellRenderer.getCellIndex() 達到此目的。您不需要實(shí)現這些 API；在將單元格放到基于列表的組件內時(shí)，單元格將自動(dòng)接收這些 API。
我們來(lái)看下LabelCellRenderer類(lèi)實(shí)現的這幾個(gè)方法代碼：
label = createObject("Label", "label", 1, { });
label.html = true;
size();
}
// setSize is implemented by UIComponent and calls size(), after setting
// __width and __height
function size(Void) : Void {
label.setSize(__width, __height);
// make sure the label field is in the top-left corner
// of the row
label._x = 0;
label._y = 0;
}
function setValue( ) : Void {
// hide the label if no data to display
label._visible = (item!=undefined);
// this line actually sets htmlText
label.text = item.label;
}
function getPreferredHeight(Void) : Number {
// this is the height with the default font, you might
// need to adjust this to suit your needs
return 18;
}
function getPreferredWidth(Void) : Number {
// default to the width of the listbox
return __width;
}
其中用來(lái)顯示html標記的就是setValue方法了。
我們定義了這個(gè)類(lèi)后，剩下就是對List組件來(lái)設置新的單元格渲染器了。使用下面的代碼：
1 : //LabelCellRenderer就是指定單元格渲染的連接ID
2 : myList.cellRenderer = "LabelCellRenderer";
也許看完這些，你可以做出更好效果的渲染器來(lái)。要注意的是，只有flashMX2004的List組件才支持。
