- 浏览: 640665 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
ssxszt:
...
解决PopUpManager弹出窗口RangeError: Error #2006: 提供的索引超出范围 -
lijiajia:
木子佳 写道楼主,想要源码学习,谢谢。kajiamuzi@16 ...
DataGrid和AdvancedDataGrid CheckBox全选功能 -
juedi:
很好,是我需要的东东
Flex异常处理设计 -
暖暖fh:
大神,我想要源码,这个功能我折腾了好我啊 fuhan247@1 ...
DataGrid和AdvancedDataGrid CheckBox全选功能 -
chenzi:
一样的代码,两台机器上面,完全不同的报错。。Flex实现htt ...
Flex使用Https协议
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2007/08/23/determining-a-datagridcolumn-objects-current-sort-order/ --> <mx:Application name="DataGridColumn_sortDescending_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Script source="org/util/SortUtil.as"/> <mx:Script> <![CDATA[ import mx.controls.DateField; import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn; import mx.events.AdvancedDataGridEvent; import mx.utils.ObjectUtil; import mx.collections.ArrayCollection; import mx.controls.dataGridClasses.DataGridColumn; import mx.events.DataGridEvent; [Bindable] public var ac:ArrayCollection=new ArrayCollection([ {data:"-1112",label:"ad",date:"2009/11/10"}, {data:"112",label:"a",date:"2009/11/11"}, {data:"1",label:"12b",date:"2009/11/01"}, {data:"2",label:"Ass",date:"2009/11/20"}, {data:"0",label:"ass",date:"2009/11/14"}, {data:"3",label:"csx",date:"2010/11/12"}, {data:"1232",label:"cdf",date:"2009/11/13"}, {data:"4",label:"xzm",date:"2001/12/10"}, {data:"345",label:"awq",date:"2009/01/10"} ]); ]]> </mx:Script> <mx:DataGrid id="dataGrid" rowCount="10" dataProvider="{ac}" headerRelease="dataGridSort(event)" width="600"> <mx:columns> <mx:DataGridColumn dataField="label" headerText="字符串" /> <mx:DataGridColumn dataField="data" headerText="数字"/> <mx:DataGridColumn dataField="date" headerText="日期"/> </mx:columns> </mx:DataGrid> <mx:AdvancedDataGrid dataProvider="{ac}" headerRelease="advancedDataGridSort(event)" width="600" rowCount="10"> <mx:columns> <mx:AdvancedDataGridColumn dataField="label" headerText="字符串" /> <mx:AdvancedDataGridColumn dataField="data" headerText="数字" /> <mx:AdvancedDataGridColumn dataField="date" headerText="日期" /> </mx:columns> </mx:AdvancedDataGrid> </mx:Application>
flex默认的排序只支持string和numer两种排序,从数据库中读出数据到flex前段,很多时候本来是Number类型转化为了Strng类型(java中的Bigdecimal ,因为As3中没有这么大的数据类型),因此排序就乱了。自己动手写了个方法在点击列头上的排序按钮的时候重置此列的排序函数。另外本方法还支持日期格式,当期是有局限的。
用法:在需要排序的表格上加上headerRelease事件。
// ActionScript file 韩敬诺 dataGrid排序 备注:flex的灵魂是事件 import mx.controls.DateField; import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn; import mx.controls.dataGridClasses.DataGridColumn; import mx.events.AdvancedDataGridEvent; import mx.events.DataGridEvent; import mx.utils.ObjectUtil; /** * 点击dataGrid列头上的排序按钮 */ public function dataGridSort(evt:DataGridEvent):void { //1 得到要排序的列 var column:DataGridColumn = DataGridColumn(evt.currentTarget.columns[evt.columnIndex]); //2 得到列名 var columnName:String=column.dataField; //3 重写此列的排序函数 column.sortCompareFunction=function(obj1:Object,obj2:Object):int{ return superSort(obj1,obj2,columnName); }; } /** * 点击AdvancedDataGrid列头上的排序按钮 */ private function advancedDataGridSort(evt:AdvancedDataGridEvent):void { var column:AdvancedDataGridColumn = AdvancedDataGridColumn(evt.currentTarget.columns[evt.columnIndex]); var columnName:String=column.dataField; column.sortCompareFunction=function(obj1:Object,obj2:Object):int{ return superSort(obj1,obj2,columnName); }; } /** * 根据不同的数据类型选择不同的排序方式 优先级是数字、日期、字符串 */ public function superSort(obj1:Object,obj2:Object,columnName:String):int{ //验证数据类型 Numbe Date String if(!isNaN(obj1[columnName])){ return number_sortCompareFunc(obj1,obj2,columnName); } if(strIsDate(obj1[columnName])){ var inputFormat:String=getInputFormat(obj1[columnName]); return date_sortCompareFunc(obj1,obj2,columnName,inputFormat); } return string_sortCompareFunc(obj1,obj2,columnName); } /** * 日期的排序 */ private function date_sortCompareFunc(obj1:Object, obj2:Object,columnName:String,inputFormat:String):int { var date1:Date =DateField.stringToDate(obj1[columnName],inputFormat); var date2:Date =DateField.stringToDate(obj2[columnName],inputFormat); return ObjectUtil.dateCompare(date1, date2); } /** * 字符串的排序 */ private function string_sortCompareFunc(obj1:Object, obj2:Object,columnName:String):int{ var str1:String=obj1[columnName]; var str2:String=obj2[columnName]; return ObjectUtil.stringCompare(str1, str2,false); } /** * 数字的排序 */ private function number_sortCompareFunc(obj1:Object, obj2:Object,columnName:String):int{ var num1:Number=Number(obj1[columnName]); var num2:Number=Number(obj2[columnName]); return ObjectUtil.numericCompare(num1,num2); } /** * 验证一个字符串是否是日期格式 */ private function strIsDate(str:String):Boolean{ var inputFormat:String=getInputFormat(str); //如果找不到日期表示符号则直接返回false if(inputFormat==null){ return false; } var date:Date=DateField.stringToDate(str,inputFormat); //如果是日期date不为null if(date!=null){ return true; }else{ return false; } } /** * 得到日期的格式 判断的顺序为 2009-11-12 2009/11/12 2009.11.12 */ private function getInputFormat(str:String):String{ if(str.indexOf("-")!=-1){ return "YYYY-MM-DD"; } if(str.indexOf("/")!=-1){ return "YYYY/MM/DD"; } if(str.indexOf(".")!=-1){ return "YYYY.MM.DD"; } return null; }
思路: 在做汽车的项目时,就想解决这个问题,但是一直没想到好的方法。flex是基于事件的组件开发,真是flex的真谛。排序函数很容易写,如何把要排序的列传过来是个问题,flex在干一件事情之前会触发一个事件,headerRelease是关键。
另外,也可以用DatagridColumn的sortCompareFunction进行自定义排序,
mySortCompareFunction(obj1:Object, obj2:Object):int
很多时候,我们需要判断根据obj中的那个属性进行排序比较,而不是对每个表格列进行排序。
一个比较巧妙的方法是可以利用Function。
/** * Numerically sorts a column in the DataGrid. * * @param fieldName The string name for the dataField in the column that you want to sort. */ private function numericSortByField(fieldName:String):Function { return function(obj1:Object, obj2:Object):int { var value1:Number = (obj1[fieldName] == '' || obj1[fieldName] == null) ? null : new Number(obj1[fieldName]); var value2:Number = (obj2[fieldName] == '' || obj2[fieldName] == null) ? null : new Number(obj2[fieldName]); return ObjectUtil.numericCompare(value1, value2); } }
使用很简单,如果列的数据类型是数字,可以指定列的sortCompareFunction
if(dataType=="NUMBER"){ //如果是数字则需要按照数字进行排序 dataGridColumn.sortCompareFunction=numericSortByField(dataField); }
评论
4 楼
250124797
2011-10-26
谢谢,正要可以参考
3 楼
lifengshurui
2011-08-05
谢谢分享啊,学习一下!
2 楼
荒村听雨31
2011-07-08
1 楼
bruce.peng
2009-11-23
今天正好要这个,拿来用了。谢谢
发表评论
-
图片背景使用九宫格
2012-07-24 10:20 0[Embed(source="../ass ... -
Flex弹出窗口做为Module
2012-07-23 18:00 0今天才知道原来TitleWindow也可以单独编译 ... -
Repeater使用简介
2012-05-09 19:26 1600mx组件中的Repeater类似与sprak中的Da ... -
Flex失效机制
2012-02-29 17:19 2974一、什么是失效机 ... -
Image倒影效果
2012-02-20 10:11 1683利用spark的BitmapImage实现倒影效果 ... -
Flex设置z轴的index
2012-02-13 14:58 4742flex4的UIComponent新增了dept ... -
得到一个字符的Unicode编码
2012-02-09 12:59 1968ActionScript 3.0String类中函数charC ... -
解决PopupManager.createPopup报错:状态“inactive”未定义
2012-02-04 21:27 2198出现这种的场景是在Module中使用弹出窗口Pop ... -
用chrome浏览器调试flex程序
2012-02-04 18:55 6882开发flex程序难免需要debug,但是IE8浏 ... -
Flash Player11不能输入中文,请谨慎升级
2011-12-18 01:04 2649很多时候,Flash的程序需要集成到其他系统中 ... -
优化Flash Builder
2011-12-18 00:54 2633Flash Builder4中新增了一个ASDO ... -
设置DataGrid的DataGridColumn的width
2011-12-18 00:42 5141DataGrid的column的width属性不 ... -
RollOver和MouseOver的不同
2011-12-12 15:03 3004共同点:都是针对鼠标的进入和进出事件。 ... -
转 Adobe移动战略失败的幕后
2011-12-08 15:56 1332最近一段时间,Adobe和Apple两个昔日的好伙 ... -
Flash Builder该这样编译,希望adboe的人能看到
2011-12-06 12:17 0从3.0开始使用flash builder,对f ... -
List或DataGrid可变行高
2011-11-29 21:57 3128默认情况下List组件是每行的行高是固定的,但 ... -
访问flex sdk版本和Flash player版本
2011-11-16 15:52 1332下面的代码将flex sdk的版本号和Fla ... -
设置TitleWindow的closeButton的mode
2011-11-16 15:42 1180默认情况下,TitleWindow的closeBu ... -
DataGrid header显示tooltip
2011-11-15 17:18 2505有时需要在DataGrid的header上显示 ... -
flash右键菜单项关键字
2011-11-15 16:26 1199有时需要在flash的右键菜单中添加 删除 ...
相关推荐
flex-datagrid-advancedDataGrid-demo,做的datagrid及advanceddatagrid的例子,希望大家喜欢
Flex dataGrid 全选、反选 checkBox 不是很完善,但很有借鉴意义
flex DataGrid中文字符排序类 用法见 http://blog.sina.com.cn/s/blog_5fc933730100iign.html
NULL 博文链接:https://yunzhongxia.iteye.com/blog/652902
flex datagrid 实现合计功能控件包 带源码,demo fxp是flex4的工程文件,导入到工作空间即可 直接导入项目即可。 更多访问我的blog www.dplayer.net
flex datagrid 改变指定行的背景颜色,可直接使用
这个分页只与后台交互一次,然后将获得的集合在前台进行分页显示。
flex datagrid资料,下载的别人的,想弄点分数啊
NULL 博文链接:https://yunzhongxia.iteye.com/blog/852896
成功的实现了,datagrid中嵌套checkbox实现全选的功能。分享代码供大家分享。项目为flex3。
NULL 博文链接:https://windmark.iteye.com/blog/1716422
NULL 博文链接:https://yunzhongxia.iteye.com/blog/1145400
在FLEX4中开发带有过滤功能的DATAGRID组件
flex 通过读取xml文件 实现动态DataGrid数据列表
flex Datagrid checkbox全选 Datagrid
FLEX的datagrid合计、平均值,很好的例子代码拿来就可以用
可以通过简单的一个标签实现一个表的checkbox功能,当然我才学了不到一个星期,可以在原来的基础上进行扩展,希望交流下我的邮箱是llaysz@163.com,如果大家把它变强大了记得给我发一份谢谢了
Flex DataGrid从XML文件中加载数据
带多选框的DataGrid(AdvancedDataGrid) 表头有全选CheckBox,三种状态:全选、部分选择、无选择 如果改变目录结构,需要在CustomCheckBox.mxml中更改inner.png的路径 使用方法参考“示例参考.txt” --------------...
NULL 博文链接:https://songwensheng.iteye.com/blog/797545