Flex根據後臺的數據自動生成AdvancedDataGrid

 在企業級應用開發中AdvancedDataGrid 和DataGrid 使用的非常廣。當然最基本的也是最常用的就是數據的直接綁定,固定列頭和固定數據的列數。而這往往不能滿足需求,企業應用的開發常常是以數據爲中心,數據會經常變化比如增加了列頭,刪除某列的數據,羣組子類的新增等等。這裏就要根據後臺數據完全的自動化生成了,也就是完全使用ActionScript來寫,其實也很簡單,flex的每段mxml標記都對應了相同的AS類,只是在某些細節上的實現有些不同.下面簡單的例子供大家參考,相信能解決開發中的大部分問題。

                        [Bindable]
            public var dgSource:ArrayCollection = new ArrayCollection();
            private var adDG:AdvancedDataGrid = new AdvancedDataGrid();
            [Bindable]
            public var newSource:ArrayCollection = new ArrayCollection();

            protected function httpservice1_resultHandler(event:ResultEvent):void
            {
                dgSource = event.result.root.Item;
                
                //遍歷數據源
                var ss:int = 0;                
                while(ss < ((dgSource.getItemAt(0).value.string) as ArrayCollection).length)
                {
                    var newObj:Object=new Object();
                    for(var s:int=0;s<dgSource.length;s++)
                    {
                        newObj[dgSource.getItemAt(s).duName] = dgSource.getItemAt(s).value.string[ss];
                    }                                                                        
                    ss ++;
                    newSource.addItem(newObj);
                }
                
                adDG.dataProvider = newSource;
                adDG.groupedColumns = getColumnGroupNames(dgSource);
                adDG.sortableColumns = false;
                adDG.sortExpertMode = false;
                adDG.showInAutomationHierarchy = false;
                adDG.height = 400;
                adDG.percentWidth = 100;
                adDG.horizontalScrollPolicy = ScrollPolicy.AUTO;
                this.addElement(adDG);
                
            }

                        //根據數據源格式生成相應的Column和ColumnGroup
            private function getColumnGroupNames(columnsSource:ArrayCollection):Array
            {
                var columnGrouNames:Array=new Array();
                
                if (columnsSource && columnsSource.length > 0)
                {
                    for (var i:int=0; i < columnsSource.length; i++)
                    {
                        var obj:Object=columnsSource.getItemAt(i);
                        var column:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                        column.headerText=obj.duName;
                        column.dataField=obj.duName;
                        column.width = 130;
                        
                        if (obj.hasOwnProperty("duOwner"))
                        {
                            //檢測當前是否存在羣組
                                    var column_index:int=judgeGroupNameIfExist(columnGrouNames, obj.duOwner);
                            
                            //判斷當前羣組是否存在
                            //如果存在則添加子列
                            if (column_index > -1)
                            {
                                columnGrouNames[column_index].children.push(column)
                            }
                            else
                            {
                                var groupName:AdvancedDataGridColumnGroup=new AdvancedDataGridColumnGroup();
                                groupName.headerText=obj.duOwner;
                                groupName.children=[column];
                                columnGrouNames.push(groupName);
                            }
                        }
                        else //如果當前列不是羣組列則直接添加
                        {
                            columnGrouNames.push(column);
                        }
                    }
                }
                return columnGrouNames;
            }
            
            //判斷羣組是否存在
            //不存在則添加
            //存在則返回當前下標
            private function judgeGroupNameIfExist(groupSource:Array, name:String):int
            {
                for (var i:int=0; i < groupSource.length; i++)
                {
                    if (groupSource[i].headerText == name)
                    {
                        return i;
                    }
                }
                return -1;
            }


xml數據源

<?xml version="1.0" encoding="utf-8"?>
<root>
  <Item>
    <duName>Name</duName>
    <value>
      <string>Name 1</string>
      <string>Name 2</string>
      <string>Name 3</string>
      <string>Name 4</string>
      <string>Name 5</string>
    </value>
  </Item>
  <Item>
    <duName>Owner</duName>
    <value>
      <string>HR 1</string>
      <string>HR 2</string>
      <string>HR 3</string>
      <string>HR 4</string>
      <string>HR 5</string>
    </value>
  </Item>
  <Item>
    <duName>Type</duName>
    <value>
      <string>Labor 1</string>
      <string>Labor 2</string>
      <string>Labor 3</string>
      <string>Labor 4</string>
      <string>Labor 5</string>
    </value>
  </Item>
  <Item>
    <duName>Department One</duName>
    <duOwner>Zhang San</duOwner>
    <value>
      <string>13.0000</string>
      <string>14.0000</string>
      <string>15.0000</string>
      <string>16.0000</string>
      <string>17.0000</string>
    </value>
  </Item>
  <Item>
    <duName>Department Two</duName>
    <duOwner>Li Shi</duOwner>
    <value>
      <string>4.0000</string>
      <string>5.0000</string>
      <string>6.0000</string>
      <string>7.0000</string>
      <string>8.0000</string>
    </value>
  </Item>
  <Item>
    <duName>Department Three</duName>
    <duOwner>Wang Wu</duOwner>
    <value>
      <string>9.0000</string>
      <string>10.0000</string>
      <string>11.0000</string>
      <string>12.0000</string>
      <string>13.0000</string>
    </value>
  </Item>
  <Item>
    <duName>Department Four</duName>
    <duOwner>Zhang San</duOwner>
    <value>
      <string>5.0000</string>
      <string>6.0000</string>
      <string>7.0000</string>
      <string>8.0000</string>
      <string>9.0000</string>
    </value>
  </Item>
  <Item>
    <duName>Department Five</duName>
    <duOwner>Wang Wu</duOwner>
    <value>
      <string>11.0000</string>
      <string>12.0000</string>
      <string>13.0000</string>
      <string>14.0000</string>
      <string>15.0000</string>
    </value>
  </Item>
</root>


發佈了88 篇原創文章 · 獲贊 2 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章