Spark: défilement automatiquement mis à la fin d'une liste ne fonctionne pas correctement

StackOverflow https://stackoverflow.com/questions/3761076

  •  04-10-2019
  •  | 
  •  

Question

J'utilise le code MXML suivant pour afficher une liste de certaines données. J'ai construit un moteur de rendu personnalisé qui peut avoir une hauteur variable. Chaque fois qu'une nouvelle donnée arrive, la barre de défilement doit aller à la fin de la liste. Je me suis inscrit aux événements qui déclenche un changement de tableau.

Il fonctionne très bien si la hauteur des articles est le même. Mais si cela ne se produit pas, la barre de défilement va un peu au-dessus de la fin.

Si la hauteur d'un élément du milieu de la liste est plus grande, alors les derniers éléments ne sont pas visibles.

Pouvez-vous me donner quelques conseils pour résoudre ce problème?



    <s:Scroller width="100%" height="100%" id="scroller" horizontalScrollPolicy="off">
        <s:DataGroup
            id                      = "lstComments"
            width                   = "100%"
            height                  = "100%"
            clipAndEnableScrolling  = "true"
            itemRenderer            = "myCustomRenderer">    

            <s:layout>
                <s:VerticalLayout
                    id                  = "vLayout" 
                    useVirtualLayout    = "true"
                    gap                 = "2" 
                    variableRowHeight   = "true" 
                    horizontalAlign     = "left" 
                    verticalAlign       = "top"
                    paddingTop          = "0" 
                    paddingBottom       = "0" />
            </s:layout>
        </s:DataGroup>
    </s:Scroller>




    private function onArrayChange(event:CollectionEvent):void
    {
        switch(event.kind) {
            case CollectionEventKind.ADD:
            {
                callLater(scrollDown);
                break;
            }
        }
    }


    private function scrollDown():void
    {
        scroller.verticalScrollBar.value = scroller.viewport.contentHeight - scroller.viewport.height;
        scroller.invalidateProperties();
    }


Était-ce utile?

La solution

Enfin, je l'ai trouvé un hack. Le problème a été causé par le scroller.viewport.contentHeight. Il n'a pas été calculé correctement, quand a été appelé la méthode scrollDown.

Alors, pour résoudre ce problème, après avoir créé le scroller je me suis inscrit à l'événement FlexEvent.UPDATE_COMPLETE.

Et la méthode qui gère cet événement:


private function onUpdateCompleteScroller(event:Event):void
{
 //compute the new value for the scroller
 var newValue:Number = scroller.viewport.contentHeight - scroller.viewport.height;
 if (scroller.verticalScrollBar.value != newValue && newValue > 0)
 {  
  scroller.verticalScrollBar.value = scroller.viewport.contentHeight - scroller.viewport.height;
  scroller.invalidateProperties();
 }
}

Si quelqu'un d'autre trouve une meilleure solution, je vais accepter sa réponse.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top