Flex DataGrid 构建自己的编辑器（itemEditor）

1、首先了解编辑器和渲染器的区别，拿DataGrid来说：

渲染器：也就是当你给DataGrid的dataProvider赋值后，DataGrid用什么形式或者说怎么来显示数据，例如：用什么字体，字体什么颜色等等。DataGrid默认的渲染器是DataGridItemRenderer，他使用文本来显示item。

编辑器：要编辑DataGrid首先制定DataGrid本身是可编辑的（通过editable指定），然后可以指定某一列是否可编辑。编辑器是指当你要修改DataGrid中item的数据，也就是双击时DataGrid决定通过什么方式来编辑，例如：提供给你个ComboBox选择，还是直接提供给你TextInput让你输入，默认的是TextInput。

     再次提一下整个显示、编辑流程：

     1》通过提供dataProvider,dataGrid使用渲染器来显示数据

     2》你通过双击item(前提是指定可编辑)，进入编辑状态，dataGrid使用默认的TextInput或者你自定义的编辑器来供你编辑

     3》编辑完成，或者当前column失去焦点时，编辑状态变成渲染状态，渲染器渲染（显示）默认TextInput的text或者你定义的editor，并显示你在editor自定义并且在dataGrid中通过editorDataField指定的属性

2、要建立自己的编辑器，需要实现IDropInListItemRenderer接口

 implements="mx.controls.listClasses.IDropInListItemRenderer" 

并且要在你自定义的类中提供一个公有的变量来保存新的数据，也就是你在自定义的editor 中编辑以后你要把新的值赋给这个变量，以便item失去焦点时渲染器能获取并且显示这个变量的值，然后在DataGrid的Column中通过editorDataField属性指定这个变量，默认的变量是"text"，因为默认的编辑器是TextInput，他通过text属性传递新值。

<mx:DataGridColumn headerText="姓名" dataField="Name" editorDataField="value"
									   itemEditor="com.google.myEditor"/>

 3、定义编辑器

      com.google.myEditor

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
		 xmlns:s="library://ns.adobe.com/flex/spark" 
		 implements="mx.controls.listClasses.IDropInListItemRenderer" 
		 creationComplete="group1_creationCompleteHandler(event)"
		 xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>

	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			import mx.events.FlexEvent;
			import mx.events.ListEvent;
			
			public var dp:ArrayCollection = new ArrayCollection([{ID:"20111118",Name:"jack"},
																 {ID:"20111117",Name:"tom"}],
																 {ID:"20111116",Name:"harry"}); //模拟的dataProvider
			
			public var value:String; //保存新值
			
			private var _listData:DataGridListData;  //接口的方法，必须实现
			
			[Bindable("dataChange")]
			public function get listData():BaseListData
			{
				
				return _listData;
			}
			
			
			public function set listData(value:BaseListData):void
			{
				
				_listData = DataGridListData(value);
				
				
			}
			
			
			protected function cmb_text_changeHandler(event:ListEvent):void  //当cmb发生change事件时,把新值赋给value
			{

				value = cmb_text.selectedItem.Name;     //例如selectedItem有label属性
			}
			
			

			protected function group1_creationCompleteHandler(event:FlexEvent):void  //这个是如果你原来有值，初始化cmb默认选中
			{
				// TODO Auto-generated method stub
				
				value = data.Name; //把原来的值，也就是你dataGrid的dataField
				
				for(var i:int=0;i<dp.length;i++)
				{
					if(value == dp.getItemAt(i).Name)
					{
						cmb_text.selectedIndex = i;
						cmb_text.dispatchEvent(new ListEvent(ListEvent.CHANGE));
						break;
					}
				}
				
			}

		]]>
	</fx:Script>
	
	
	<mx:ComboBox id="cmb_text" width="100%" change="cmb_text_changeHandler(event)"  dataProvider="{dp}"/>
</s:Group>