第22講Flex數(shù)據(jù)集成基礎(chǔ)

本文格式為Word版，下載可任意編輯——第22講Flex數(shù)據(jù)集成基礎(chǔ)

北風(fēng)網(wǎng)項(xiàng)目培訓(xùn)應(yīng)用Flex+http://.77技術(shù)構(gòu)建大型網(wǎng)上書店電子商務(wù)交易平臺(tái)全程實(shí)錄第21講：Flex數(shù)據(jù)集成基礎(chǔ)-使用集合與數(shù)據(jù)綁定

講師：風(fēng)舞煙

應(yīng)用1:為ArrayCollection添加，排序和獲取數(shù)據(jù)應(yīng)用2:過(guò)濾ArrayCollection應(yīng)用3:創(chuàng)立GroupingCollection應(yīng)用4:遍歷集合對(duì)象并記錄位置應(yīng)用5:過(guò)濾和排序XMLListCollection應(yīng)用6:對(duì)集合的多個(gè)字段進(jìn)行排序應(yīng)用7:對(duì)集合的日期類型數(shù)據(jù)進(jìn)行排序應(yīng)用8:用唯一的IDs標(biāo)識(shí)數(shù)據(jù)對(duì)象

概述應(yīng)用1:綁定一個(gè)屬性應(yīng)用2:綁定到一個(gè)函數(shù)

應(yīng)用3:創(chuàng)立一個(gè)雙向綁定應(yīng)用4:使用ActionScript來(lái)進(jìn)行數(shù)據(jù)綁定應(yīng)用5:鏈?zhǔn)降膶傩越壎☉?yīng)用6:使用E4X進(jìn)行綁定XML的數(shù)據(jù)應(yīng)用7:創(chuàng)立特性化可綁定的屬性應(yīng)用8:綁定到一個(gè)一般的對(duì)象

集合是ActionScript中功能強(qiáng)大的基于索引的數(shù)組組件，添加了如對(duì)內(nèi)容進(jìn)行排序等功能，操作數(shù)組的讀取位置，創(chuàng)立經(jīng)過(guò)排序的數(shù)組視圖。集合也能通知其任意事件監(jiān)聽器監(jiān)聽其數(shù)據(jù)是否改變，以及任何數(shù)據(jù)項(xiàng)被添加到源數(shù)組時(shí)可執(zhí)行自定義規(guī)律。當(dāng)數(shù)據(jù)改變時(shí)可通知其監(jiān)聽器，這是集合的新功能，叫數(shù)據(jù)綁定，還有就是允許DataGrid和List組件對(duì)其內(nèi)容進(jìn)行排序和過(guò)濾。集合是使用數(shù)據(jù)驅(qū)動(dòng)控件以及從數(shù)據(jù)庫(kù)返回的服務(wù)器端服務(wù)的重要內(nèi)容。經(jīng)常被使用的兩個(gè)集合類型是ArrayCollection類XMLListCollection類。ArrayCollection是Array的包裝類，提供更便利的如添加和移除數(shù)據(jù)項(xiàng)以及能夠創(chuàng)立游標(biāo)啟用要輕松地存儲(chǔ)數(shù)組中的最終讀取的位置等方法。而XMLListCollection是XML對(duì)象的包裝類，提供的功能有：根據(jù)索引訪問(wèn)數(shù)據(jù)，添加新對(duì)象以及游標(biāo)等方法。XMLListCollection對(duì)于處理XML對(duì)象以及經(jīng)常需要解析XML為數(shù)組時(shí)特別有用。

Demo1.mxml核心代碼：importmx.collections.ArrayCollection;importmx.collections.Sort;privatevarcoll:ArrayCollection;privatefunctioninit():void{coll=newArrayCollection([{name:Zhangsan,age:25},{name:lishi,age:15},{name:wangwu,age:23}]);}

privatefunctionaddItem():void{coll.addItemAt({name:zhaoliu,age:40},0);trace(coll);}privatefunctionre

moveItem():void{coll.removeItemAt(0);trace(coll);}

//排序privatefunctionSortByAge(){varsort:Sort=newSort();sort.fields=[newSortField(age,false)];coll.sort=sort;coll.refresh();trace(coll.getItemAt(0).age++coll.getItemAt(0).name);}

應(yīng)用2:過(guò)濾ArrayCollection問(wèn)題我需要對(duì)ArrayCollection數(shù)據(jù)進(jìn)行過(guò)濾，設(shè)置過(guò)濾器移除些不匹配的結(jié)果。方法J將原型為function(item:Object):Boolean的函數(shù)傳遞給ArrayCollection的filter屬性。假使返回true表示值繼續(xù)留在ArrayCollection,返回false表示其值被移除。說(shuō)明filterFunction屬性是由ListCollectionView類定義，它是ArrayCollection的父類。當(dāng)過(guò)濾器函數(shù)被傳遞給繼承自ListCollectionView的任何子類后，這里為ArrayCollection對(duì)象，應(yīng)用過(guò)濾器后必需調(diào)用refresh方法：

Demo2.mxml核心代碼：importmx.collections.ArrayCollection;privatevarcoll:ArrayCollection;privatefunctioninit():void{coll=newArrayCollection([{name:zhang,age:25},{name:lishi,age:15},{name:wang,age:23},{name:zhao,age:21}]);coll.filterFunction=filterFunc;coll.refresh();for(vari:int=0;icoll.length;i++){trace(coll.getItemAt(i).name);}}privatefunctionfilterFunc(value:Object):Object{if(Number(value.age)21){returntrue;}returnfalse;}

