Flex 3 已经开始公测,其带来了诸多变化,所以由今天开始,我们将陆续和大家一起来学习其中的新特性,进行我们的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}, {Artist:'Saner', Album:'Helium Wings', Price:12.99}, {Artist:'The Doors', Album:'The Doors', Price:10.99}, {Artist:'The Doors', Album:'Morrison Hotel', Price:12.99}, {Artist:'Grateful Dead', Album:'American Beauty', Price:11.99}, {Artist:'Grateful Dead', Album:'In the Dark', Price:17.99}, {Artist:'Grateful Dead', Album:'Shakedown Street', Price:13.99}, {Artist:'The Doors', Album:'Strange Days', Price:12.99}, {Artist:'The Doors', 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" />

