none
WinJS - Bug d'affichage dans la page courante d'une FlipView après avoir modifié sa taille RRS feed

  • Question

  • Hello,

    J'ai un div avec 2 colonnes en -ms-grid : "320px 1fr".

    La 1ere colonne contient une WinJS.UI.ListView montrant des articles et la 2e contient une WinJS.UI.FlipView qui affiche l'article sélectionné dans la ListView et qui permet aussi bien sûr de voir l'article précédent/suivant en "swipant" vers la gauche ou vers la droite, jusqu'ici tout va bien.

    J'ai un bouton qui permet de montrer/cacher la ListView, quand l'utilisateur tape dessus, je change la config -ms-grid en "auto 1fr", je donne une style.opacity = "0" à la ListView et appelle forceLayout() sur la FlipView, tout ceci fonctionne aussi très bien.
    Par contre, au deuxième appui de l'utilisateur pour ré-afficher la liste, le div racine repasse en "320px 1fr" (+ style.opacity = "1" sur la ListView + rafraîchissement de la ListView en ré-assignant son itemDataSource + forceLayout() sur la FlipView), l'article courant dans la FlipView a un gros bug d'affichage sur à peu près 100px du côté de la ListView, les éléments invisibles apparaissent au fur et à mesure quand clique dessus l'affichage reste buggé jusqu'à ce que l'utilisateur change l'article courant (changeant donc la page de la FlipView), l'affichage de cette page de la FlipView reste buggé si l'utilisateur revient aussitôt dessus et ce jusqu'à ce que la FlipView recycle la page incriminée.

    Voilà un exemple visuel de ce bug:

    Quelqu'un a-t-il déjà fait face à ce genre de problème ou voit-il un souci dans les manipulations que je fais ?

    Merci d'avance à ceux qui pourraient m'aider !

    Pierre


    mardi 2 avril 2013 10:41

Réponses

  • J'ai une solution potentiellement equivalente en moins de ligne. Dans tous les cas, il faut forcer IE à refaire son rendu car c'est un bug à ce niveau. 

    var items = document.querySelectorAll(".articleItemTemplate");
    if (items) for (var i = 0; i < items.length; i++) { items[i].style.msTransform = 'translateX(0.01px)'; }
    
    setImmediate(function () {if (items) for (var i = 0; i < items.length; i++) { items[i].style.msTransform = ''; }});
    


    Jonathan ANTOINE - Découvrez mon livre sur MVVM: http://goo.gl/N6Tmn - http://www.jonathanantoine.com

    vendredi 5 avril 2013 12:36
    Modérateur

Toutes les réponses