多种DataGrid ItemRender实现

最新推荐文章于 2018-05-29 17:58:09 发布

最新推荐文章于 2018-05-29 17:58:09 发布 · 176 阅读

文章标签：

#Flex #C #C++ #C#

Flex3 专栏收录该内容

43 篇文章

订阅专栏

本文介绍了在Flex开发中如何为DataGrid自定义多种类型的ItemRenderer，包括复选框、颜色选择器、滑块等，并提供了具体的代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在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函数。