DDR爱好者之家 Design By 杰米
如果仅仅只是简单的显示数据,或者对显示数据做一些格式化操作,基本的DataGrid,加labelFunction支持就可以满足了,但大多我们需要针对不同的数据和对象,进行不同的渲染,比如checkbox啦,下拉选择框,日期等等,再比如自己控制显示复杂视图,比如Gantt图之类。这就必须扩展ItemRenderer和HeaderRenderer。
(1)有关ItemRenderer的类实现IDataRenderer和IDropInListItemRenderer接口。
很多flex control类都默认实现了IDataRenderer接口,比如Button、Container、TextArea等等。很多flex control类也实现了IDropInListItemRenderer接口,但可惜Container没有默认实现。而我做的东西,需要绘图,所以直接利用Canvas扩展,就必须自己实现IDropInListItemRenderer接口,来获取ListData对象。
复制代码 代码如下:
private var _listData:BaseListData;
// Make the listData property bindable.
[Bindable("dataChange")]
public function get listData():BaseListData
{
return _listData;
}
public function set listData(value:BaseListData):void
{
_listData = value;
}
private var _listData:BaseListData;
// Make the listData property bindable.
[Bindable("dataChange")]
public function get listData():BaseListData
{
return _listData;
}
public function set listData(value:BaseListData):void
{
_listData = value;
}
可惜俺刚开始不知道之个,所以耗费了很长时间,花费在寻找如何获取当前Column index问题上。
这样,我才可以在setData方法中,获取到DataGridColumn对象,如下(我使用的是AdvancedDataGrid对象):
复制代码 代码如下:
var dg:AdvancedDataGrid = this.owner as AdvancedDataGrid;
//listData就是实现IDropInListItemRenderer接口所可以获取的
var gdgc:GanttAdvancedDataGridColumn =
dg.columns[listData.columnIndex] as GanttAdvancedDataGridColumn;
var dg:AdvancedDataGrid = this.owner as AdvancedDataGrid;
//listData就是实现IDropInListItemRenderer接口所可以获取的
var gdgc:GanttAdvancedDataGridColumn =
dg.columns[listData.columnIndex] as GanttAdvancedDataGridColumn;
(2)扩展DataGridColumn对象来增加属性,传递参数。
有些属性我需要动态从外面传递进来,但有不属于list data数据的部分。而Grid Header需要利用这些数据做一些渲染操作。这时候就需要扩展实现DataGridColumn对象,同时在HeaderRenderer对象中获取此DataGridColumn对象来获取参数。
如下是扩展的一个AdvanceDataGridColumn使用,在这个扩展中,增加了startDate和lastDate两个属性
复制代码 代码如下:
<gantt:GanttAdvancedDataGridColumn id="ganttColumn" headerText="Gantt" itemRenderer="{ganttItemEditor}" headerRenderer="{ganttHeaderEditor}" minWidth="400"/>
<gantt:GanttAdvancedDataGridColumn id="ganttColumn" headerText="Gantt" itemRenderer="{ganttItemEditor}" headerRenderer="{ganttHeaderEditor}" minWidth="400"/>
这样,就可以在application初始化的时候,在外部对此Column进行设置:
复制代码 代码如下:
ganttColumn.startDate = new Date(startTime);
ganttColumn.lastDate = new Date(lastTime);
ganttColumn.startDate = new Date(startTime);
ganttColumn.lastDate = new Date(lastTime);
在HeaderRenderer中,在setData方法中,可以获取相应的对象和参数
复制代码 代码如下:
override public function set data(value:Object):void{
super.data = value;
var advancedDataGridColumn:GanttAdvancedDataGridColumn
= value as GanttAdvancedDataGridColumn;
if(advancedDataGridColumn!=null){
if(advancedDataGridColumn.startDate!=null){
startDate = advancedDataGridColumn.startDate;
lastDate = advancedDataGridColumn.lastDate;
render();
}
}
}
override public function set data(value:Object):void{
super.data = value;
var advancedDataGridColumn:GanttAdvancedDataGridColumn
= value as GanttAdvancedDataGridColumn;
if(advancedDataGridColumn!=null){
if(advancedDataGridColumn.startDate!=null){
startDate = advancedDataGridColumn.startDate;
lastDate = advancedDataGridColumn.lastDate;
render();
}
}
}
(3)利用labelFunction进行显示数据格式化
比如我想对日期数据进行格式化操作,如下所示:
复制代码 代码如下:
private function date_labelFunc(item:Object, column:AdvancedDataGridColumn):String {
var dateFormatter:DateFormatter = new DateFormatter();
dateFormatter.formatString = "YYYY-MM-DD HH:NN";
var td:Date = new Date( new Number(item[column.dataField]) );
return dateFormatter.format( td );
}
private function date_labelFunc(item:Object, column:AdvancedDataGridColumn):String {
var dateFormatter:DateFormatter = new DateFormatter();
dateFormatter.formatString = "YYYY-MM-DD HH:NN";
var td:Date = new Date( new Number(item[column.dataField]) );
return dateFormatter.format( td );
}
在mx的datagridcolumn中,就可以引用这个label function
复制代码 代码如下:
<mx:AdvancedDataGridColumn headerText="startTime" dataField="startTime" labelFunction="date_labelFunc" width="120"/>
<mx:AdvancedDataGridColumn headerText="startTime" dataField="startTime" labelFunction="date_labelFunc" width="120"/>
(1)有关ItemRenderer的类实现IDataRenderer和IDropInListItemRenderer接口。
很多flex control类都默认实现了IDataRenderer接口,比如Button、Container、TextArea等等。很多flex control类也实现了IDropInListItemRenderer接口,但可惜Container没有默认实现。而我做的东西,需要绘图,所以直接利用Canvas扩展,就必须自己实现IDropInListItemRenderer接口,来获取ListData对象。
复制代码 代码如下:
private var _listData:BaseListData;
// Make the listData property bindable.
[Bindable("dataChange")]
public function get listData():BaseListData
{
return _listData;
}
public function set listData(value:BaseListData):void
{
_listData = value;
}
private var _listData:BaseListData;
// Make the listData property bindable.
[Bindable("dataChange")]
public function get listData():BaseListData
{
return _listData;
}
public function set listData(value:BaseListData):void
{
_listData = value;
}
可惜俺刚开始不知道之个,所以耗费了很长时间,花费在寻找如何获取当前Column index问题上。
这样,我才可以在setData方法中,获取到DataGridColumn对象,如下(我使用的是AdvancedDataGrid对象):
复制代码 代码如下:
var dg:AdvancedDataGrid = this.owner as AdvancedDataGrid;
//listData就是实现IDropInListItemRenderer接口所可以获取的
var gdgc:GanttAdvancedDataGridColumn =
dg.columns[listData.columnIndex] as GanttAdvancedDataGridColumn;
var dg:AdvancedDataGrid = this.owner as AdvancedDataGrid;
//listData就是实现IDropInListItemRenderer接口所可以获取的
var gdgc:GanttAdvancedDataGridColumn =
dg.columns[listData.columnIndex] as GanttAdvancedDataGridColumn;
(2)扩展DataGridColumn对象来增加属性,传递参数。
有些属性我需要动态从外面传递进来,但有不属于list data数据的部分。而Grid Header需要利用这些数据做一些渲染操作。这时候就需要扩展实现DataGridColumn对象,同时在HeaderRenderer对象中获取此DataGridColumn对象来获取参数。
如下是扩展的一个AdvanceDataGridColumn使用,在这个扩展中,增加了startDate和lastDate两个属性
复制代码 代码如下:
<gantt:GanttAdvancedDataGridColumn id="ganttColumn" headerText="Gantt" itemRenderer="{ganttItemEditor}" headerRenderer="{ganttHeaderEditor}" minWidth="400"/>
<gantt:GanttAdvancedDataGridColumn id="ganttColumn" headerText="Gantt" itemRenderer="{ganttItemEditor}" headerRenderer="{ganttHeaderEditor}" minWidth="400"/>
这样,就可以在application初始化的时候,在外部对此Column进行设置:
复制代码 代码如下:
ganttColumn.startDate = new Date(startTime);
ganttColumn.lastDate = new Date(lastTime);
ganttColumn.startDate = new Date(startTime);
ganttColumn.lastDate = new Date(lastTime);
在HeaderRenderer中,在setData方法中,可以获取相应的对象和参数
复制代码 代码如下:
override public function set data(value:Object):void{
super.data = value;
var advancedDataGridColumn:GanttAdvancedDataGridColumn
= value as GanttAdvancedDataGridColumn;
if(advancedDataGridColumn!=null){
if(advancedDataGridColumn.startDate!=null){
startDate = advancedDataGridColumn.startDate;
lastDate = advancedDataGridColumn.lastDate;
render();
}
}
}
override public function set data(value:Object):void{
super.data = value;
var advancedDataGridColumn:GanttAdvancedDataGridColumn
= value as GanttAdvancedDataGridColumn;
if(advancedDataGridColumn!=null){
if(advancedDataGridColumn.startDate!=null){
startDate = advancedDataGridColumn.startDate;
lastDate = advancedDataGridColumn.lastDate;
render();
}
}
}
(3)利用labelFunction进行显示数据格式化
比如我想对日期数据进行格式化操作,如下所示:
复制代码 代码如下:
private function date_labelFunc(item:Object, column:AdvancedDataGridColumn):String {
var dateFormatter:DateFormatter = new DateFormatter();
dateFormatter.formatString = "YYYY-MM-DD HH:NN";
var td:Date = new Date( new Number(item[column.dataField]) );
return dateFormatter.format( td );
}
private function date_labelFunc(item:Object, column:AdvancedDataGridColumn):String {
var dateFormatter:DateFormatter = new DateFormatter();
dateFormatter.formatString = "YYYY-MM-DD HH:NN";
var td:Date = new Date( new Number(item[column.dataField]) );
return dateFormatter.format( td );
}
在mx的datagridcolumn中,就可以引用这个label function
复制代码 代码如下:
<mx:AdvancedDataGridColumn headerText="startTime" dataField="startTime" labelFunction="date_labelFunc" width="120"/>
<mx:AdvancedDataGridColumn headerText="startTime" dataField="startTime" labelFunction="date_labelFunc" width="120"/>
DDR爱好者之家 Design By 杰米
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
DDR爱好者之家 Design By 杰米
暂无评论...
更新日志
2024年11月29日
2024年11月29日
- 凤飞飞《我们的主题曲》飞跃制作[正版原抓WAV+CUE]
- 刘嘉亮《亮情歌2》[WAV+CUE][1G]
- 红馆40·谭咏麟《歌者恋歌浓情30年演唱会》3CD[低速原抓WAV+CUE][1.8G]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[320K/MP3][193.25MB]
- 【轻音乐】曼托凡尼乐团《精选辑》2CD.1998[FLAC+CUE整轨]
- 邝美云《心中有爱》1989年香港DMIJP版1MTO东芝首版[WAV+CUE]
- 群星《情叹-发烧女声DSD》天籁女声发烧碟[WAV+CUE]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[FLAC/分轨][748.03MB]
- 理想混蛋《Origin Sessions》[320K/MP3][37.47MB]
- 公馆青少年《我其实一点都不酷》[320K/MP3][78.78MB]
- 群星《情叹-发烧男声DSD》最值得珍藏的完美男声[WAV+CUE]
- 群星《国韵飘香·贵妃醉酒HQCD黑胶王》2CD[WAV]
- 卫兰《DAUGHTER》【低速原抓WAV+CUE】
- 公馆青少年《我其实一点都不酷》[FLAC/分轨][398.22MB]
- ZWEI《迟暮的花 (Explicit)》[320K/MP3][57.16MB]