LongListSelector and scroll to top #wpdev

I pulled out my Marauder’s Map, tapped my wand and said “I solemnly swear I’m up to no good”. Bang Visual Studio opens up and I am back to playing with Cineworld app. I know a few users hate my ever so frequent updates but I use the app and I need change🙂

so I recently got to putting a DatePicker and LongListSelector for being able to “Show by date” film listings. It all worked – well mostly worked until I realised that LongListSelector was scrolled all the way to the bottom. I wonder why..

Of course there is no SelectedIndex I could magically set so did a quick search on the net.. StackOverflow usually has all the answers to “the life, the universe and everything else” but it didn’t really have one for this question.

There was a note saying use UpdateLayout and then ScrollTo and setting it to ItemSource’s first child did the trick for WP8 but not for WP7.

var dataLetter = cd.GetGroupForDate(userSelection); // get the grouped list of films

FilmsForSelectedDate.Clear(); // clear the bound observable collection

foreach (var entry in dataLetter)
    FilmsForSelectedDate.Add(entry);

lstShowByDate.UpdateLayout(); // call updatelayout

if (FilmsForSelectedDate.Count != 0)
    lstShowByDate.ScrollTo(FilmsForSelectedDate[0]); // set scroll to first group in the list

The problem I realised was that the first group in the LLS had zero items i.e. it was not being shown. This affected WP7 toolkit LongListSelector but not the native WP8 LongListSelector

var dataLetter = cd.GetGroupForDate(userSelection);

FilmsForSelectedDate.Clear();

foreach (var entry in dataLetter)
    FilmsForSelectedDate.Add(entry);

lstShowByDate.UpdateLayout();

if (FilmsForSelectedDate.Count != 0)
    lstShowByDate.ScrollTo(FilmsForSelectedDate.First(g => g.HasItems));

So the solution as shown above is, find the group that has items and set scroll to that element.

Mischief managed!

4 thoughts on “LongListSelector and scroll to top #wpdev

  1. I had this exact problem a couple of days ago. What I discovered was that after I pulled data, and went to create the groupings for the LLS, in the LINQ statement I was creating the ObservableCollection<group> and returning that directly. And for some reason (not sure why) this would cause the LLS to be bottom scrolled.
    So instead I removed the full creation of the ObservableCollection from the LINQ statement and instead just created an IEnumerable<group> then iterated on a foreach and added each item to the ObservableCollection. And thus my LLS no longer bottom scrolled on load.
    Still not sure why it would cause that. I tried reversing the OC from the first case (like maybe it was populating backwards and tricked the LLS).
    I should test again to see if reproducible but not much time for it.

    • I could have done that but I didn’t want to keep recreating new collections rather wanted to reuse existing plus using a converter to display list empty message.

      Reverse loading.. now that’s a thought🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s