Flex 动态datagrid的应用

<!--
/* Font Definitions */
@font-face
{font-family:宋体;
panose-1:2 1 6 0 3 1 1 1 1 1;
mso-font-alt:SimSun;
mso-font-charset:134;
mso-generic-font-family:auto;
mso-font-pitch:variable;
mso-font-signature:3 680460288 22 0 262145 0;}
@font-face
{font-family:"/@宋体";
panose-1:2 1 6 0 3 1 1 1 1 1;
mso-font-charset:134;
mso-generic-font-family:auto;
mso-font-pitch:variable;
mso-font-signature:3 680460288 22 0 262145 0;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{mso-style-parent:"";
margin:0cm;
margin-bottom:.0001pt;
text-align:justify;
text-justify:inter-ideograph;
mso-pagination:none;
font-size:10.5pt;
mso-bidi-font-size:12.0pt;
font-family:"Times New Roman";
mso-fareast-font-family:宋体;
mso-font-kerning:1.0pt;}
/* Page Definitions */
@page
{mso-page-border-surround-header:no;
mso-page-border-surround-footer:no;}
@page Section1
{size:595.3pt 841.9pt;
margin:72.0pt 90.0pt 72.0pt 90.0pt;
mso-header-margin:42.55pt;
mso-footer-margin:49.6pt;
mso-paper-source:0;
layout-grid:15.6pt;}
div.Section1
{page:Section1;}
/* List Definitions */
@list l0
{mso-list-id:645429260;
mso-list-type:hybrid;
mso-list-template-ids:1330559786 -792669466 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;}
@list l0:level1
{mso-level-text:%1）;
mso-level-tab-stop:39.0pt;
mso-level-number-position:left;
margin-left:39.0pt;
text-indent:-18.0pt;}
@list l1
{mso-list-id:868495315;
mso-list-type:hybrid;
mso-list-template-ids:464180022 536099640 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;}
@list l1:level1
{mso-level-text:%1、;
mso-level-tab-stop:39.0pt;
mso-level-number-position:left;
margin-left:39.0pt;
text-indent:-18.0pt;}
@list l2
{mso-list-id:1517230120;
mso-list-type:hybrid;
mso-list-template-ids:-1951217728 -676410782 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;}
@list l2:level1
{mso-level-text:%1）;
mso-level-tab-stop:39.0pt;
mso-level-number-position:left;
margin-left:39.0pt;
text-indent:-18.0pt;}
@list l3
{mso-list-id:1676492127;
mso-list-type:hybrid;
mso-list-template-ids:423243848 -1060615108 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;}
@list l3:level1
{mso-level-text:"%1/)";
mso-level-tab-stop:39.0pt;
mso-level-number-position:left;
margin-left:39.0pt;
text-indent:-18.0pt;}
ol
{margin-bottom:0cm;}
ul
{margin-bottom:0cm;}
-->

Flex
有
2
种常用的
datagrid
：
datagrid
和
advanceddatagrid
，本文指功能更加强大的
advanceddatagrid
。所谓
advanceddatagrid
的动态应用是指，其列数不确定，随着数据源的改变，其列自适应填充（列顺序、列抬头设置、宽度设置等）。

为什么要讨论
datagrid
的动态应用，是因为实际业务当中往往有很多报表其列数是不确定的，这通常是指横向报表。如有张报表是这样的：

年份

月份

产品类别

销售额

2010
6

笔记本

10000
（万元）

2010
6

台式机

20000
（万元）

……

现在要把这张报表横过来，展示如下：

年份

月份

产品类别
1

产品类别
2

产品类别
3…

2010
6
10000
（万元）
20000
（万元）

…

此时，其列是随着产品类别数量变动而变动的，即其列是需要动态改变的，虽
Flex
提供了现成的
olapdatagrid
可用，由于其使用不方便、展示慢等原因，简单的动态列报表还是用
advanceddatagrid
来实现，那么如何实现？

1、

约定

1)

flex
使用
blazeds
与
java
进行通讯；

2)

2、

在
java
定义一个
flex
的
datagrid
列属性设置类

JavaColDef
，该类有
name
、
text
、
width
等属性，分别表示名称、抬头和宽度；当然为了映射，最好
flex
端定义一个与
JavaColDef
结构一样的
FlexColDef
，并映射到
JavaColDef
。

3、

在
java
端定义一个获取列属性设置的函数

Public
JavaColDef[] getDataGridSetting()

该函数返回列属性数组，在数组中的填充顺序即默认为该列在
grid
中的显示顺序。

4、

在
flex
端进行
datagrid
的数据填充处理

假设
flex
执行了查询操作得到了数据集
{dataset}
，当我们得到该数据集的时候，我们立即调用
getDataGridSetting
方法去获取列属性定义。

获取到列属性定义之后，执行表格重建操作。

1）

先移除所有列；

2）

根据属性列集合，依次给
datagrid
添加列，并设置其属性；

3）

绑定数据集
{dataset}

5、

总结

Datagrid
动态列实现，只要进行
2
个操作即可。

1）

开发人员自行实现
getDataGridSetting()
函数；

2）

数据查询事件处理，查询成功后调用统一函数，
void rebuildGrid(array:ArrayCollection)
即可。