您應該還記得我說過, 應該將內聯 itemrenderer 視作單獨的類。事實上, flex 編譯器提取這些內聯**並為您建立類。內聯 itemrenderer 的優勢在於**與列表位於同一位置, 但是如果 itemrenderer 變得複雜時, 這又變成了劣勢。本文中我將向您展示如何自己建立類。
將 itemrenderer 提取到乙個外部檔案有幾個優勢:
在第 1 部分中, 您看到有乙個複雜的 itemrenderer 用於 datagrid:
today ) setstyle("backgroundcolor",0xff99ff);itemrenderer 基於 hbox, 包含乙個 image 和乙個 text, 並且根據專案記錄的else setstyle("backgroundcolor",0xffffff);
}]]>
pubdate
字段設定背景色。可以使用以下步驟將同一 itemrenderer 編寫為乙個外部檔案:
如果您使用 flex builder, 請新建乙個 mxml component 檔案 (我將我的檔案命名為gridcolumn******renderer, 您可以隨意命名), 將根標記設定為hbox
。不必擔心大小。
如果您只使用 sdk, 請新建乙個 mxml 檔案 (將它命名為gridcolumn******renderer.mxml), 將根標記設定為hbox
。
在檔案開啟時, 複製與
之間的所有內容, 但不要複製那些標記, 因為檔案中已有它們。結果應該如下:
<?xml version="1.0" encoding="utf-8"?>儲存此檔案。today ) setstyle("backgroundcolor",0xff99ff);
else setstyle("backgroundcolor",0xffffff);
} ]]>
現在修改 datagridcolumn 定義, 方法是刪除內聯 itemrenderer 並將它替換為以下內容:
現在執行這個應用程式。您會大吃一驚。因為行很高。這是因為 itemrenderer 上的height="300"
。
list 控制始終設定 itemrenderer 的寬度。本例中將忽略明確的width="400"
。您應當編寫自己的 itemrenderer, 假設使用者更改列或列表寬度是寬度會更改。
高度則是另一回事。如果列表設定了明確的rowheight
, 它會將這個高度強加到各行, 忽略您對 itemrenderer 設定的任何高度。但是, 如果您將列表的variablerowheight
屬性設定為true
, 則列表會慎重考慮 itemrenderer 的高度。在本例中, 高度明確設定為 300, 所以各行為 300 畫素高。
要修復它, 請從 itemrenderer 檔案中刪除明確高度, 應用程式即可正確執行。
本例覆蓋了set data()
函式以檢查資料並設定 itemrenderer 的backgroundcolor
。這十分常見。覆蓋set data()
使您能擷取為新行更改資料的時間, 並且您可以作出樣式更改。
常見錯誤為:
內聯渲染器上
flex 提供許多控制,它們可以按不同方式顯示大量資料。list 控制自己 datagrid tree 以及包括圖表和 advanceddatagrid 在內的可視類。預設情況下,flex 列表控制將提供的資料顯示為簡單文字。但 flex 的能耐遠不止此,列表控制提供了一種使用 itemrender...
flex 渲染機制 之外部渲染器
itemrenderer 這種 itemrenderer 的 mxml 標記和 actionscript 與使用該 itemrenderer 的列表位於同一檔案中。與檔案中的其餘 內聯。將 itemrenderer 提取到乙個外部檔案有幾個優勢 itemrenderer 可輕鬆用於多個列表中 更容易...
Flex 內聯渲染器(上)
flex 提供許多控制,它們可以按不同方式顯示大量資料。list 控制自己 datagrid tree 以及包括圖表和 advanceddatagrid 在內的可視類。預設情況下,flex 列表控制將提供的資料顯示為簡單文字。但 flex 的能耐遠不止此,列表控制提供了一種使用 itemrender...