首页 > 设计 > WEB开发 > 正文

7.8.为DataGrid创建一个独立的复选框项渲染器

2023-08-02 23:09:30
字体:
来源:转载
供稿:网友
7.8.1.问题
你要为DataGrid 创建一个含有CheckBox 的itemRenderer,无论DataGridColumn 的宽度如何,都要始终保持CheckBox 在renderer 的中央。
7.8.2. 解决办法
继承CheckBox 的类,并且重写updateDisplayList 方法,从而设置CheckBox 的位置,在clickHandler 中增加部分功能:根据CheckBox 的选中状态设置DataGrid 里的变量值。
7.8.3. 讨论
下边是一个可以把自己放置在DataGridColumn 中央的itemRenderer。这个类己经完成了所有renderer 的功能,并且把MouseEvent 继续向外派发,如果你对这个事件感兴趣,可以捕获它,并做某些操作。例如你可以在DataGrid 所在的文件里注册一个监听器用于监听MouseEvent,在事件发生之后可以使一个Lable 显示当前己被选中CheckBox 的个数。
+展开
-ActionScript
package {
import flash.display.DisplayObject;
import flash.events.MouseEvent;
import flash.text.TextField;
import mx.controls.CheckBox;
import mx.controls.dataGridClasses.DataGridListData;
public class CenteredCheckBoxItemRenderer extends CheckBox {
// this function is defined by mx.controls.CheckBox
// it is the default handler for its click event
override protected function clickHandler(event:MouseEvent):void {
super.clickHandler(event);
data[DataGridListData(listData).dataField] = selected;
}
// center the checkbox icon
override protected function updateDisplayList(w:Number,h:Number):void{
super.updateDisplayList(w, h);
var n:int = numChildren;
for (var i:int = 0; i < n; i++){
var c:DisplayObject = getChildAt(i);
// CheckBox component is made up of icon skin and label TextField
// we ignore the label field and center the icon
if(!(c is TextField)){
c.x = Math.round((w - c.width) / 2);
c.y = Math.round((h - c.height) / 2);
}
}
}
}
}

在以上的代码中有两点值得注意:1、这个类没有实现ClassFactory 接口,这意味着,我们可以把这个类的全名作为DataGrid 的itemRenderer 属性。又因为这个类是一个dropin renderer ,因为他继承了CheckBox ,CheckBox 继承了Button,Button 实现了IDropInListItemRenderer 接口, 所以你可以根据一个传入来的外部变量设置它的选中状态。2、你不必去重写data 的set get 方法,因为这些方法我们己经从CheckBox 那里继承了。
 
+展开
-ActionScript
data[DataGridListData(listData).dataField] = selected;

这里我们用了listData,这是IDropInListItemRenderer 里定义的属性,也就是说,所有drop-in renderer 都有这个属性,系统创建renderer 时会首先初始化listData 这个属性,接下来才会根据listData 去初始化data。dataField 是我们在column 上配置的属性,在本例中, dataField 应该是CheckBox 在dataprovider 里对应的属性名。这样,data[DataGridListData(listData).dataField]就是那个属性名对应的值了,在这里说值,不太恰当,因为它在等号左边,这里应该说是dataProvider 里那个变量的引用,就是说,你改了它,dataProvider 里的值也就跟着改了。

原文是想说明,如何设置itemRenderer 中的组件处于单元格的中央,可是整节都在讲listData。不过,设置位,却实没有什么可说的,都在updateDisplayList 中。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表