vendredi 29 juillet 2011

La guerre des scrollbars

Je vous fait part d'un bug sur flex 3 que j'ai rencontré (et que j'ai contourné bien sûre  :D) qui concerne les barres de défilement.

Prenons un exemple : un Canvas qui a un width à 100%  par rapport à son conteneur, c'est à dire que sa largeur est égal à celle de son conteneur (à quelques pixels près en fonction des bordures). Lorsque la barre de défilement vertical est affichée (pour une raison ou pour une autre : manque de hateur dans le contenur, verticalScrollPolicy à ON ... ), la barre de défilement horizental est affiché automatiquement, à tort!

La raison est que la largeur du Canvas ne se met pas à jour automatiquement pour prendre en compte la barre de défilement vertical qui est apparu. Ce qui fait que le conteneur du Canvas n'a pas assez de place pour visualiser entièrement un composant (le Canvas) qui a 100% de largeur et une barre qui à 20 pixel de largeur ça fait un truc genre 100%+20pixel qui est supérieur à 100% qui est la largeur du conteneur :D ...


Bref la barre de défilement horizontal est affichée du coup, et c'est un bug flex 3. CQFD.


Et c'est la même chose si on jout avec la largeur du Canvas ...

Pour contourner le problème j'ai surchargé la méthode validateSize() de mon Canvas pour décider du fait d'afficher ou pas les barres : 
override public function validateSize(recursive:Boolean = false):void {
       super.validateSize(recursive);
       if (!initialized) return;
              validateHorizontalScrollPolicy();
              validateVerticalScrollPolicy();
       }
      
private function validateHorizontalScrollPolicy():void{
       if (width < measuredWidth){ // measuredWidth : largeur visualisée ?!
             horizontalScrollPolicy = ScrollPolicy.AUTO;
       }else{
              horizontalScrollPolicy = ScrollPolicy.OFF;
       }
}
private function validateVerticalScrollPolicy():void{
       if (height < measuredHeight){ // measuredHeight : hauteur visualisée ?!
             verticalScrollPolicy = ScrollPolicy.AUTO;
       }else{
             verticalScrollPolicy = ScrollPolicy.OFF;
       }
}



Le seul problème qui reste est que la méthode validateSize n'est pas appelé à chaque changement de taille du Canvas (c'est un mystère je sais :D). C'est pour ça que dans mon composant je fait l'appel à la méthode  validateSize au déclenchement de l’évènement resize.


Bon voilà le composant : VBoxScrollBugFixed

Sur flex 4 je ne sais pas si le même bug existe, mais je sais que le mécanisme d'ajout/affichage des scrollbar différe de celui de flex 3.

Bon courage, à ciao bonsoir!

Aucun commentaire:

Enregistrer un commentaire