`

Flex学习记录(使用ClassFactory 生成渲染器)

阅读更多
你想要在运行时改变List 或DataGridColumn 的渲染器,或改变渲染器的属性。
使用一个ClassFactory 对象做为ItmeRdnerer。ClassFacotry 实现了IFactory 接口,你只
要传一个类对象(即Class 类型的对象)给它,它就可以生成这个类的对象。
这种解决办法,使用了工厂设计模式,并且使用了flex 的一些内部机制。在使用工厂模
式时,你需要指定一个类型给工厂,这个类型的对象会被工厂类产生并做为渲染器使用,并
且工厂类可以控制渲染器的生命周期。那么我们如何把类型指定给工厂类呢?我们需要传一
个类对象给工厂类,正如下边的代码:
var factory:ClassFactory = new ClassFactory(oreilly.cookbook.SevenTwoFactory);
在这里原文提到了SevenTwoFactory 继承IFactory 等等,大家需要多了解一些
ClassFactory 的相关知识,在实际操作中,我们一般都是创建ClassFactory 的实例赋值
itemRenderer,因为set itemRenderer 方法需要的参数是IFactory 类型,系统最终会用这
个factory 对象实例我们的renderer。也就是说,我们给系统的不是一个renderer 而是
一个能产生renderer 的factory,在系统需要时自己用factory 产生renderer 的实例,也
许细心的读者会发现,当我们写mxml 的时候,itemRenderer 的属性可以赋值一个类路径,
这就是因为flex 对mxml 里的itemRenderer 做了一些特殊的功能,如果你传的是一个类路
径,系统帮你创建一个ClassFactory。,在本节的例子中其实在我们的应用中
SevenTwoFactory 只需是一个普通的类就OK 了,我看了本节后边SevenTwoFactory 的代码,
觉得作者这样做没有必要,所以还是不扯SevenTwoFactory 和IFactory 的关系了,不然反
倒让大家糊涂。在这里我们只需要知道, ClassFactory 的实例,赋值给list 或DataGrid
的itemRenderer 属性,系统会帮我们产生item renderer。
<cookbook:PurgeList id="list" itemRenderer="{factory}" width="300"/>

DynamicRenderer.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Script>
	<![CDATA[
	public function changeRenderer():void
	{
		if(btnChange.label == "change to big"){
			list.itemRenderer = new ClassFactory(BigIconRenderer);
			//这里正如我在上边所说,这里只要传一个普通类就可以了,但实际开发中我们这里一般都传一个自定义组件,或类似的东西。
			btnChange.label = "change to small";
		} else {
			var cf:ClassFactory = new ClassFactory(SmallIconRenderer);
			//在下边的代码中我实例大家如何利用ClassFactory的properties属性给新生产的对象赋初值。
			//cf.properties = {xx:"heihei};
			var o:Object = new Object();
			o.xx = "xixi";
			cf.properties = o;
			//上边的写法,和上边注掉的写法都是可以的.但我觉得更负责的写法是:
			//if(cf.properties == null){
			// cf.properties = new Object();
			//}
			//o.xx = "hehe";
			list.itemRenderer = cf;
			btnChange.label = "change to big";
		}
	}
	]]>
</mx:Script>
<mx:List id="list" width="300" height="300" itemRenderer="SmallIconRenderer" variableRowHeight="true">
	<mx:dataProvider>
		<mx:Object label="this is item A"/>
		<mx:Object label="this is item B"/>
		<mx:Object label="this is item C"/>
		<mx:Object label="this is item D"/>
	</mx:dataProvider>
</mx:List>
<mx:Button id="btnChange" label="change to big"
click="changeRenderer()" x="308" y="10"/>
</mx:Application>


BigIconRenderer.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
[Bindable]
public var item:Object = new Object();
]]>
</mx:Script>
<mx:Label text="{data.label}" fontSize="20" fontWeight="bold" color="0xff0000"/>
<mx:Text text="大"/>
</mx:HBox>


SmallIconRenderer
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
	<![CDATA[
	[Bindable]
		public var item:Object = new Object();
	[Bindable]
		public var xx:String;
	]]>
</mx:Script>
<mx:Label text="{data.label}"/>
<mx:Text text="小"/>
<mx:Button label="{xx}"/>
</mx:HBox>
分享到:
评论

相关推荐

    flex 样式浏览器生成器

    Flex样式浏览器生成器是一款强大的工具,专为前端开发者设计,旨在简化使用Flex布局时的CSS编写过程。这个工具提供了一个可视化的界面,允许用户通过直观地拖拽和调整元素来生成相应的CSS代码,极大地提高了开发效率...

    flex学习笔记 flex学习总结 flex学习教程

    在本教程中,"作者说明.txt"可能包含了作者的学习心得和使用建议,"Flex中的架包"可能是Flex项目的源码或库文件,供读者参考和学习。通过阅读这些材料,你将能够逐步掌握Flex开发技术,踏上Flex开发之旅。

    flex中渲染器简介

    比如,如果你有一个包含1000条记录的列表,但只有10行在屏幕上可见,那么Flex只会创建足够的渲染器来展示当前和未来可能需要的可视行,通常会额外创建一些作为缓冲。这意味着,当用户滚动列表时,原有的渲染器会被...

    flex特效 不错的flex样式生成器

    总的来说,这个“flex特效 不错的flex样式生成器”是CSS Flex布局学习和实践的重要辅助工具,能够帮助开发者快速理解和创建符合需求的Flex布局。通过实验和实践,开发者可以更好地掌握这一强大的布局技术,提升网页...

    flex+as3项目渲染器的使用

    在Flex和AS3开发中,项目渲染器(ItemRenderer)是一个关键的概念,它允许开发者自定义数据项在UI组件中的显示方式。项目渲染器通常用于...学习和掌握项目渲染器的使用,能极大地提升Flex应用的用户体验和功能表现。

    Flex Cairngorm框架生成器

    通过使用Flex Cairngorm框架生成器,开发者可以快速地自动生成Cairngorm框架的基本结构,从而提高开发效率并降低出错的可能性。 这款工具的主要功能包括: 1. **自动创建模型(Model)**:根据项目需求,生成基本的...

    FLEX 自动生成器

    在计算机科学领域,尤其是编程语言解析和编译技术中,`FLEX`(Fast Lexical Analyzer Generator)是一个广泛使用的工具,它能够自动生成词法分析器,也称为扫描器或词法分析程序。这个词法分析器能够识别源代码中的...

    FLEX学习笔记

    《FLEX学习笔记》 FLEX,全称为Flex Builder,是由Adobe公司开发的一款基于MXML和ActionScript的开源框架,用于构建富互联网应用程序(RIA)。它允许开发者创建具有交互性、响应性和丰富用户体验的Web应用。FLEX的...

    flex svg代码生成图片

    在 Flex 应用程序中,使用 SVG 资源可以实现图表生成图片并下载。以下是关于 Flex SVG 代码生成图片的知识点: 一、静态显示 SVG 图像 在 Flex 应用程序中,可以使用 SVG 资源,但只能作为一种图像引入,类似于 ...

    flex和bison实现小型编译器生成中间代码源程序.zip

    《使用flex和bison构建小型编译器生成中间代码》 在计算机科学领域,编译器是连接高级语言与机器语言的重要桥梁。本项目聚焦于使用flex和bison这两个工具来构建一个小型编译器,它能将源代码翻译成中间代码——一种...

    flex渲染器flex渲染器

    Flex渲染器是一种在Web开发中广泛使用的布局技术,主要用于创建响应式和动态的网页界面。Flex渲染器基于CSS(层叠样式表)的Flexbox模块,允许开发者更灵活地控制元素在容器内的排列方式,无论屏幕尺寸如何变化,都...

    词法分析自动生成工具flex

    词法分析是编译器设计中的重要步骤,它将源代码分解成一个个有意义的符号单元...通过学习和理解压缩包中的文件,开发者可以深入掌握Flex的使用方法,从而构建自己的词法分析器,应用于各种编程语言或特定文本解析任务。

    用flex自动生成词法分析器

    在计算机科学领域,词法分析是编译器...通过学习和实践这些资源,你可以掌握如何利用Flex自动生成词法分析器,这对于理解编译器工作原理和开发自己的解析工具至关重要。记得,理论与实践相结合,是提升编程技能的关键。

    Flex 学习资料flex学习资料

    flex学习资料flex学习资料flex学习资料

    flex 事件 代码生成器

    使用Flex事件代码生成器,只需选择目标组件和所需事件类型,工具就能自动生成对应的代码模板,从而节省大量时间。这对于处理复杂的组件树和大量交互事件来说,无疑是一个巨大的便利。 Flex事件代码生成器可能包含的...

    Flex3 css样式代码自动生成

    3. **嵌套样式**: 类似于标准CSS,Flex3也支持类选择器和ID选择器,可以针对组件的特定状态(如Hover、Disabled等)定义不同的样式。 4. **状态管理**: Flex3组件有自己的状态,如“up”、“over”、“down”等,CSS...

    使用ant编译生成flex的swc文件

    本文将深入探讨如何使用Ant工具来编译生成Flex的SWC文件,以此解决传统方式带来的繁琐和不便。 首先,让我们了解基本概念。`Ant`是一款由Apache软件基金会开发的Java构建工具,它基于XML编写构建脚本,可以跨平台...

    Flex样式生成工具

    Flex样式生成工具是一种用于快速构建和管理用户界面样式的实用工具,尤其在开发基于Flex框架的应用程序时,它能够极大地提升开发效率。Flex是Adobe公司推出的一种基于ActionScript的开源框架,主要用于创建富互联网...

    flex学习小记录

    标题中的“flex学习小记录”表明这是一份关于Adobe Flex技术的学习笔记或教程。Flex是一种开源框架,主要用于构建富互联网应用程序(RIA),特别是在Flash Player和Adobe AIR上运行的应用。它基于ActionScript语言,...

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

    在DataGrid中,我们可以通过设置`itemRenderer`属性来指定特定列使用我们的自定义渲染器。例如: ```xml 数据列" dataField="yourDataField" itemRenderer="utils.MyCustomLabelRenderer"/&gt; ``` 这里的`utils....

Global site tag (gtag.js) - Google Analytics