Flex 3 advancedDataGrid的使用(一)

Flex3 已经开始公测，其带来了诸多变化，所以由今天开始，我们将陆续和大家一起来学习其中的新特性，进行我们的Flex 3发现之旅。

今天我们要说的是官方文档中用了整章介绍的AdvancedDataGrid，AdvancedDataGrid是DataGrid的高级版本，Flex 3 SDK并不包含它，其和Charting Enhancements一起构成了Flex Data Visualization package，TNND，也就是说这是收费组件，ADOBE的生财机器。所以官方提供的SDK中并没有这个组件，不过FlexBuilder 3 Beta1内置的SDK包含了Flex Data Visualization package，这个我已经将FlexBuilder 3 Beta1内置的SDK剥离出来了，需要的朋友可以从这里下载。

相对DataGrid组件，AdvancedDataGrid主要有以下几个高级之处：

多列排序：按住Control键在点击某一列的表头来实现多列排序。
自定义行和列样式：通过设置行和列的styleFunction指向一个函数来样式化行列
显示分层数据：在组件的第一列显示一个可缩放的导航数来控制表格行的显示。
创建多列分组：将多列汇聚到同一列表头下。
使用单元渲染器（renderers）：跨越多栏使用同一渲染器或者一列使用多个渲染器。
多列排序

缺省的情况下，AdvancedDataGrid是按数据添加到它的DataProvider的顺序显示数据，和DataGrid组件一样，AdvancedDataGrid也允许您在数据显示后对数据进行排序。不同的是DataGrid只能基于单列排序，而AdvancedDataGrid支持基于多列的排序。

以下是多列排序的示例：

<?xml version="1.0"?>
< mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Script>
< ![CDATA[
import mx.collections.ArrayCollection;

[Bindable]
private var dpADG:ArrayCollection = new ArrayCollection([
{Artist:'Pavement',Album:'Slanted and Enchanted',Price:12.99},
{Artist:'Pavement',Album:'Brighten the Corners',Price:13.99},
{Artist:'Saner',Album:'A Child Once',Price:14.99},Album:'Helium Wings',
{Artist:'The Doors',Album:'The Doors',Price:10.99},Album:'Morrison Hotel',
{Artist:'Grateful Dead',Album:'American Beauty',Price:11.99},Album:'In the Dark',Price:17.99},Album:'Shakedown Street',Album:'Strange Days',Album:'The Best of the Doors',Price:10.99}
]);
]]>
< /mx:Script>

<mx:AdvancedDataGrid width="100%" height="100%" dataProvider="{dpADG}">
<mx:columns>
< mx:AdvancedDataGridColumn dataField="Artist" />
< mx:AdvancedDataGridColumn dataField="Album" />
< mx:AdvancedDataGridColumn dataField="Price" />
</mx:columns>
< /mx:AdvancedDataGrid>
< /mx:Application>

运行示例

运行以上示例，如下进行排序：

点击AdvancedDataGrid组件的任意列表头对任意列进行排序，例如点击Artist列的列表头Artist列将升序进行排序，再次点击的话将按降序排序。 按住Control键，点击其他任意的列头，例如点击Price列头，将在保持Artist列降序排列的情况下，将Price列按升序排列。现在你可以从中发现某一艺术家最便宜的专辑。 再次点击Price列头，Price列将按降序排列 按住Control键，点击任意其他列，将其加入排序条件中。