Flex itemRenderer

原创 2015年07月08日 09:36:04

Vms:(初始化每次红绿蓝都一样,不会根据value出现制定的红或绿或蓝)

<mx:DataGrid id="grid"
							 width="100%"
							 height="100%">
					<mx:columns>
						<mx:DataGridColumn dataField="id"
										   headerStyleName="centered"
										   headerText="路段名称"
										   textAlign="left"/>
						<mx:DataGridColumn headerText="颜色">
							<mx:itemRenderer>
								<mx:Component>
									<mx:HBox horizontalAlign="center">
										<mx:Script>
											<![CDATA[
												
												override public function set data( value:Object ) : void 
												{
													super.data = value;
													var colorArray:Array = new Array();
													colorArray.push({label:"绿色",data:"0"});
													colorArray.push({label:"黄色",data:"1"});
													colorArray.push({label:"红色",data:"2"});
													this.color.dataProvider = colorArray;
												}
											]]>
										</mx:Script>
										<mx:ComboBox id="color" labelField="label" fontSize="13" change="outerDocument.change(color.selectedItem.data)" />
									</mx:HBox>
								</mx:Component>
							</mx:itemRenderer>
						</mx:DataGridColumn>
					</mx:columns>
				</mx:DataGrid>

EqpEquipment:(value不同,颜色不同)

<mx:DataGrid id="equipTable"
					 width="100%" 
					 height="100%" 
					 doubleClickEnabled="true"
					 doubleClick="view_equip();"
					 headerStyleName="head">
			<mx:columns>
				<!--设备名称-->
				<mx:DataGridColumn dataField="equipname" 
								   headerStyleName="centered"
								   headerText="{resourceManager.getString('message_eqp','EQP_LABEL_001')}"
								   textAlign="left"/>
				<!--所属系统-->
				<mx:DataGridColumn dataField="equipsystem"
								   headerStyleName="centered"
								   headerText="{resourceManager.getString('message_eqp','EQP_LABEL_002')}"
								   labelFunction="showSysName" 
								   textAlign="center"/>
				<!--设备状态-->
				<mx:DataGridColumn dataField="equipstatus"
								   headerStyleName="centered"
								   headerText="{resourceManager.getString('message_eqp','EQP_LABEL_022')}"
								   labelFunction="showStatus" 
								   textAlign="center">
					<mx:itemRenderer>
						<mx:Component>
							<mx:HBox horizontalAlign="center" verticalAlign="middle">
								<mx:Script>
									<![CDATA[
										// 向右
										[Embed(source='images/yello.png')]
										private var yellowImg:Class;
										// 向左
										[Embed(source='images/green.png')]
										private var greenImg:Class;
										
										[Bindable]
										private var img:Class = null;
										
										override public function set data( value:Object ) : void 
										{
											super.data = value;
											var status:String = data.equipstatus;
											if( status == "1")
											{
												img = greenImg;
											}
											else if(status == "2")
											{
												img = yellowImg;
											}else{
												img = null;
											}
										}
									]]>
								</mx:Script>
								<mx:Image source="{img}"/>
							</mx:HBox>
						</mx:Component>
					</mx:itemRenderer>
				</mx:DataGridColumn>
			</mx:columns>
		</mx:DataGrid>

sigDeviceControl:(最后一列不传值,只是一个按钮列)

<mx:DataGrid id="grid_plan" 
									 width="100%" 
									 height="100%" 
									 variableRowHeight="false"
									 wordWrap="false">
							<mx:columns>
								
								<mx:DataGridColumn width=".2" headerText="方案序号" dataField="planno" headerStyleName="centered" textAlign="center" />
								<mx:DataGridColumn width=".2" headerText="周期长度" dataField="cyclelen" headerStyleName="centered" textAlign="center" />	
								<mx:DataGridColumn width=".2" headerText="协调相位号" dataField="coordphaseno" headerStyleName="centered" textAlign="center" />
								<mx:DataGridColumn width=".2" headerText="协调阶段差" dataField="offset" headerStyleName="centered" textAlign="center" />
								<mx:DataGridColumn width=".2" headerText="放行阶段序号" dataField="stagenolist" headerStyleName="centered" textAlign="center" />
								<mx:DataGridColumn width=".1" textAlign="center" headerText="下发">
									<mx:itemRenderer>
										<mx:Component>
											<mx:HBox horizontalAlign="center">
												<mx:LinkButton label="下发" click="outerDocument.issued();"/>
											</mx:HBox>
										</mx:Component>
									</mx:itemRenderer>
								</mx:DataGridColumn>
							</mx:columns>
						</mx:DataGrid>



 

 


 

理解 Flex itemRenderer - 第 5 部分: 效率

如果您要显示大量 itemRenderer-无论在 DataGrid 还是在 AdvancedDataGrid 中-如果无法有效编写这些 itemRenderer, 您的应用程序性能可能受到负面影响。...

flex4使用itemrenderer后报Error #1009

昨天改ABPlayer的时候想要加个屏蔽效果,在网上找了找知道应该用itemrenderer,于是我用flash builder4自带的提示加入了一个itemrenderer 创建后默认...

Flex之旅--项呈示器ItemRenderer

本文只讨论DataGrid的项呈示器,其他的没有细看,应该是类似的,可能只是实现的接口不同而已,以后用到这部分内容的话再补充进来。每次前面都说这么些废话,只是为了说明文章内容的适应范围,否则可能会引起...
  • sjepy
  • sjepy
  • 2012年06月06日 16:01
  • 3329

理解 Flex itemRenderer - 第 1 部分: 内联渲染器

http://www.adobe.com/cn/devnet/flex/articles/itemrenderers_pt1.html   Flex 提供许多控制, 它们可以按不同方式显示...

flex学习日记(三) 使用“项呈示器”ItemRenderer

1.主页面
  • raphero
  • raphero
  • 2011年12月09日 11:21
  • 1222

Flex实现ColumnChart柱图为圆角矩形的itemRenderer

自己写的itemRenderer,实现柱图为圆角矩形。并且根据值的最大最小值用不同的颜色显示在每个柱子的上方。 下面是ItemRenderer代码: package itemRender {...

Flex中itemRenderer效率解说

如果您要显示大量 itemRenderer-无论在 DataGrid 还是在 AdvancedDataGrid 中-如果无法有效编写这些 itemRenderer, 您的应用程序性能可能受到负面影响。...

Flex组件的项目渲染器(ItemRenderer)使用总结

Flex中提供了大量用于数据呈现的组件,这其中,以List系列组件最为常见,使用也最频繁,比如ComBoBox、List、Tree、 TileList、DataGrid等等。这些组件有一个共同的特性,...

提高flex性能之itemRenderer篇

之前我有总结过如何提高flex性能的文章,最近又碰到一个问题,就是对大批量数据的时候DataGrid中采用很多itemRenderer,性能将是一个大问题。于是寻找有关权威文章,期望能有所收获。在Pe...
  • hotdust
  • hotdust
  • 2011年10月09日 11:46
  • 2868

Flex组件的项目渲染器(ItemRenderer)使用总结

Flex中提供了大量用于数据呈现的组件,这其中,以List系列组件最为常见,使用也最频繁,比如ComBoBox、List、Tree、 TileList、DataGrid等等。这些组件有一个共同的特性,...
  • CQGCCL
  • CQGCCL
  • 2015年06月05日 14:47
  • 355
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Flex itemRenderer
举报原因:
原因补充:

(最多只允许输入30个字)