Load items asynchronously to a ListView after navigation to Page Windows Phone 8.1

Question

I have a Windows Phone 8.1 app in which I have a button that Navigates to PageTwo.xaml. In that PageTwo.xaml.cs, in the code behind I have something like this:

string type = "";

protected override void OnNavigatedTo(NavigationEventArgs e) {
    type = e.Parameter.ToString();          
}

private void Page_Loaded(object sender, RoutedEventArgs e) {
    PageTwoListViewModel pageTwoListViewModel = ViewModelLocator.PageTwoListStatic;
    this.DataContext = pageTwoListViewModel;
}

The reason I'm setting the DataContext in the Page_Loaded event is because the project is a ClassLibrary and I have no App.xaml file, but that shouldn't affect anything related to my problem.

Then in my PageTwoViewModel I have the following:

public RelayCommand PageLoadedCommand { get; private set; }

public PageTwoListViewModel() {
    this.PageLoadedCommand = new RelayCommand(PageLoaded);
}

private void PageLoaded() {
    LoadList();
}

private async void LoadList() {
    ObservableCollection<MyListModel> _list = await DatabaseService.GetList();
    MyViewList = _list;
}

The code responsible for triggering the PageLoadedCommand is:

<Page (...)>
    <i:Interaction.Behaviors>
        <core:EventTriggerBehavior EventName="Loaded">
            <core:InvokeCommandAction Command="{Binding PageLoadedCommand}">
            </core:InvokeCommandAction>
        </core:EventTriggerBehavior>
    </i:Interaction.Behaviors>
</Page>

The problem here is that the OnNavigatedTo and both Page_Loaded events run before the Page is visible, so if I have a big list to fill, only after everything is done does it go to PageTwo.xaml, freezing the application.
What I want to do is to navigate to PageTwo.xaml and when there, fire up a loading animation and fill my ListView asynchronously. How can I do this?

The fire order is: OnNavigatedTo -> Page_Loaded -> PageLoadedCommand(PageLoaded) — Schrödinger's Box, Oct 24 '14 at 15:12
How many list items are we talking about here? What's the nature of `DatabaseService.GetList()`? Is it truly asynchronous? I'm thinking, maybe your database service is blocking the UI thread somehow. Need more information. — Decade Moon, Oct 26 '14 at 04:36
The ORM I was using for the Database calls was not entirely asynchronous, so that was in fact the problem. — Schrödinger's Box, Nov 03 '14 at 19:22

score 1 · Accepted Answer · answered Nov 03 '14 at 19:22

As it turned out, my problem came from a rather stupid thing. My DatabaseService.GetList(); was not entirely asynchronous, and that was what was causing the problem, so the above implementation works just fine as long as you guarantee the Database calls are asynchronous.

Load items asynchronously to a ListView after navigation to Page Windows Phone 8.1

1 Answers1