應(yīng)用3:創(chuàng)立GroupingCollection問(wèn)題我想基于集合中數(shù)據(jù)項(xiàng)的某個(gè)屬性創(chuàng)立唯一的分組數(shù)據(jù)方法傳遞一個(gè)Array參數(shù)給GroupingCollection構(gòu)造器或設(shè)置GroupingCollection對(duì)象的source屬性。對(duì)某屬性進(jìn)行分組，首先創(chuàng)立具有一致該屬性的所有對(duì)象分組，創(chuàng)立Grouping實(shí)例，傳遞GroupingField對(duì)象數(shù)組給Grouping實(shí)例的fields:如：vargroupingInst:Grouping=newGrouping();groupingInst.fields=[newGroupingField(state)];groupingColl.grouping=groupingInst;groupingColl.refresh(false);Grouping實(shí)例初始化后，設(shè)置GroupingCollection的grouping屬性為groupingInst,然后刷新，集合將根據(jù)state屬性值對(duì)集合所有數(shù)據(jù)進(jìn)行分組：

Demo3.mxml(核心代碼)importmx.collections.Grouping;importmx.collections.GroupingField;importmx.collections.GroupingCollection;[Bindable]privatev

argroupingColl:GroupingCollection;privatefunctioninit():void{groupingColl=newGroupingCollection();groupingColl.source=[{city:Columbus,state:Ohio,region:East},{city:Cleveland,state:Ohio,region:East},{city:Sacramento,state:California,region:West},{city:Atlanta,state:Georgia,region:South}];vargroupingInst:Grouping=newGrouping();groupingInst.fields=[newGroupingField(state)];groupingColl.grouping=groupingInst;groupingColl.refresh(false);}

//設(shè)置好GroupingCollection的grouping屬性后，設(shè)置另外的分組將會(huì)覆蓋當(dāng)前分組:privatefunctioncreateRegionGrouping():void{vargroupingInst:Grouping=newGrouping();groupingInst.fields=[newGroupingField(region)];groupingColl.grouping=groupingInst;groupingColl.refresh(false);}]]/fx:Scriptmx:AdvancedDataGriddataProvider={groupingColl}width=50%mx:columnsmx:AdvancedDataGridColumndataField=city//mx:columns/mx:AdvancedDataGrid

應(yīng)用4:遍歷集合對(duì)象并記錄位置問(wèn)題:我想雙向遍歷集合，并保持當(dāng)前所在位置方法:使用ListViewCollection類的createCursor方法創(chuàng)立可前后移動(dòng)的游標(biāo)。說(shuō)明:可使用視圖游標(biāo)瀏覽集合數(shù)據(jù)視圖中所有數(shù)據(jù)項(xiàng)，訪問(wèn)和修改集合數(shù)據(jù)。游標(biāo)是一個(gè)位置指示器，它執(zhí)行特定位置的數(shù)據(jù)項(xiàng)。你可以使用集合的createCursor方法返回一個(gè)視圖游標(biāo)。游標(biāo)的各種方法和屬性都由IViewCursor接口定義。通過(guò)IViewCursor方法，你可以前后移動(dòng)游標(biāo)，用特定條件探尋數(shù)據(jù)項(xiàng)，獲取指定位置的數(shù)據(jù)項(xiàng)，保存游標(biāo)所在位置，以及添加，刪除或修改數(shù)據(jù)值。當(dāng)你使用標(biāo)準(zhǔn)的Flex集合類如ArrayCollection和XMLListCollection時(shí)，可直接使用IViewCursor接口，不需要引用對(duì)象實(shí)例，例如：

IViewCursor接口定義了三個(gè)方法用于探尋集合：findFirst(values:Object):Boolean此方法查找集合中具有指定屬性的第一個(gè)項(xiàng)目，并將光標(biāo)定位到該項(xiàng)目findLast(values:Object):Boolean此方法查找集合中具有指定屬性的最終一個(gè)項(xiàng)目，并將光標(biāo)定位到該項(xiàng)目findAny(values:Object):Boolean此方法查找集合中具有指定屬性的項(xiàng)目并將光標(biāo)定位到該項(xiàng)目，這個(gè)是速度最快的方法。注意這三個(gè)方法可工作在未排序的ArrayCollection或XMLListCollection。

Demo4.mxml(核心代碼)importmx.collections.SortField;importmx.collections.Sort;importmx.collections.IViewCursor;importmx.collections.CursorBookmark;importmx.collections.ArrayCollection;[Bindable]privatevarcoll:ArrayCollection;[Bindable]privatevarcursor:IViewCursor;privatefunctioninit():void{coll=newArrayCollection([{city:Columbus,state:Ohio,reg

ion:East},{city:Cleveland,state:Ohio,region:East},{city:Sacramento,state:California,region:West},{city:Atlanta,state:Georgia,egion:South}]);cursor=coll.createCursor();}

privatefunctionfindRegion():void{varsort:Sort=newSort();sort.fields=[newSortField(region)];coll.sort=sort;coll.refresh();cursor.findFirst({region:regionInput.text});}privatefunctionfindState():void{varsort:Sort=newSort();sort.fields=[newSortField(state)];coll.sort=sort;coll.refresh();cursor.findFirst({region:stateInput.text});}