Flex: posto di commutazione delle immagini nella lista dei file

Question

Sto riscontrando un problema strano con itemRenderers all'interno di un TileList.

Ecco un esempio funzionante senza un itemRenderer: 152.org/flex/

Ecco la versione rotta con un itemRenderer: 152.org/brokenExample/
(Non ho il rappresentante per rendere entrambi questi link)

Entrambi gli esempi hanno " Visualizza sorgente " enabled.

Per vedere il problema usa l'esempio rotto, seleziona un album e scorri verso il basso di una riga. Scorri verso l'alto e le immagini verranno cambiate. Se lo provi nell'esempio funzionante, va bene.

Questo sembra essere un bug ampiamente noto, ma non riesco a trovare una soluzione per questo.

UPDATE
Ho ricominciato a giocare con questo esempio e ho scoperto qualcos'altro. Si scopre che non è necessario sovrascrivere il data setter. È possibile creare un nuovo metodo in itemRenderer che viene impostato ogni volta che il riquadro desidera aggiornare. Quindi il trucco è non fare affidamento sui metodi di inizializzazione o creazione completa.

Questo è quello che ho per itemRenderer nell'applicazione.

<itemRenderers:ImageTile img="{data}"/>

Questo è il codice che ho nell'elementoRenderer.

public function set img(value:String) : void {
  trace("setting source: " + value);
  this.source = value;
  this.name = value.toString().split("/").pop().split(".").shift();
}

Ho aggiornato il mio esempio per riflettere questa modifica.

Answer 1

Non ho la tua app a portata di mano, quindi non posso testare end-to-end, ma ho esaminato la tua fonte. Probabilmente dovrai sovrascrivere il setter dati nel tuo itemRenderer:

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init()">

 <mx:Script>
  <![CDATA[

   override public function set data(value:Object):void
   {
    super.data = value;
    this.source = data;
    this.name = data.toString().split("/").pop().split(".").shift();
   }

   private function init() : void {
    // Removed from your source and transplanted above
   }

  ]]>
 </mx:Script>

</mx:Image>

Flex proverà a riutilizzare i renderer di elementi negli elenchi (il che significa che gli eventi del ciclo di vita che potresti aspettarti - inizializzazione, creazione completata, ecc. - non sempre si attiveranno), quindi se vuoi essere sicuro del tuo renderer viene aggiornato quando l'elemento di dati cambia (come accade quando si verificano eventi di scorrimento), la migliore pratica è quella di sovrascrivere la proprietà dei dati del renderer. Molto probabilmente risolverà il problema.

Answer 2

Forse tentare di invalidare al termine della creazione?

Da quello che ricordo con DataGrids (che funziona in qualche modo in modo simile a un elenco dei collegamenti), quando un oggetto viene messo a fuoco viene ricreato.

<mx:itemRenderer>
  <mx:Image id="myImage" creationComplete="myImage.invalidate()" />
</mx:itemRenderer>

Non ho provato questo codice ma penso che sia qui che vuoi iniziare a cercare. Ho dato un'occhiata al componente ItemRenderer. Prova a createComplete invece di inizializzare per chiamare la tua funzione