Flex: emplacement de commutation d'images dans la liste de sélection

Question

Je rencontre un problème étrange avec itemRenderers dans une liste de tuiles.

Voici un exemple de travail sans itemRenderer: 152.org/flex /

Voici la version cassée avec un itemRenderer: 152.org/brokenExample/
(Je n'ai pas le représentant pour en faire un lien)

Les deux exemples ont " View Source " activé.

Pour voir le problème, utilisez l'exemple cassé, sélectionnez un album et faites défiler une ligne. Revenez en arrière et les images seront changées. Si vous essayez ceci sur l'exemple de travail, tout va bien.

Cela semble être un bug largement connu, mais je ne trouve pas de solution à ce problème.

MISE À JOUR
J'ai recommencé à jouer avec cet exemple et j'ai découvert autre chose. Il s'avère que vous n'avez pas à remplacer le configurateur de données. Vous pouvez créer une nouvelle méthode dans l'itemRenderer qui est défini chaque fois que la tuile veut être actualisée. Le truc est donc de ne pas compter sur les méthodes initialize ou creationComplete.

C’est ce que j’ai pour itemRenderer dans l’application.

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

Ceci est le code que j'ai dans l'itemRenderer.

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

j'ai mis à jour mon exemple pour refléter ce changement.

Answer 1

Je n'ai pas votre application à portée de main, je ne peux donc pas tester de bout en bout, mais j'ai consulté votre source. Vous devez probablement remplacer le paramètre data dans votre outil de rendu:

.

<?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 tentera de réutiliser les rendus d'élément dans les listes (ce qui signifie que les événements de cycle de vie auxquels vous pouvez vous attendre - initialisation, créationComplète, etc. - ne se déclenchent pas toujours). Par conséquent, si vous voulez être sûr que votre rendu est mis à jour lorsque l'élément de données change (comme c'est le cas lorsque des événements de défilement se produisent), la meilleure pratique consiste à remplacer la propriété de données du rendu. Cela résoudra probablement le problème.

Answer 2

Peut-être essayez-vous d'invalider sur creationComplete?

De ce que je me souviens de DataGrids (qui fonctionne un peu de la même manière qu’une liste à choix), quand un élément est mis au point, il est recréé.

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

Je n'ai pas essayé ce code mais je pense que c'est là que vous voulez commencer à chercher. J'ai jeté un coup d'oeil à votre composant itemRenderer. Essayez créationComplete au lieu d’initialiser pour appeler votre fonction