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>


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值