开源控件——AdvancedDataGrid

Flex 迷你教程 — 在AdvancedDataGrid中合并单元格 (合并行)

在项目中我们对DataGrid的要求是很高的,但很不幸的Flex 的DataGird的功能是很傻的,这就催生了AdvancedDatgrid, 它确实解决了很多DataGrid不能做的事,比如多级排序,单元格选择,树状显示数据,合并表头等,但是不知道为什么它确忘记了 “合并单元格”这么重要的事。好在牛人是很多的,于是出现了MecGrid, NecGrid这样不错的能解决单元格合并的DataGrid, 不过他们都各有缺点。

MecGrid: (http://www.mechansp.com/index.php)

1. 不支持itemrender。
2. 单元格选择时无法获知整行数据。
3. 不支持xxxFunction设置比如(labelFunction)
4. 设置很不方便。在column设置中大量使用 number作为参数,非常非常的不利于使用,在线文档对这个ResourceXML的设置也没有提到具体细节,这个很头痛.

总结: MecGrid的使用非常不方便,而且完全不支持复杂数据类型,虽然实现了很多功能但都是固定功能,扩展性不强。这让他局限在只能作为表格使用。
NEC Grid (http://www.necst.co.jp/product/ibiz/column/ibizblock/chap7.html)

nec

1. 不能改变行高。
2. 破换了itemrender的使用,我增加了一个ComboBox作为itemrender,但是他的显示完全不正常。如果itemrender的高度大于他的默认行高,显示会被切断。
3. 不支持单元格选择。

总结:这个DataGrid的使用非常方便,不过缺点也比较明显,尤其是对itemrender这条,要命的是他不能改变行高,但实际中我们的数据是很有可能换行的。另外他居然不支持单元格选择,作为一个AdvancedDatagird,单元格选择在很多时候是必要的。总的来说这个DataGrid用于对数据操作没有特殊要求的用户是不错的选择。

—————————-废话结束,教程开始的分割线—————————————


在看完了老美和日本人做的DataGrid后找到一个韩国人做的,名字就叫AdavcnedDataGrid, 相比Mec和Nec, 扩展的功能比较单一,Bug也非常多,只有合并单元格功能,基于Flex 的AdvancedDataGrid实现。不过也是保留原有 AdvancedDataGrid功能最完整的, 为了和Flex AdvancedDataGrid 区分,我叫它KAdvancedDataGrid。

KAdvancedDataGrid (http://code.google.com/p/advanceddatagrid/)

文章末尾是KadvancedDataGird的下载,相对于原版,我修复了如下内容:

  1. 动态使用columns = XXXX不起作用。
  2. 当列数据为复杂类型时异常。
  3. 设置dataProvider为null时异常。
  4. 还有一些其他的异常,忘了…..

KAdvancedDataGrid的使用很简单,使用groupedColumns标签,把想要合并的列放进去,他会自动的将相同内容的单元格合并在一起。

如下图:

kad

本例的代码在文章末尾,测试代码很简单,这里就不过多解释了,大家可以下载测试。

KAdvancedDataGrid的应用展示

下面几张截图是我使用KadvancedDataGrid作为原材料制作的显示员工出勤情况的日历控件(Calendar View),包括Day, Week, Month和Year View.  这里显示的是Week, Month 和Year View. 使用前面的MecDataGrid或者NecGrid要想实现这样的DatGrid比较困难,Mec是灵活性不够,只能创建它固定格式的Grid, Nec是无法处理复杂数据类型。图片的分辨率较大,点击查看大图

Month View

monthview

Week View

WeekView

Year View

yearView

源代码

源代码中的AdvancedDataGrid是我修改后的版本,原版可访问http://code.google.com/p/advanceddatagrid/

mergeableDataGrid (6)

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页