- 浏览: 1534350 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (673)
- Linux (3)
- android (302)
- php (12)
- struts2 (1)
- Flex积累 (88)
- Hibernate (8)
- MyEclipse (18)
- android备忘录 (209)
- Java备忘录 (53)
- spring (0)
- Flex备忘录 (30)
- JavaScript (10)
- Tomcat (11)
- Flex FrameWork (0)
- 设计模式学习 (4)
- 休闲娱乐 (4)
- Flex skin (1)
- Flex 组件 (2)
- 持久化相关 (2)
- DotNet相关 (5)
- Flex Style (1)
- Windows (11)
- Flex AIR (9)
- MySQL (1)
- mac OSX (29)
- eclipse (26)
- database (5)
- ARM (1)
- English (1)
- WebService (8)
- javabase64 (2)
- ruby (1)
- sqlite (5)
- ios (7)
- 无线应用 (1)
- Java (3)
- goagent (1)
- oc (1)
最新评论
-
Z_ying:
谢谢分享,上次也遇到过的,解决了,过了一段时间又忘记,幸亏看到 ...
FastJson 示例 及问题 -
wto8559:
这是什么错啊,我也遇到了.问下写一个servlet能解决什么问 ...
Exception in thread "HouseKeeper" java.lang.NullPointerException -
zxjlwt:
如何用php怎么弄了。http://surenpi.com
\U672a\U77e5\U9519\U8bef 字符还原 -
windseamless:
那怎么样才能屏蔽呢
java.lang.IllegalArgumentException: Window type can not be changed after the -
macleo:
Trinea 写道还是利用Fiddler抓包更方便,(1)无需 ...
android网络抓包相关
http://blog.yotuo.net/post/2009/11/DataGrid-CheckBoxColumn.html
最近在尝试着用Flex做个文件按管理的工具,在文件列表中为了操作方便,想到了再列表控件DataGird中添加一个含有复选框的列,在表头的复选框可以实现全选功能,但DataGird自身并无此功能。参照网上的相关资料,总算折腾出来了,现把源码奉上,希望对需要的朋友有点帮助,不足之处也请高手指点。 最终的CheckBoxColumn包包含四个相关的类文件,分别是: 1、CenterCheckBox.as:通过重写CheckBox基类来实现复选框的居中显示; 2、CheckBoxColumn.as:继承自DataGridColumn的一个新类,为了实现需要,增添了几个新属性; 3、CheckBoxHeaderRenderer.as:继承自CenterCheckBox 类,用于DataGrid表头的复选框,实现全选功能; 4、CheckBoxItemRenderer.as:继承自CenterCheckBox 类,用于DataGrid表中的数据行; 各文件源码如下:
1、CenterCheckBox.aspackage Common.YotuoUpload.CheckBoxColumn
{
import flash.display.DisplayObject;
import mx.controls.CheckBox;
import flash.text.TextField;
public class CenterCheckBox extends CheckBox
{
// 居中展现
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var n:int = numChildren;
for(var i:int = 0; i < n; i++)
{
var c:DisplayObject = getChildAt(i);
if( !(c is TextField))
{
c.x = Math.round((unscaledWidth - c.width) / 2);
c.y = Math.round((unscaledHeight - c.height) /2 );
}
}
}
}
}
2、DataGridColumn.as
package Common.YotuoUpload.CheckBoxColumn { import mx.controls.dataGridClasses.DataGridColumn; public class CheckBoxColumn extends DataGridColumn{ public var cloumnSelected:Boolean=false;//保存该列是否全选的属性(用户先点击全选后在手动的取消几行数据的选中状态时,这里的状态不会改变) public var selectItems:Array = new Array();//用户保存用户选中的数据 public function CheckBoxColumn(columnName:String=null){ super(columnName); } } }
3、CheckBoxHeaderRenderer.as
package Common.YotuoUpload.CheckBoxColumn { import flash.events.Event; import mx.collections.ArrayCollection; import mx.controls.CheckBox; import mx.controls.DataGrid; public class CheckBoxHeaderRenderer extends CenterCheckBox{ private var _data:CheckBoxColumn;//定义CheckBox列对象 public function CheckBoxHeaderRenderer(){ super(); this.addEventListener(Event.CHANGE,onChange);//CheckBox状态变化时触发此事件 this.toolTip = "全选"; } override public function get data():Object{ return _data;//返回的是CheckBox列的对象 } override public function set data(value:Object):void{ _data = value as CheckBoxColumn; //trace(_data.cloumnSelected); selected = _data.cloumnSelected; } private function onChange(event:Event):void{ var dg:DataGrid = DataGrid(listData.owner);//获取DataGrid对象 var column:CheckBoxColumn = dg.columns[listData.columnIndex];//获取整列的显示对象 var dgDataArr:ArrayCollection = dg.dataProvider as ArrayCollection; column.cloumnSelected = this.selected;//更改列的全选状态 column.selectItems = new Array();//重新初始化用于保存选中列的对象 if(this.selected){//如果为全部选中的化就将数据源赋值给column.selectItems,不是就不管他,上一步已经初始化为空 column.selectItems = (dg.dataProvider as ArrayCollection).toArray(); } if(dgDataArr.length>0){ if(dgDataArr[0]!=""){ for(var i:int = 0; i < dgDataArr.length ; i++){ Object(dgDataArr[i]).dgSelected = this.selected;//更改没一行的选中状态 } } } dgDataArr.refresh();//刷新数据源,达到强制更新页面显示效果的功能,防止在使用时没有在VO类中使用绑定而出现点击全选页面没有更改状态的错误 } } }
4、CheckBoxItemRenderer.as
package Common.YotuoUpload.CheckBoxColumn { import flash.events.Event; import flash.events.MouseEvent; import mx.controls.CheckBox; import mx.controls.DataGrid; public class CheckBoxItemRenderer extends CenterCheckBox{ private var currentData:Object; //保存当前一行值的对象 public function CheckBoxItemRenderer(){ super(); this.addEventListener(Event.CHANGE,onClickCheckBox); this.toolTip = "选择"; } override public function set data(value:Object):void{ this.selected = value.dgSelected; this.currentData = value; //保存整行的引用 } //点击check box时,根据状况向selectedItems array中添加当前行的引用,或者从array中移除 private function onClickCheckBox(e:Event):void{ var dg:DataGrid = DataGrid(listData.owner);//获取DataGrid对象 var column:CheckBoxColumn = dg.columns[listData.columnIndex];//获取整列的显示对象 var selectItems:Array = column.selectItems; this.currentData.dgSelected = this.selected;//根据是否选中的状态,更改数据源中选中的标记 if(this.selected){ selectItems.push(this.currentData); }else{ for(var i:int = 0; i<selectItems.length; i++){ if(selectItems[i] == this.currentData){ selectItems.splice(i,1) } } } } } }调用示例:
1、在mxml中作为控件调用:
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768" xmlns:CheckBoxColumn="Common.YotuoUpload.CheckBoxColumn.*" creationComplete="Init()"> <fx:Script> <![CDATA[ import Common.YotuoUpload.CheckBoxColumn.CheckBoxHeaderRenderer; import Common.YotuoUpload.CheckBoxColumn.CheckBoxItemRenderer; import mx.collections.ArrayCollection; public var dataArray:ArrayCollection = new ArrayCollection; private function Init():void{ dataArray.addItem({isSelected:false,name:'Christina Coenraets',phone:'555-219-2270',email:'ccoenraets@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Joanne Wall',phone:'555-219-2012',email:'jwall@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Maurice Smith',phone:'555-219-2012',email:'maurice@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Mary Jones',phone:'555-219-2000',email:'mjones@fictitious.com'}); dataArray.addItem({isSelected:false,name:'God Win',phone:'555-219-2005',email:'godwin@fictitious.com'}); dgUser.dataProvider = dataArray; } ]]> </fx:Script> <mx:DataGrid id="dgUser" x="10" y="10" width="450" height="200"> <mx:columns> <CheckBoxColumn:CheckBoxColumn dataField="isSelected" width="25" draggable="false" resizable="false" sortable="false" headerRenderer="{new ClassFactory(CheckBoxHeaderRenderer)}" itemRenderer="{new ClassFactory(CheckBoxItemRenderer)}" /> <mx:DataGridColumn headerText="姓名" dataField="name"/> <mx:DataGridColumn headerText="电话" dataField="phone"/> <mx:DataGridColumn headerText="邮件" dataField="email"/> </mx:columns> </mx:DataGrid> </s:Application>
2、通过代码动态调用:
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768" creationComplete="Init()"> <fx:Script> <![CDATA[ import mx.controls.dataGridClasses.DataGridColumn; import Common.YotuoUpload.CheckBoxColumn.CheckBoxColumn; import Common.YotuoUpload.CheckBoxColumn.CheckBoxHeaderRenderer; import Common.YotuoUpload.CheckBoxColumn.CheckBoxItemRenderer; import mx.collections.ArrayCollection; public var dataArray:ArrayCollection = new ArrayCollection; private function Init():void{ dataArray.addItem({isSelected:false,name:'Christina Coenraets',phone:'555-219-2270',email:'ccoenraets@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Joanne Wall',phone:'555-219-2012',email:'jwall@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Maurice Smith',phone:'555-219-2012',email:'maurice@fictitious.com'}); dataArray.addItem({isSelected:false,name:'Mary Jones',phone:'555-219-2000',email:'mjones@fictitious.com'}); dataArray.addItem({isSelected:false,name:'God Win',phone:'555-219-2005',email:'godwin@fictitious.com'}); var _checkBoxCloumn:CheckBoxColumn = new CheckBoxColumn(); _checkBoxCloumn.dataField = "isSelected"; _checkBoxCloumn.headerRenderer = new ClassFactory(CheckBoxHeaderRenderer); _checkBoxCloumn.itemRenderer = new ClassFactory(CheckBoxItemRenderer); _checkBoxCloumn.width = 30; _checkBoxCloumn.sortable = false; _checkBoxCloumn.draggable = false; var _nameColumn:DataGridColumn = new DataGridColumn(); _nameColumn.headerText = "姓名"; _nameColumn.dataField = "name"; var _telColumn:DataGridColumn = new DataGridColumn(); _telColumn.headerText = "电话"; _telColumn.dataField = "phone"; var _emailColumn:DataGridColumn = new DataGridColumn(); _emailColumn.headerText = "邮件"; _emailColumn.dataField = "email"; dgUser.columns = new Array(_checkBoxCloumn,_nameColumn,_telColumn,_emailColumn); dgUser.dataProvider = dataArray; } ]]> </fx:Script> <mx:DataGrid id="dgUser" x="10" y="10" width="450" height="200" /> </s:Application>PS:该组件要求在数据源中存在属性isSelected(Boolean类型,用来记录当前行是否被选中)属性,这样就限制了程序的通用性,试了很多方法都未很好解决,希望有办法解决的朋友给以指点。
示例运行效果:
发表评论
-
Flex与Struts2整合相关
2011-08-12 00:14 11421.http://jusesgod.iteye.com/blo ... -
郁闷的查询
2011-08-03 10:19 820浪费了4个小时,只是少了一个“0” -
flex 中错误收集
2011-07-06 06:19 999A pseudo attribute name is expe ... -
The current workspace was created by a previous version of flash builder 解决
2011-07-06 04:46 1218升级了sdk到4.5.1,每次打开总是 其实不理它,至少目前 ... -
在用Flex做项目的时候,一些小经验
2011-06-23 04:09 1223http://hi.baidu.com/interces ... -
Flex 资源收集
2011-06-23 02:20 1050http://www.adobe.com/cfusion/ex ... -
Flex printjob 相关资料收集
2011-06-18 21:36 10731.http://fengxiangpiao.iteye.co ... -
ActionScript 3 Reference 总是 retrieve data from...解决
2011-06-18 21:26 917actionscript api reference 总是 r ... -
Flex module 学习总结
2011-06-08 22:55 1198Adobe 写道 To see an example of ... -
Flex4中自定义组件的元标签
2011-06-03 23:09 3084Adobe 写道 Metadata tags in c ... -
关于flex添加音频的方法
2011-05-26 21:14 1958参考: http://bbs.airia.cn/th ... -
ActionScript组件开发
2011-05-26 10:33 1280http://sunshineyao.iteye.com/bl ... -
Flash Builder 4.5 and Flex sdk 4.5 (hero) release...
2011-05-25 11:33 1022Flex 4.5 介绍.... http://www.ado ... -
Flex ActionScript 建模工具和代码生成工具一览
2011-05-25 09:40 1727http://seantheflexguy.com/blog/ ... -
Flex数据交互方法 :httpservice, webservice, RemoteObject, socket
2011-05-24 22:12 1479http://hi.baidu.com/zhao_gw/blo ... -
终于在Google App Engine/Java(GAE/J)上成功部署运行Flex+BlazeDS
2011-05-24 15:58 2575http://www.iteye.com/topic/4283 ... -
Flex 之 郁闷 swc生成
2011-05-22 20:51 3699找了个组件....想方便日后使用...搞成swc..以后只要c ... -
Flex Time 组件相关
2011-05-21 23:28 518DateField 只能选日期,居然没有时间...日了... ... -
Cannot create class of type 'XXX'. Type 'XXX' not found.
2011-05-21 09:18 2623http://blog.csdn.net/ozzy_003/a ... -
Flex blog 收集
2011-05-20 21:27 9981.http://hi.baidu.com/luming198 ...
相关推荐
绝对好东西,datagrid 标题栏及 datagridcolumn 添加 checkbox
如何改变Flex中DataGrid某一DataGridColumn显示内容的字体颜色
flex中动态添加复选框(checkBox)。
重写DataGridColumn,使得VS2003的DataGrid有和DataGridView中的单元格有类似的显示样式
var dataGridColumn:DataGridColumn = new DataGridColumn(arrData[2]); dataGridColumn.headerText=arrData[0]; dataGridColumn.width=150; dataGridColumn.editable=false; var arrays:Array = new Array(); ...
Flex datagrid 不可以设置列宽,用这个试试吧,hehe
用得多了,发觉自己了解的真的是九牛之一毛都没有,最近用到了从后台读出数据时显示的问题,相信很多人都有用整形数据来代替字符串数据的情况
Xamarin.Forms.DataGrid Xamarin.Forms应用程序的DataGrid库。 您可以从NuGet程序包管理器安装程序包 pm > Install-Package Xamarin.Forms.DataGrid 支持平台安卓的iOS 超人 用法() 从Xaml使用之前,应先调用...
axui-datagrid 演示: : 安装npm install axui-datagrid跑步git clone https://github.com/jsdevkr/axui-datagrid.gitcd axui-datagridnpm inpm start特征大数据冻结行/列多头加载中 行选择器 内联编辑 足部总结 ...
import mx.controls.CheckBox; import mx.controls.Alert; import com.as3xls.xls.ExcelFile; import com.as3xls.xls.Sheet; import flash.filesystem.*; [Bindable] private var dp:Array = [ {idx:...
主要特点: 资料筛选资料编辑多种分类多级分组多记录选择(Shift +单击“全选”以单击,Ctrl +单击“添加单击以单击以选择”) 您可以在这里查看示例的现场演示 最基本的网格设置 (Record.GetRandomRecords(50000))...
解析数据用了flex的JSON包。 这段代码放在要显示树的canvas下 rootLable="根节点" //树的根节点名 destination="flexService" //remoteObject 的destination remoteServer="true" id="asyntree1" ...
Page1的ListView是别人的代码。... ObservableCollection<DataGridColumn> collec=new ObservableCollection<DataGridColumn> ();我们控件不是listview类型的,所以不能 public GridViewColumnCollection collec;。
flex 导出excel工具包 用法如下: import com.as3xls.xls.ExcelFile; import com.as3xls.xls.Sheet; import mx.collections.ArrayCollection; import mx.controls.DataGrid; import mx.controls.dataGridClasses....
将DataGrid控件的AllowSorting属性设置为True,并将DataGridColumn的SortExpression属性设置为 “ProductName DESC”.以显示ProductName。然后将这个DataTable对象绑定到DataGrid控件。 D. 将DataTable对象的...