locked
ListView load: find out when a page of elements is shown

    Question

  • Hello all. I've checked similar questions to this one, but cannot find any real answer.

    I'd like my code to take some action when the ListView is "loaded". By "loaded" I mean that at least a page-worth of elements is visible on the screen.

    In my case, items contains text and image downloaded from the web. It's ok if the images are still loading. But at least I'd like to get my code invoked when the listview has taken up all the space it needs for its items, and has layed out them on the screen.

    I tried with exposing at the UI.Pages level a promise bound to the data.items Binding.List being loaded. But that fires quite early, when the ListView has yet to place any item on the screen.

    I tried also listening the loadingstatechanged event, but apparently that gets fired for every item on the first page-worth of items, and then gets called many times when user starts scrolling.

    What am I doing wrong? Thanks


    • Edited by GiUmaTo Friday, June 1, 2012 7:55 PM
    Friday, June 1, 2012 7:54 PM

Answers

  • I do not know of a way to do this.  Normally the offline image is a progress ring and as images come in they replace the static image automatically.

    -Jeff


    Jeff Sanders (MSFT)

    Monday, June 4, 2012 6:22 PM
    Moderator

All replies

  • What action are you taking that requires you to know this?  The data is loading in the background and things like images may come in even later (especially if loading from the web).

    -Jeff


    Jeff Sanders (MSFT)

    Friday, June 1, 2012 8:14 PM
    Moderator
  • I'd like to show the progress ring until the listView has layed out its items, and then fade out the ring and fade in the listview.

    Or I'd like to place some element right-aligned on the list surface (the div with win-surface class), and keep that element hidden until the listItems are layed out on the screen, then show it after that.

    Those are some of the things I was trying. As I said, I tried "waiting" upon a promise attached to the data loading in the background, but that promise seems to be satisfied "too early" with respect to listitems being layed out on the screen.



    • Edited by GiUmaTo Saturday, June 2, 2012 8:54 AM
    Saturday, June 2, 2012 8:53 AM
  • I do not know of a way to do this.  Normally the offline image is a progress ring and as images come in they replace the static image automatically.

    -Jeff


    Jeff Sanders (MSFT)

    Monday, June 4, 2012 6:22 PM
    Moderator
  • Thanks for the reply. 

    Regarding the images contained in any single ListView item, I implemented a fading that kicks in when each single image is loaded.

    What I wanted to achieve, and I've not been able to, was to hide the ListView during all the time it takes to lay its items on the page.

    When I attach a Binding.List to the ListView, and even after the promise on Binding.List has been fulfilled, it still takes some amount of time for the ListView to show all its items. That happens even if your items are just made of a square with text taken from Binding.List.

    As I said, I was not able to capture when that happens.

    Regards.


    • Edited by GiUmaTo Monday, June 4, 2012 7:48 PM
    Monday, June 4, 2012 7:47 PM