试用
(www.adobe.com/go/tryflex_cn)
购买
(www.adobe.com/cn/purchase/)
理解FlexitemRenderer第1部分:内联渲染器
Flex 提供许多控制,它们可以按不同方式显示大量数据。List控制自己、DataGrid、Tree以及包括图表和
AdvancedDataGrid在内的可视类。默认情况下,Flex 列表控制将提供的数据显示为简单文本。但Flex 的能耐远不止此,
列表控制提供了一种使用itemRenderer对其内容进行自定的方式。通过允许您使用itemRenderer 完全控制列表每行
(或单元格)的内容,Flex 使您能够编写出更引人注目、更具创意、更实用的应用程序。
本系列讨论FlexitemRenderer以及如何高效、有效地使用它们。本系列的第一部分侧重于内联itemRenderer,它们写
入描述List控制的MXML 标记中。之后的文章讨论使用MXML和ActionScript且更为复杂的itemRenderer。
要求
为了充分利用本文,您需要以下软件和文件:
FlexBuilder3
范例文件:
itemrenderers_pt1.zip(www.adobe.comhttp://download.macromedia.com/pub/ developer/itemrenderers_pt1.zi p)
(ZIP,28KB)
必要条件:
要从本文中受益,您最好熟悉FlexBuilder和ActionScript3.0。
循环使用渲染器
人们经常尝试从列表外访问itemRenderer。例如,由于您刚从服务器那里收到新数据,您可能要将DataGrid中第五行的
第四列变为绿色。获取那个itemRenderer实例并在外部修改它对于Flex 框架和组件模型而言是一个大工程。
要理解itemRenderer,您必须理解它们为何变成现在这样以及我们当初设计它们时的目的。在此,当我用到“ 我们” 时,我
指的是AdobeFlex 设计小组。我与它没有关系。言归正传,假设您要显示1,000条记录。如果您认为列表控制会创建
1,000个itemRenderer,您就错了。如果列表只显示10行,它会创建约12个itemRender er－这些足以显示各个可见行,
多出的几个则用于缓冲和性能。列表最初显示行1–10。当用户滚动这个列表时,它现在可能显示行312。但那12个
itemRenderer仍在那里:及时滚动列表后,也不会新建任何itemRenderer。
以下是Flex 执行的操作。滚动列表时,那些依然显示相同数据(行310)的itemRenderer将向上移动。它们并未发生任
何变化,只是移到了新位置。之前显示行1和 行2数据的itemRenderer现在移到行10的itemRendere下。然后,为那
些itemRenderer提供行11和 行12的数据。换言之,除非您调整列表大小,否则将重用/循环使用那些相同的
itemRenderer－它们只是移到新位置并且现在显示新数据。
Flex 的这一行为在特定编程环境中使情况变得更复杂。例如,如果要更改第五行的第四列中某个单元格的背景色,请注意
如果用户滚动了该列表,则该单元格的itemRenderer现在可能显示第二十一行的内容。
那么怎样进行这类更改呢？
itemRenderer必须根据给它们显示的数据更改自己。如果列表的itemRenderer要根据数据值更改其颜色,它必须查看
获得的数据并更改自己。
内联itemRenderer
我在本文中使用内联itemRenderer说明如何解决这个问题。内联itemRenderer直接写入MXML 文件中列表控制出现
的位置。我在下一篇文章中将说明如何编写外部itemRenderer。内联itemRenderer最简单,一般用于十分简单的渲染
器或用于为较大的应用程序构建原型。内联itemRenderer本身并没有问题,但随着代码变得复杂,最好将它提取到自己
的类中。
我将在所有示例中使用相同的数据:一组书籍相关信息－作者、书名、出版日期和缩览图图像等。每个记录是一段XML
代码,如下:
理解 Flex itemRenderer - 第 1 部分: 内联渲染器 | 开发人员中心
http://www.adobe.com/cn/devnet/flex/articles/itemrendere...
第1页 共5页 2010/1/11 1:04
