flex动态生成ItemRender实例

你想要在运行时改变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: 
Mxml代码   收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  
  3. layout="absolute">  
  4. <mx:Script>  
  5.     <![CDATA[  
  6.     public function changeRenderer():void  
  7.     {  
  8.         if(btnChange.label == "change to big"){  
  9.             list.itemRenderer = new ClassFactory(BigIconRenderer);  
  10.             //这里正如我在上边所说,这里只要传一个普通类就可以了,但实际开发中我们这里一般都传一个自定义组件,或类似的东西。  
  11.             btnChange.label = "change to small";  
  12.         } else {  
  13.             var cf:ClassFactory = new ClassFactory(SmallIconRenderer);  
  14.             //在下边的代码中我实例大家如何利用ClassFactory的properties属性给新生产的对象赋初值。  
  15.             //cf.properties = {xx:"heihei};  
  16.             var o:Object = new Object();  
  17.             o.xx = "xixi";  
  18.             cf.properties = o;  
  19.             //上边的写法,和上边注掉的写法都是可以的.但我觉得更负责的写法是:  
  20.             //if(cf.properties == null){  
  21.             // cf.properties = new Object();  
  22.             //}  
  23.             //o.xx = "hehe";  
  24.             list.itemRenderer = cf;  
  25.             btnChange.label = "change to big";  
  26.         }  
  27.     }  
  28.     ]]>  
  29. </mx:Script>  
  30. <mx:List id="list" width="300" height="300" itemRenderer="SmallIconRenderer" variableRowHeight="true">  
  31.     <mx:dataProvider>  
  32.         <mx:Object label="this is item A"/>  
  33.         <mx:Object label="this is item B"/>  
  34.         <mx:Object label="this is item C"/>  
  35.         <mx:Object label="this is item D"/>  
  36.     </mx:dataProvider>  
  37. </mx:List>  
  38. <mx:Button id="btnChange" label="change to big"  
  39. click="changeRenderer()" x="308" y="10"/>  
  40. </mx:Application>  


BigIconRenderer.mxml: 
Mxml代码   收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">  
  3. <mx:Script>  
  4. <![CDATA[  
  5. [Bindable]  
  6. public var item:Object = new Object();  
  7. ]]>  
  8. </mx:Script>  
  9. <mx:Label text="{data.label}" fontSize="20" fontWeight="bold" color="0xff0000"/>  
  10. <mx:Text text="大"/>  
  11. </mx:HBox>  


SmallIconRenderer 
Mxml代码   收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">  
  3. <mx:Script>  
  4.     <![CDATA[  
  5.     [Bindable]  
  6.         public var item:Object = new Object();  
  7.     [Bindable]  
  8.         public var xx:String;  
  9.     ]]>  
  10. </mx:Script>  
  11. <mx:Label text="{data.label}"/>  
  12. <mx:Text text="小"/>  
  13. <mx:Button label="{xx}"/>  
  14. </mx:HBox>  



(转载请注明出处:博彩通http://www.hoom.org)

你可能感兴趣的:(itemRender)