If you create a new Windows Phone project and use the Windows Phone Binding Template , most of the work you do will be done.
What you want to do is set up the ViewModel to contain all the data for your application. You can serialize and deserialize this data with IsolStorage so that it is saved in application sessions and during Tombstoning.
In the template, you will see MailViewModel and ItemViewModel . MainViewModel stores all the data your application needs, including the ObservableCollection ItemViewModel, and ItemViewModel is a separate data type for your application.
On the DetailsPage.xaml page, you'll want the DataBind of each text field in the App.MainViewModel elements. Set the binding to TwoWay if you want the ViewModel to be updated as soon as the user manipulates the data on DetailsPage.xaml. You can optionally bind to OneWay, and then click OK, which writes the changes back to the ViewModel and stores the IsolStorage value.
Here is an example of what the binding looks like:
<TextBlock x:Name="ListTitle" Text="{Binding LineOne}" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
In this case, LineOne is a property in the ItemViewModel, and the page retrieves this data from the query string when the user selects an item from MainPage.xaml. The DataContext for the page determines where the data information comes from.
Here is a snippet in which MainPage passes the selected item from the ViewModel to DetailsPage.
// Handle selection changed on ListBox private void MainListBox_SelectionChanged(object sender, SelectionChangedEventArgs e) { // If selected index is -1 (no selection) do nothing if (MainListBox.SelectedIndex == -1) return; // Navigate to the new page NavigationService.Navigate(new Uri("/DetailsPage.xaml?selectedItem=" + MainListBox.SelectedIndex, UriKind.Relative)); // Reset selected index to -1 (no selection) MainListBox.SelectedIndex = -1; }
This is how ItemPage gets the selected item.
protected override void OnNavigatedTo(NavigationEventArgs e) { string selectedIndex = ""; if (NavigationContext.QueryString.TryGetValue("selectedItem", out selectedIndex)) { int index = int.Parse(selectedIndex); DataContext = App.ViewModel.Items[index]; } }
Play with the default template above and ask additional questions.
The beauty of data binding and ObservableCollection is that you can simply update the data, and the UX will reflect these changes immediately. This is because any data changes raise an event:
public string LineOne { get { return _lineOne; } set { if (value != _lineOne) { _lineOne = value; NotifyPropertyChanged("LineOne"); } } }
NotifyPropertyChanged (), which passes this information to the view.