`
darrenzhu
  • 浏览: 804468 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

自定义DataGrid的ItemRenderer

阅读更多
自定义的ItemRenderer要实现IDataRenderer和IDropInListItemRenderer,其中IDataRenderer里有get/set data方法,IDropInListItemRenderer里有get/set listData方法,下面定义的ItemRenderer支持labelFunction函数。

package component
{
	
	import flash.events.FocusEvent;
	import flash.events.MouseEvent;
	import flash.text.TextField;
	
	import mx.controls.Alert;
	import mx.controls.Label;
	import mx.controls.Text;
	import mx.controls.advancedDataGridClasses.AdvancedDataGridBase;
	import mx.controls.advancedDataGridClasses.AdvancedDataGridListData;
	import mx.controls.listClasses.AdvancedListBase;
	import mx.controls.listClasses.BaseListData;
	import mx.controls.listClasses.IDropInListItemRenderer;
	import mx.controls.listClasses.IListItemRenderer;
	import mx.core.IDataRenderer;
	import mx.core.UIComponentGlobals;
	import mx.core.mx_internal;
	import mx.events.FlexEvent;
	
	
	use namespace mx_internal;
	
	
	public class TradeOpStatusDGColumnItemRenderer extends Label implements IDataRenderer, IDropInListItemRenderer	
{
		
		private var _data:Object;
		private var _listData:AdvancedDataGridListData;
		public var contentBackgroundColor:uint;
		
		public function TradeOpStatusDGColumnItemRenderer()
		{
			super();
		}
			
		[Bindable("dataChange")]
		override public function get data():Object
		{
			return _data;
		}
			
		override public function set data(value:Object):void
		{
			_data = value;
			var operationStatus:String;
			if(value!=null){
				if(value.hasOwnProperty("operationStatus")){
					operationStatus=value.operationStatus;
				}else{
					Alert.show("No such filed:operationStatus","Message");
					return;
				}
				setStyle("color","#000000");
				setStyle("borderVisible","false");
				if(operationStatus ==TradeOperationStatus.Added){
					setStyle("fontWeight","bold");
					setStyle("fontStyle","normal");
				}else if(operationStatus == TradeOperationStatus.Modified){
					setStyle("fontWeight","bold");
					setStyle("fontStyle","normal");
				}else if(operationStatus==TradeOperationStatus.Deleted){
					setStyle("fontWeight","bold");
					setStyle("fontStyle","italic");
				}else if(operationStatus ==TradeOperationStatus.Historical){
					setStyle("fontWeight","normal");
					setStyle("fontStyle","normal");
				}else{
					Alert.show("Trade operation status is not supported","Message");
					return;
				}
				
				if(_listData && _listData.dataField=="notional"){
					setStyle("textAlign","right");
				}else{
					setStyle("textAlign","left");
				}
				
if(_listData && _listData.dataField){
					var dataGrid:AdvancedDataGrid=_listData.owner as AdvancedDataGrid;
					var dataGridColumn:AdvancedDataGridColumn=dataGrid.columns[_listData.columnIndex] as AdvancedDataGridColumn
					super.text=dataGridColumn.itemToLabel(_data,true);
				}			
}
			dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
		}	
		
		[Bindable("dataChange")]
		override public function get listData():BaseListData
		{
			return _listData;
		}
		
		override public function set listData(value:BaseListData):void
		{
			_listData = AdvancedDataGridListData(value);
		}
			
		override public function drawFocus(isFocused:Boolean):void
		{
			
		}
	}
}


这里有一点要特别注意的地方就是,setStyle()方法设置的样式属性必须是你继承的组件里面有的,比如我这里是Label,那么你用setStyle("fontWeight","bold");setStyle("fontStyle","normal")都没问题,但是如果你用setStyle("lineThrough","true")就不行了,因为lineThrough只要s|TextInput组件有,mx|TextInput,和这里的Label没有,不过如果你设置了,运行时是不会报错的,只是你看不到你期待的结果而已。
分享到:
评论

相关推荐

    Flex 自定义Datagrid的ItemRender

    本文将深入探讨如何在Flex中自定义Datagrid的ItemRender,以实现按钮、单选、复选和日期等控件的集成。 首先,我们需要了解ItemRender的基本概念。ItemRenderer是Flex提供的一种机制,允许开发者为数据网格中的每一...

    flex自定义datagrid

    在Flex编程中,自定义DataGrid是常见的需求,特别是在处理大量数据并需要提供用户友好的交互体验时。本文将深入探讨如何在Flex中实现自定义的DataGrid,以支持复选框选择和分页功能。 首先,让我们了解Flex ...

    flex 自定义dataGrid渲染器.根据数据变色

    总的来说,通过自定义DataGrid的渲染器,我们可以实现更灵活的数据显示效果。在这个例子中,我们学会了如何根据数据的值动态改变单元格的颜色,增强了用户界面的交互性和可视化效果。这种技术在数据监控、报表展示等...

    Flex itemRenderer的详细教程

    在 Flex 开发中,ItemRenderer 是一种非常强大的工具,它允许开发者自定义列表(List)、数据网格(DataGrid)等控件中每一项的外观和行为。通过 ItemRenderer,我们可以实现更加灵活和动态的界面设计。 #### 二、...

    DataGrid的itemRenderer and HeaderRenderer

    首先,`itemRenderer`是`DataGrid`中用于自定义每一行数据项显示方式的组件。通过自定义`itemRenderer`,我们可以使每行数据显示为更复杂的结构,如包含`checkbox`,这在需要用户进行多项选择时非常有用。创建`...

    flex as actionscript datagrid 背景色 flash itemRenderer script iframe overrider 跳转到别的页面

    综上所述,这个项目可能涉及到一个使用Flex DataGrid展示节目或课程播表的应用,播表数据存储在XML文件中,每个节目单元格通过自定义的ItemRenderer展现,可能包含Flash播放器,并且可以通过点击单元格触发页面跳转...

    FLEX4实践—动态生成DataGrid及应用客户化itemRenderer.doc

    在Flex4中,动态生成DataGrid以及应用客户化itemRenderer是一项关键技能,它允许开发者根据运行时的数据结构灵活地创建用户界面。以下是对这个主题的详细解释: 首先,`DataGrid`组件是Flex中用于展示表格数据的...

    flex DataGrid改变指定行的背景颜色

    创建好自定义ItemRenderer后,我们需要将其应用到DataGrid的列上。假设我们有一个名为`myColumn`的列,可以这样设置: ```actionscript myColumn.itemRenderer = new ClassFactory(CustomRowRenderer); ``` 3. **...

    datagrid行的背景色

    在实际应用中,我们经常需要根据特定条件或者需求自定义Datagrid的行背景色,以增强视觉效果,或者突出显示特定行的信息。本文将深入探讨如何在Flex中实现对datagrid行背景色的自定义。 首先,了解Flex Datagrid的...

    Flex DataGrid 插入子组件

    - 在DataGrid的`itemRenderer`属性中指定自定义ItemRenderer类。 2. 运算符渲染器(OperatorRenderer) 对于更复杂的场景,可以使用运算符渲染器(OperatorRenderer)。它允许在单元格中插入复杂的组件,如下拉...

    flex 中datagrid 动态攺变行颜色

    3. **应用自定义ItemRenderer**:在Datagrid中指定使用自定义的ItemRenderer。这可以通过`itemRenderer`属性实现。 ```mxml <mx:DataGrid id="dg" dataProvider="{dataProvider}"> <mx:itemRenderer> ...

    Flex中Datagrid应用(每行修改删除按钮)

    在DataGrid的每一行中添加修改和删除按钮,通常需要自定义ItemRenderer。ItemRenderer是DataGrid列中每个单元格的外观和行为定制组件。我们可以通过继承MX的ListBase类或者UIComponent类来创建自定义的ItemRenderer...

    flex4做的itemrenderer呈现器

    在主应用中,你需要告诉List或DataGrid使用`friendItem`作为其ItemRenderer。这可以通过在数据列或listItemRenderer属性中设置完成: ```actionscript <s:itemRenderer> </s:itemRenderer> ``` 7. ...

    Flex DataGrid 改变某一行的背景颜色

    总结,改变Flex DataGrid中某一行的背景颜色通常涉及自定义ItemRenderer、使用CSS样式或者监听事件。选择哪种方法取决于具体需求,如是否需要复杂逻辑、性能要求以及代码可维护性等因素。通过这些技术,我们可以使...

    flexdatagrid实现列中下拉列表与行勾选功能

    总的来说,`Flex DataGrid`的`itemRenderer`机制为我们提供了强大的自定义能力,通过创建自定义组件并绑定数据,我们可以实现各种复杂的数据显示和交互功能。在实际项目中,根据具体需求,还可以扩展这些渲染器,...

    改变flex DataGrid单元格字体颜色

    要实现动态改变单元格字体颜色的功能,我们需要自定义DataGrid的ItemRenderer。ItemRenderer是DataGrid用于渲染每个数据项的组件。通过创建自定义ItemRenderer,我们可以对每个单元格的外观进行完全控制,包括字体...

    在flex的dataGrid控件中显示图片的实践

    3. **自定义ItemRenderer**:由于DataGrid默认不支持直接显示二进制图片,我们需要创建一个自定义的ItemRenderer。ItemRenderer是DataGrid中每个单元格的可视化表示。在这个自定义renderer中,我们将处理二进制数据...

    Flex项呈示器ItemRenderer

    <mx:DataGrid dataProvider="{users}" itemRenderer="com.myapp.renderers.UserItemRenderer" /> ``` ## 四、进一步优化 1. **响应式设计**:可以根据数据或屏幕尺寸的变化,动态调整渲染器的布局和样式。 2. **...

    Flex动态创建DataGrid设置图片

    在DataGrid的`<mx:columns>`或`<s:columns>`标签中,为包含图片的列指定你的自定义ItemRenderer。 ### 方法二:使用CellFactory 1. **创建CellFactory**: 创建一个类,实现`mx.controls.listClasses....

    Flex ItemRenderer

    Flex ItemRenderer 是Adobe Flex框架中的一个重要概念,它主要用于自定义MX和Spark组件列表视图(如List、DataGrid等)中的每一项显示样式。ItemRenderer允许开发者根据数据项的内容个性化呈现,提供更丰富的用户...

Global site tag (gtag.js) - Google Analytics