I'm updating an app for a client at the moment and for one of the visual tweaks that I wanted to add meant I wanted to replace a ListBox with a LongListSelector.
All should be simple enough. It should just be a case of replacing this:
<ListBox ItemsSource="{Binding Sessions}"> <ListBox.ItemTemplate> <DataTemplate> // ... </DataTemplate> </ListBox.ItemTemplate> </ListBox>
with this:
<phone:LongListSelector ItemsSource="{Binding Sessions}"> <phone:LongListSelector.ItemTemplate> <DataTemplate> // ... </DataTemplate> </phone:LongListSelector.ItemTemplate> </phone:LongListSelector>
All seemed good but then no items were shown on the page.
Huh!?
Why?!
Well, it turns out that in the ViewModel the Sessions property was an IEnumerable<Session>.
For the LongListSelector to be able to load the items it needs the NotifyPropertyChanged events to be raised. The easiest way to do this was to change the Sessions property to be an ObservableCollection<Session>. This way the necessary events are raised and content is displayed. :)
Obvious really.
Hopefully this reminder will save someone else some head scratching in future.
A collection of items will appear in the LLS w/o the collection being an ObservableCollection. Take the DataBoundApp sample. If you change the Items property of the MainViewModel to a List, or Collection items will still show provided that you notify the UI that the collection has changed. For the sample app it can be as simple as calling NotifyPropertyChanged("Items"); in the end of the LoadData method. If your collection already has data then the LLS will show without any problems.
ReplyDeleteThanks for the extra info Shawn. I just wanted to highlight the fact that ListBox and LongListSelector behave differently in this area.
Delete