如何为Flash中的切片列表创建自定义单元格渲染器

时间:2010-06-27 12:31:54

标签: flash actionscript-3 flash-v3-components

我需要在我的项目中实现自定义cell renderer,我在google上做了一些搜索但找不到我需要的内容。

我需要cell中的每个tile list来显示两个labels的图标。我需要一个很好的例子来启动它。

如果可能,我需要一种方法将模板设计为MovieClip并将其传递给tilelist以呈现单元格。

2 个答案:

答案 0 :(得分:0)

要构建自定义单元格渲染器,您需要从可用的listClasses扩展一个选择类。 ImageCell看起来是您项目的良好开端。

你会:

  1. 扩展列表类
  2. 在(labels / TextField等)
  3. 中添加您自己的位
  4. 覆盖受保护的函数以根据您的需要调整新Cell(例如drawLayout方法,您需要整齐地放置项目)。
  5. 这是一个非常基本的例子:

    package
    {
        import fl.controls.listClasses.ICellRenderer;
        import fl.controls.listClasses.ImageCell;
        import fl.controls.TileList;
        import fl.data.DataProvider;
        import fl.managers.StyleManager;
        import flash.events.EventDispatcher;
        import flash.events.*;
        import fl.containers.UILoader;
    
        public class CustomImageCell extends ImageCell implements ICellRenderer
        {  
    
            public function CustomImageCell() 
            {
                super();
    
                //do other stuff here
    
                loader.scaleContent = false;
                loader.addEventListener(IOErrorEvent.IO_ERROR, handleErrorEvent, false, 0, true);
    
                useHandCursor = true;
            }
    
            override protected function drawLayout():void
            {
                var imagePadding:Number = getStyleValue("imagePadding") as Number;
                loader.move(11, 5);
    
                var w:Number = width-(imagePadding*2);
                var h:Number = height-imagePadding*2;
                if (loader.width != w && loader.height != h)
                {
                    loader.setSize(w,h);
                }
                loader.drawNow(); // Force validation!
    
            }
            override protected function handleErrorEvent(event:IOErrorEvent):void {
                trace('ioError: ' + event);
                //dispatchEvent(event);
            }
        }
    }
    

    您需要的一个很好的例子是post。 那里提供了自定义单元格:

    1. 支持自定义背景(通过设置单元格外观)
    2. 使用标签TextField。
    3. HTH

答案 1 :(得分:-2)

创建一个名为MyRenderer.mxml的文件,粘贴它:

<?xml version="1.0" encoding="utf-8"?>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Image id="img" width="123" height="123" />
<mx:Script><![CDATA[
override public function set data (value:Object):void {
    super.data = value;
    // mess with img here
}
]]></mx:Script>
</mx:Box>
在拼贴列表中

,写下:

<mx:TileList itemRenderer="MyRenderer" ... />