的ItemRenderer开关的URLLoader图片 [英] ItemRenderer Switching URLLoader Images

问题描述

我甚至不知道该如何解释这种行为，但我会尽力。我加载来自外部URL，需要基本身份验证，所以我使用的URLLoader从一个唯一的ID加载图像的图像。该ID被传递到的itemRenderer然后继续加载图像。但图像切换围绕自己的，当我滚动。如果我负荷超过700图像左右它开始重复的图像......

I don't even know how to explain this behavior but I'll try. I am loading images from an external url that requires basic auth so I am using URLLoader to load the image from a unique ID. The ID gets passed to the itemrenderer which then proceeds to load the image. But the images switch around on their own when I scroll. If I load more than 7 images or so it starts repeating images....

的Youtube视频的错误： http://www.youtube.com/watch?v=ZYoqlS14gWQ

Youtube video of error: http://www.youtube.com/watch?v=ZYoqlS14gWQ

相关code：

<s:ItemRenderer name="RandomItemRenderer" creationComplete="init();"
            xmlns:fx="http://ns.adobe.com/mxml/2009" 
            xmlns:s="library://ns.adobe.com/flex/spark" 
            xmlns:mx="library://ns.adobe.com/flex/mx" 
            autoDrawBackground="false">
<s:states>
    <s:State name="normal" />
    <s:State name="hovered" />
    <s:State name="selected" />
</s:states>

<fx:Script>
    <![CDATA[
        import flash.net.URLLoader;
        import flash.net.URLLoaderDataFormat;
        import flash.net.URLRequest;
        import flash.net.URLRequestHeader;
        import flash.net.URLRequestMethod;

        import mx.utils.ObjectProxy;

        import customclasses.Settings;

        [Bindable] private var coverArtImage:Image;
        private var myCoverArtLoader:URLLoader;

        [Bindable] private var coverArtSource:String;

        private function init():void {
            get_coverArt();
        }

        private function get_coverArt(): void {
            if (!data.coverArt) {
                set_nullCoverArt();
            } else {
                var requestString:String = "/rest/getCoverArt.view?v=1.5.0&c=AirSub&id=" + data.coverArt;
                var requestURL:String = Settings.ServerURL + requestString;

                myCoverArtLoader = new URLLoader();
                var myRequest:URLRequest = new URLRequest();

                var authHeader:URLRequestHeader = new URLRequestHeader();
                authHeader.name = 'Authorization';
                authHeader.value = 'Basic ' + Settings.EncryptedCreds();

                myRequest.requestHeaders.push(authHeader);
                myRequest.url = requestURL;
                myRequest.method = URLRequestMethod.GET;
                myCoverArtLoader.dataFormat = URLLoaderDataFormat.BINARY;

                myCoverArtLoader.addEventListener(Event.COMPLETE, set_coverArt);
                myCoverArtLoader.addEventListener(IOErrorEvent.IO_ERROR, set_failedCoverArt);
                myCoverArtLoader.load(myRequest);
            }
        }

        private function set_coverArt(evt:Event) : void {
            coverArtImage = new Image();
            coverArtImage.source = myCoverArtLoader.data;           
            myCoverArtLoader.removeEventListener(Event.COMPLETE, set_coverArt);
        }

        private function set_nullCoverArt() : void {
            coverArtImage = new Image();
            coverArtImage.source = "assets/nullCoverArt.jpg";
        }

        private function set_failedCoverArt() : void {
            coverArtImage = new Image();
            coverArtImage.source = "assets/nullCoverArt.jpg";
            myCoverArtLoader.addEventListener(IOErrorEvent.IO_ERROR, set_nullCoverArt);
        }

    ]]>
</fx:Script>

<s:Image source.normal="assets/coverOutline.png" source.selected="assets/coverOutlineYellow.png" source.hovered="assets/coverOutlineYellow.png"
         height="226" width="226" />

<s:VGroup top="4.5" bottom="5" width="200" horizontalAlign="center" letterSpacing="10"
          paddingBottom="5" paddingTop="9" verticalAlign="middle" x="13.5">
    <s:Image id="ui_imgCoverArt" width="200" height="200" source="{coverArtImage.source}"/>
    <s:Label text="{data.title}" width="160" styleName="RandomList" />
</s:VGroup>

推荐答案

itemRenderer是可重复使用和缓存，在列表中创建，以填补它的面积，即有只有有限的数量（rowCount时+ - 夫妇）。而当你卷动，新的渲染器不会实例化，而不是被滚出一个渲染器上升或下降，并充满新的数据。

ItemRenderers are reusable and cached, i.e. there are only limited count created in List to fill its area (rowCount +- couple). And when you scroll, new renderers are not instantiated, instead the one renderer that was scrolled out goes up or down and is filled with new data.

这就是为什么你不能依靠的creationComplete 时，它将被用于渲染的每一个实例触发一次。

That's why you can not rely on creationComplete event, it will be fired only once for each instance of renderer.

解决的办法是重写数据 setter和建立有需要的行为：

The solution is to override data setter and build there the behaviour needed:

override public function set data(value:Object):void
{
    super.data = value;
    get_coverArt();
}

有用的链接：如何弯曲的itemRenderer工作的？ （生命周期）

这篇关于的ItemRenderer开关的URLLoader图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！