Question

我有一个扩展Sprite的对象的arrayCollection，并且在其中包含位图。

我希望在列表中显示这些内容（或允许用户滚动浏览它们并查看其相关数据的其他组件。）

当我这样做时：myList.dataProvider = myArrayCollection

列表只显示了一堆[Object，Item]而不是视觉精灵。

以下是我的对象的简化版本：

public class myUIC extends UIComponent
    {

        public var mySprite:Sprite = new Sprite;

        [Embed(source="assets/BGimage.png")]
        public var BGimage:Class;

        public var myBitmap:Bitmap;
        public var wordText:TextField = new TextField;

        public function myUIC(myWord:String)
        {
            this.wordText.text = myWord;
            this.myBitmap = new BGimage;
            this.mySprite.addChild(this.myBitmap);
            this.mySprite.addChild(this.wordText);
            this.addChild(this.mySprite);
        }
    }

尝试了许多不同的方式让它显示在列表中，但不能这样做。

Answer 1

请参阅本教程：Flex Examples - displaying icons in a flex list control

Answer 2

听起来你可能想尝试编写一个简单的项目渲染器（可能基于UIComponent），它使用addChild（）将关联的精灵添加到渲染的显示列表中。

Answer 3

尝试使用rawChildren.addChild添加Sprite

Answer 4

在这里，尝试使用像这样的itemRenderer。它应该与任何通用的DisplayObject一起使用。它从指定的数据属性中获取宽度和高度，因此您可能需要在实际列表中将variableRowHeight设置为true，以使其按预期工作。

package
{
    import flash.display.DisplayObject;
    import mx.controls.listClasses.IListItemRenderer;
    import mx.core.UIComponent;
    import mx.events.FlexEvent;

    /*
    Extending UIComponent means we can add Sprites (or any DisplayObject)
    with addChild() directly, instead of going through the rawChildren property.
    Plus, in this case, we don't need the extra overhead of Canvas's layout code.

    IListItemRenderer lets us use it as a List's itemRenderer. UIComponent already
    implements all of IListItemRenderer except for the data property
    */
    public class SpriteRenderer extends UIComponent implements IListItemRenderer
    {
        // Implementing the data property for IListItemRenderer is really easy,
        // you can find example code in the LiveDocs for IDataRenderer
        private var _data:Object;

        [Bindable("dataChange")]
        public function get data():Object
        {
            return _data;
        }

        public function set data(value:Object):void
        {
            if (value !== _data) {

                // We need to make sure to remove any previous data object from the child list
                // since itemRenderers are recycled
                if (_data is DisplayObject && contains(_data as DisplayObject)) {
                    removeChild(_data as DisplayObject);
                }

                _data = value;

                // Now we just make sure that the new data object is something we can add
                // and add it
                if (_data is DisplayObject) {
                    this.width = (_data as DisplayObject).width;
                    this.height = (_data as DisplayObject).height;

                    addChild(_data as DisplayObject);
                }

                dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
            }
        }

        public function SpriteRenderer()
        {
            super();
        }
    }
}

可以在List组件中显示Sprite的arrayCollection吗？

4 个答案: