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

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

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

講師：風舞煙

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

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

應用3:創(chuàng)立一個雙向綁定應用4:使用ActionScript來進行數(shù)據(jù)綁定應用5:鏈式的屬性綁定應用6:使用E4X進行綁定XML的數(shù)據(jù)應用7:創(chuàng)立特性化可綁定的屬性應用8:綁定到一個一般的對象

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

應用2:過濾ArrayCollection問題我需要對ArrayCollection數(shù)據(jù)進行過濾，設置過濾器移除些不匹配的結(jié)果。方法J將原型為function(item:Object):Boolean的函數(shù)傳遞給ArrayCollection的filter屬性。假使返回true表示值繼續(xù)留在ArrayCollection,返回false表示其值被移除。說明filterFunction屬性是由ListCollectionView類定義，它是ArrayCollection的父類。當過濾器函數(shù)被傳遞給繼承自ListCollectionView的任何子類后，這里為ArrayCollection對象，應用過濾器后必需調(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;}

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

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);}

//設置好GroupingCollection的grouping屬性后，設置另外的分組將會覆蓋當前分組: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

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

IViewCursor接口定義了三個方法用于探尋集合：findFirst(values:Object):Boolean此方法查找集合中具有指定屬性的第一個項目，并將光標定位到該項目findLast(values:Object):Boolean此方法查找集合中具有指定屬性的最終一個項目，并將光標定位到該項目findAny(values:Object):Boolean此方法查找集合中具有指定屬性的項目并將光標定位到該項目，這個是速度最快的方法。注意這三個方法可工作在未排序的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});}