使用ItemRenderer处理基于List容器的显示内容 [DataGrid, Tree, List等]

转载于: http://liguoliang.com/2009/01/678/

具体的情况如:使用labelFunction处理DataGrid显示内容 , 只是这里使用的是ItemRender来实现并实现更多功能.

如Student中有一Gender_属性, 1表示男生, 2表示女生, 3表示未知, 现在有下要求:

1. 在DataGrid中不可以显示1, 2,3, 应显示 男女 [ 该功能可由LabelFunction实现],

2. 如果为男生,, 则”男生”颜色为红色, 女生颜色为默认, 未知字体大小为10号

具体实现:

view plaincopy to clipboardprint?
var columnGender:DataGridColumn = new DataGridColumn(); 
columnGender.headerText = "Gender"; 
columnGender.dataField = "Gender_"; //使用ItemRender 
columnGender.itemRenderer =  new ClassFactory(Gender_Label); 
//columnGender.labelFunction = formatGender; 
 
_dataGridStudent.columns = [columnID, columnName, columnAge, columnGender]; 
ItemRender实现: 该类将继承List, 重写其UpdateDisplayList函数, 如下:

view plaincopy to clipboardprint?
package com.test.itemRender 

import mx.controls.Label; 
import mx.controls.listClasses.ListBase; 
 
public class Gender_Label extends Label 

    /**
     * 构造函数
     */ 
    public function Gender_Label() { 
        super(); 
    } 
 
    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { 
        super.updateDisplayList(unscaledWidth, unscaledHeight); 
        if(data.Gender_ == 1) { 
             setStyle('fontSize',14); 
             setStyle('fontWeight', 'bold'); 
             setStyle('color', 0xDD0000); 
             this.text = "男生"; 
         }else if(data.Gender_ == 2) { 
            setStyle('fontSize',14); 
            this.text = "女生" 
         } 
         //otherwise, return the label to its regular state 
         else { 
             setStyle('fontSize', 10); 
             this.text = "未知"; 
         } 
    } 
 
}// end of class 
}// end of package 
最终效果:
使用ItemRenderer处理基于List容器的显示内容 [DataGrid, Tree, List等]

你可能感兴趣的:(itemRenderer)