repeaters太老土了!如果你過去使用過它,你會發出這種感概。現在,我們終於要擺脫它了。 Repeaters不僅有沉重的組件,而且接合使用很不方便。那麼,Flex 4中有什麼可以幫助我們嗎?DataGroups! 下面的例子都會用到這個數據:
- userData = new ArrayCollection();
- userData.addItem({"fname":"Rich","lname":"Tretola"});
- userData.addItem({"fname":"Joe","lname":"Smith"});
- userData.addItem({"fname":"Bill","lname":"Johnson"});
複製代碼
Flex 3的例子使用了Repeater和一個名爲PersonRenderer的自定義組件: 主文件中的Repeater(Flex 3):
- <mx:VBox horizontalCenter="0" verticalCenter="0">
- <mx:Repeater id="rep" dataProvider="{userData}">
- <local:PersonRenderer person="{rep.currentItem}"/>
- </mx:Repeater>
- </mx:VBox>
複製代碼
PersonRenderer 組件(Flex 3):
- <?xml version="1.0" encoding="utf-8"?>
- <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" >
- <mx:Script>
- <![CDATA[
- [Bindable]
- public var person:Object;
- ]]>
- </mx:Script>
- <mx:Label text="{person.fname} {person.lname}"/>
- </mx:HBox>
複製代碼
<ignore_js_op>
使用了DataGroup和ItemRenderer的Flex4例子。代碼如下: 主文件中的DataGroup:
- <s:DataGroup itemRenderer="PersonRenderer"
- dataProvider="{userData}"
- verticalCenter="0" horizontalCenter="0">
- <s:layout>
- <s:VerticalLayout/>
- </s:layout>
- </s:DataGroup>
複製代碼
PersonRenderer ItemRenderer (Flex 4):
- <?xml version="1.0" encoding="utf-8"?>
- <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark">
- <s:Label text="{data.fname} {data.lname}"/>
- </s:ItemRenderer>
複製代碼
<ignore_js_op> |