How to: Consume an OData Service for Windows Phone

1. In Solution Explorer, right-click the Solution, point to Add, and then select New Project.

2. In the Add New Project dialog box, select Silverlight for Windows Phone from the Installed Templates pane, and then select the Windows Phone Application template. Name the project ODataNorthwindPhone.

3. In the New Windows Phone Application dialog box, select Windows Phone 7.1 in the Target Windows Phone Version drop-down box.

4. Click OK. This creates the application for Silverlight.

1. Right-click the ODataNorthwindPhone project, click Add Service Reference.

   This displays the Add Service Reference dialog box.

2. In the Address text box, enter the following URI value and then click Go:

   Copy

   http://services.odata.org/Northwind/Northwind.svc/
   

   This downloads the metadata document from the public, read-only Northwind sample data service.

3. In the Namespace text box, type Northwind, and then click OK.

   This adds a new code file to the project, which contains the data classes that are used to access and interact with data service resources as objects. The data classes are created in the namespace ODataNorthwindPhone.Northwind. A reference to the System.Data.Services.Client.dll assembly is also added.

1. In the project, double-click the MainPage.xaml file.

   This opens XAML markup for the MainPage class that is the user interface for the Windows Phone application.

2. Replace the existing XAML markup with the following markup that defines the user interface for the main page that displays customer information.

   Copy

   <phone:PhoneApplicationPage
       x:Class="ODataNorthwindPhone.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
       xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
       xmlns:my="clr-namespace:ODataNorthwindPhone.Northwind"
       mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" 
       d:DataContext="{d:DesignInstance Type=my:Customer, CreateList=True}"
       FontFamily="{StaticResource PhoneFontFamilyNormal}"
       FontSize="{StaticResource PhoneFontSizeNormal}"
       Foreground="{StaticResource PhoneForegroundBrush}"
       SupportedOrientations="Portrait" Orientation="Portrait"
       shell:SystemTray.IsVisible="True" Loaded="MainPage_Loaded">
       <Grid x:Name="LayoutRoot" Background="Transparent">
           <Grid.RowDefinitions>
               <RowDefinition Height="Auto"/>
               <RowDefinition Height="*"/>
           </Grid.RowDefinitions>
           <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
               <TextBlock x:Name="ApplicationTitle" Text="Northwind Sales" 
                          Style="{StaticResource PhoneTextNormalStyle}"/>
               <TextBlock x:Name="PageTitle" Text="Customers" Margin="9,-7,0,0" 
                          Style="{StaticResource PhoneTextTitle1Style}"/>
           </StackPanel>
           <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
               <ListBox x:Name="MainListBox" Margin="0,0,-12,0" ItemsSource="{Binding}">
                   <ListBox.ItemTemplate>
                       <DataTemplate>
                           <StackPanel Margin="0,0,0,17" Width="432">
                               <TextBlock Text="{Binding Path=CompanyName}" TextWrapping="NoWrap" 
                                          Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                               <TextBlock Text="{Binding Path=ContactName}" TextWrapping="NoWrap" 
                                          Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
                               <TextBlock Text="{Binding Path=Phone}" TextWrapping="NoWrap" Margin="12,-6,12,0" 
                                          Style="{StaticResource PhoneTextSubtleStyle}"/>
                           </StackPanel>
                       </DataTemplate>
                   </ListBox.ItemTemplate>
               </ListBox>
           </Grid>
       </Grid>
   </phone:PhoneApplicationPage>
   

1. In the project, open the code page for the MainPage.xaml file, and add the following using statements:

   Copy

   using System.Data.Services.Client;
   using ODataNorthwindPhone.Northwind;
   
   

2. Add the following declarations to the MainPage class:

   Copy

   // Declare the data service objects and URIs.
   private NorthwindEntities context;
   private readonly Uri northwindUri =
       new Uri("http://services.odata.org/Northwind/Northwind.svc/");
   private DataServiceCollection<Customer> customers;
   

3. Add the following MainPage_Loaded method to the MainPage class:

   Copy

   private void MainPage_Loaded(object sender, RoutedEventArgs e)
   {
       // Initialize the context and the binding collection 
       context = new NorthwindEntities(northwindUri);
       customers = new DataServiceCollection<Customer>(context);
   
       // Define a LINQ query that returns all customers.
       var query = from cust in context.Customers
                   select cust;
   
       // Register for the LoadCompleted event.
       customers.LoadCompleted
           += new EventHandler<LoadCompletedEventArgs>(customers_LoadCompleted);
   
       // Load the customers feed by executing the LINQ query.
       customers.LoadAsync(query);
   
   }
   
   

   When the page is loaded, this code initializes the binding collection and content, and registers the method to handle the LoadCompleted event of the DataServiceCollection<T> object, raised by the binding collection.

4. Add the following customers_LoadCompleted method to the MainPage class:

   Copy

   void customers_LoadCompleted(object sender, LoadCompletedEventArgs e)
   {
       if (e.Error == null)
       {
           // Handling for a paged data feed.
           if (customers.Continuation != null)
           {
               // Automatically load the next page.
               customers.LoadNextPartialSetAsync();
           }
           else
           {
               // Set the data context of the list box control to the sample data.
               this.LayoutRoot.DataContext = customers;
           }
       }
       else
       {
           MessageBox.Show(string.Format("An error has occurred: {0}", e.Error.Message));
       }
   }
   

   When the LoadCompleted event is handled, the following operations are performed if the request returns successfully:

   • The LoadNextPartialSetAsync() method of the DataServiceCollection<T> object is called to load subsequent results pages, as long as the Continuation property of the DataServiceCollection<T> object returns a value.

   • The collection of loaded Customer objects is bound to the DataContext property of the element that is the master binding object for all controls in the page.

For information about how to persist and restore application data during state changes that might occur during execution, see How to: Persist the State of an OData Client for Windows Phone.