在Flex开发中,可能在展示数据方面,DataGrid是用得最多的组件。在默认情况下,DataGrid的单元格是String类型的数据,但是有时候我们为了满足一些特殊的开发需求,需要自定义特殊的DataGrid Itemrender。下面几种常见的ItemRender实现:
1.CheckBoxr渲染:
final public class CheckBoxItemDataRenderer extends CheckBox { public function CheckBoxItemDataRenderer() { super(); this.addEventListener(Event.CHANGE, changeHandler); } override public function set data(value:Object):void { super.data = value; this.selected = listData.label == 'true'; } protected function changeHandler(event : Event) : void { data.@selected = this.selected; } }
2.ColorPicker渲染:
final public class ColorItemRender extends ColorPicker implements IVariousDataGridItem { public function ColorItemRender() { super(); this.width = 22; this.height = 22; this.addEventListener(FlexEvent.VALUE_COMMIT, valueCommitHandler); } private var _itemData : Object; private function valueCommitHandler(event : FlexEvent) : void { if(_itemData) _itemData.pvalue = super.selectedColor; } public function set data(value : Object):void { _itemData = value; super.selectedColor = Number(value.pvalue); } private function rgbToHex(color:uint):String { // Find hex number in the RGB offset var colorInHex:String = color.toString(16); var c:String = "00000" + colorInHex; var e:int = c.length; c = "0x" + c.substring(e - 6, e); return c.toUpperCase(); } }
3.Hsilder渲染:
final public class HSliderItemRender extends HSlider implements IVariousDataGridItem { public function HSliderItemRender(min:Number,max:Number,interval:Number,lbls:Array) { super(); this.minimum=min; this.maximum=max; this.tickInterval=interval; this.snapInterval=1; this.labels=lbls; this.width = 150; this.height = 22; this.addEventListener(FlexEvent.VALUE_COMMIT, valueCommitHandler); } private var _itemData : Object; public function get text() : String{return String(super.value);} public function set text(avalue : String) : void{super.value=Number(avalue);} private function valueCommitHandler(event : FlexEvent) : void { if(_itemData) _itemData.pvalue = super.value } public function set data(value : Object):void { _itemData = value; super.value = Number(_itemData.pvalue); } }
4.TextInput渲染:
final public class StringItemRender extends TextInput implements IVariousDataGridItem { public function StringItemRender() { super(); this.width = 80; this.height = 25; this.addEventListener(FlexEvent.VALUE_COMMIT, valueCommitHandler); } private var _itemData : Object; private function valueCommitHandler(event : FlexEvent) : void { if(_itemData) _itemData.pvalue = super.text; } override public function set data(value : Object):void { super.data = value; this.text = value.pvalue; _itemData = value; } }
5.CheckBox渲染:
final public class EnumItemRender extends ComboBox implements IVariousDataGridItem { private var enumString:String=""; public function EnumItemRender(aEnumString:String="") { super(); this.width = 80; this.height = 25; this.enumString=aEnumString; this.addEventListener(FlexEvent.VALUE_COMMIT, valueCommitHandler); } private var _itemData : Object; private function valueCommitHandler(event : FlexEvent) : void { if(_itemData) _itemData.pvalue = super.selectedItem; } override public function set data(value : Object):void { _itemData = value; super.data = _itemData; super.dataProvider = enumString.split("|"); super.selectedItem = _itemData.pvalue; } }
6.需要实现的接口:
public interface IVariousDataGridItem extends IUIComponent { function get text() : String; function set text(value : String) : void; function set data(value : Object) : void; }
PS:其实DataGrid的ItmerRender实现大同小异,只要是继承自不同的组件,然后override data的Set函数。