Qui n’a jamais eu le désagréable clignotement des images dans une liste en Flex ? Vous savez, ce clignotement qui vous donne l’impression que vos images sont rechargées à chaque fois que vous scrollez dans une liste d’image… D’autant plus qu’elles sont vraiment rechargées à chaque fois.

Si vous avez essayé comme moi de faire un visualiseur pour Flickr (rien à voir le clignotement là), vous avez du le remarquer, et vous avez du vous arracher les cheveux sur le composant List (ou autre) et sur les composants Image pour trouver pourquoi il voulait absolument recharger les images à chaque fois.

Et bien vous savez, vous n’êtes pas les seuls à avoir eu ce problème (la preuve, je l’ai eu sinon je n’en parlerais pas), mais certains en plus de l’avoir eu, l’on résolu !

En cherchant comment le résoudre pour une énième fois, j’ai fini par trouver le blog de Quietly Scheming. Outre le fait qu’il explique des choses intéressantes pour Flex, il donne aussi du code clef en main (à un bémol pour Flex 4 et les composants Spark), pour corriger ce problème de clignotement. Je vous laisse découvrir la suite sur l’article du blog en question (en anglais) ”how I made my Flex List Images stop flickering.”.

Comment s’en servir ? Récupérez les classes qui vont bien, mettez les dans votre projet, et ensuite, au lieu de prendre du , prenez du , pas bien compliqué. Il y a quelques limitations par rapport aux images Flex natives, mais il faut se limiter à utiliser ces SuperImages dans des listes, et ne pas en mettre là où les images natives sont déjà suffisantes.

Il y avait un bémol avec Flex 4 ? En fait oui, mais pas grand chose de bien dramatique. L’auteur a poussé le vice de ces images à rajouter un effet de bordure, sauf que avec l’arrivée de Spark, la façon dont il défini les bordures pose problème, en effet il recherche la classe du style « BorderSkin » via la fonction getStyle, or cette fonction renvoie depuis l’arrivée de Spark, une classe Spark, là où une classe mx était demandée, Résultat, crash à l’instanciation. J’avoue ne pas avoir pris le temps de le corriger pour m’en servir, d’autant que les cadres autour des images, je m’en moque un peu, j’ai donc juste retiré la fonctionnalité de la manière suivante :

127
var borderClass:Class;// = getStyle("borderSkin");

Pas très élégant, mais suffisant. Promis, bientôt je regarderais comment corriger et remettre les bordures.