ItemRender 外部渲染器

外部渲染器，一般将ItemRender从主文件中脱离，独自作为一个文件存在，好处是再某些情况下可以多次重复利用。

  下面是一个前一篇文中datagrid采用外部渲染器的例子。

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
<mx:Script>
<![CDATA[
            override public function set data( value:Object ) : void {
                super.data = value;
                var today:Number = (new Date()).time;
                var pubDate:Number = Date.parse(data.date);
                if( pubDate > today ) setStyle("backgroundColor",0xff99ff);
                else setStyle("backgroundColor",0xffffff);
            }
]]>

</mx:Script>
<mx:Image source="{data.image}" width="50" height="50" scaleContent="true"/>
<mx:Text width="100%" text="{data.title}"/>
</mx:HBox>

这个是外部ItemRender的独立文件代码，是mxml文件。（当然也可以是actionscript的类文件。）

记住主文件中要加一句： itemRenderer="GridColumnSimpleRenderer"，后面这个可以自己随意指定名字的。

下面是一个actionscript类的例子：

 

package asClass
{
    import events.BuyBookEvent;
    import flash.events.MouseEvent;

    import mx.containers.HBox;
    import mx.controls.Image;
    import mx.controls.Text;


    public class GridColumnSimpleRender extends HBox  //ItemRender的最底层必须是一个容器
    {
        private var hb:HBox;
        private var image:Image;
        private var text:Text;

        public function GridColumnSimpleRender()
        {
            super();
        }

        override protected function createChildren():void  //覆盖重写复方法，用以创建组件
        {
            hb=new HBox();
            hb.setStyle("width","400");           //通常用于对象获取不到的样式属性的设置
            addChild(hb);

            image=new Image();
            image.width=50;
            image.height=50;
            image.scaleContent=true;
            hb.addChild(image);

            text=new Text();
            text.percentWidth=100;
            hb.addChild(text);
        }
        override protected function commitProperties():void   //覆盖方法，初始化加载数据
        {
            super.commitProperties();

            text.text=data.title;
            image.source=data.image;
        }

        override public function set data( value:Object ) : void   //改变背景色
        {
            super.data = value;
            var today:Number = (new Date()).time;        //Date.time(),日期转换成Number，自 1970 年 1 月 1 日午夜以来的毫秒数。
            var pubDate:Number = Date.parse(data.date);   //Date.parse(),日期转换成Number，意思跟上面一样。
            if( pubDate > today ) setStyle("backgroundColor",0xff99ff);
            else setStyle("backgroundColor",0xffffff);
        }
    }
}