ItemRenderer URLLoaderイメージを切り替える

Question

この動作を説明する方法はわかりませんが、試してみます。基本的な認証が必要な外部URLから画像をロードしています。そのため、URLLoaderを使用して一意のIDから画像をロードしています。 IDはitemrendererに渡され、itemrendererはイメージをロードします。しかし、私がスクロールすると、イメージは自分自身で切り替わります。私は7枚の以上の画像をロードするか、またはエラーのので、画像を繰り返し開始....

Youtubeビデオ場合： http://www.youtube.com/watch?v=ZYoqlS14gWQ

関連コード：

<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> 

Answer 1

ItemRenderersは、再利用可能であり、そしてすなわち、その領域を埋めるためにリストに作成されたカウントは限られています（rowCount + - カップル）。スクロールすると、新しいレンダラーはインスタンス化されず、スクロールされたレンダラーが上下に移動して新しいデータで埋められます。

これは、creationCompleteイベントに頼ることができないため、レンダラーのインスタンスごとに1回だけ発生します。

ソリューションはdataセッターをオーバーライドして、そこに必要な行動を構築することです：

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

お役立ちリンク：How flex itemRenderer works ? (their life cycle)