2012-03-01 6 views
0

を各アイテムのitemRendererにを更新し、私はリストを以下に示している:ListコンポーネントでのFlex

タイルに名前、日付とに含まれるビデオの各1のプレビュー画像を表示
<s:List id="list2" width="100%" height="100%" dataProvider="{ recordingsShown }" 
       itemRenderer="components.VideoItemRenderer2" 
       selectedIndex="0" visible="false"> 

      <s:layout> 

       <s:TileLayout id="tilelayout" 
           useVirtualLayout="true" 
           orientation="columns" 
           columnAlign="justifyUsingWidth" rowAlign="justifyUsingHeight" 
           requestedColumnCount="3" 
           requestedRowCount="2" 
           paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5" 
           verticalGap="10" horizontalGap="10" /> 

      </s:layout> 

</s:List> 

arraycollectionレコーディングdataproviderとして示されています。 新しいビデオが追加された場合の問題は、私は、フォルダ内のプレビュー写真を保存して、ノードがXMLでそれを説明し、私は

recordingsShown.addItemAt(newRecording,0); 

とのArrayCollectionに新しいアイテムを入れて、それがステージに追加されますが、最後に追加されたビデオのプレビュー画像は表示されません! 一覧を表示するには、リスト全体をどのように再描画できますか?私はデータバインディングの問題点とスパークイメージがあるように思われることを見出した

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" 
      width="400" height="300" autoDrawBackground="true"> 

<fx:Metadata> 
    [Event(name="playClicked", type="flash.events.Event")] 
</fx:Metadata> 

<fx:Script> 
    <![CDATA[ 
     import flash.filters.GlowFilter; 

     import mx.controls.Alert; 
     import mx.events.FlexEvent; 
     import mx.formatters.DateFormatter; 




     protected function img_rollOverHandler(evt:MouseEvent):void { 
      Image(evt.currentTarget).filters = [new GlowFilter(0xf7941d)]; 
      Image(evt.currentTarget).alpha = 0.9; 
     } 

     protected function img1_rollOutHandler(evt:MouseEvent):void { 
      Image(evt.currentTarget).filters = []; 
      Image(evt.currentTarget).alpha = 1; 
     } 

     protected function playClickHandler(event:MouseEvent):void 
     { 

      dispatchEvent(new Event("playClicked",true,true)); 

     } 

    ]]> 
</fx:Script> 

<fx:Declarations> 
    <s:DateTimeFormatter id="dateTimeFormatter" 
         dateTimePattern="DD.MM.YYYY HH.NN.SS"/> 
</fx:Declarations> 

    <s:states> 
     <s:State name="normal" /> 
     <s:State name="hovered" /> 
     <s:State name="selected" /> 
    </s:states> 

    <s:Rect width="100%" height="100%" radiusX="5" radiusY="5"> 
     <s:filters> 
      <s:DropShadowFilter alpha="0.32" alpha.hovered="0.5" blurX="5" blurY="5" distance="2" /> 
     </s:filters> 
     <s:fill> 
      <s:LinearGradient rotation="90"> 
       <s:GradientEntry color="0x323232" color.selected="black"/> 
       <s:GradientEntry color="#7f7f7f" color.selected="0x333333"/>     
      </s:LinearGradient> 
     </s:fill> 
     <s:stroke> 
      <s:SolidColorStroke color="#ffffff" color.hovered="#f7941d" color.selected="#ed7f09" caps="none" weight="2" joints="miter" miterLimit="4"/> 
     </s:stroke> 
    </s:Rect> 

    <s:Label left="10" top="10" 
      fontStyle="italic" 
      fontWeight="bold" 
      color="#f7941d" 
      text="{dateTimeFormatter.format(data.date)}"/> 

    <s:Label left="10" top="25" 
      fontSize="16" 
      fontWeight="bold" 
      color="#ffffff" 
      text="{data.name}"/>  
    <s:Image id="previewImg" left="10" right="10" bottom="10" top="55" scaleMode="stretch" smooth="true" 
      source="http://localhost:5080/thumbs/{data.thumb}" /> 
      <!-- source="assets/img.jpg"/> -->    

    <s:Image source="assets/play.png" 
      rollOver="img_rollOverHandler(event);" 
      rollOut="img1_rollOutHandler(event);" 
      x="136" y="102" 
      click="playClickHandler(event)" 
      complete="this.invalidateSize()"/> 
</s:ItemRenderer> 
+0

VideoItemRenderer2のセットデータ関数が正しく更新されていることを確認してください。これは、リサイクルされたアイテムレンダラーが正しく更新されない問題です。 –

+0

どうすればいいですか?あなたが私に何かの例や指示をくれたなら、私は感謝しています。 – sstauross

+0

画像と他のものが 'public function set data(value:Object):void'にセットされていることを確認してくださいVideoItemRenderer2に追加します。 –

答えて

0

は、ここに私のitemRendererです。これをルートタグに追加してみてください。

dataChange="yourImage.validateNow(); 

これがうまくいかない場合は、dataChangeにパス全体を設定してください。

+0

私はこれを入れましたが、何も言わなかった...「dataChangeで全体のパスを設定する」とはどういう意味ですか?すみませんが、私はこのすべてのものに新しいです..あなたの助けを事前にたくさんありがとう! – sstauross

+0

私はどのように表示する準備ができるまでレンダリングされていないイメージの場所にロードGIFを置くことができますか?どんな助け?これで問題は解決しますか? – sstauross

+0

previewImageタグのバインディング式にパスを入れる代わりに、dataChange = "previewImage.source = http:// localhost:5080/thumbs/{data.thumb}"を実行します。問題は何らかの理由でスパーク画像でデータバインディングが機能しないため、Imageタグの外からソースを明示的にリセットする必要があるということです。 –

関連する問題