U2 WCF OData service (RESTful service) for Windows Phone 8 applications

In this topic we will describe how to consume WCF oData Service in a Windows Phone 8 App.

The app that we create in this walkthrough enables you to view U2 UniVerse Account XDEMO. The file is PRODUCTS.

To know how to create oData Service using U2 Toolkit for .NET, please refer

On Rocket Blog: How to create WCF oData Service using Visual Studio 2012, Code First Entity Model and U2 Toolkit for .NET?

We will create this app by using the Windows Phone 8 Databound Application template as a starting point, and we will replace the sample data provided by the template with XDEMO data from the OData service.

In this walkthrough, we will perform the following tasks:

  1. Create a new Windows Phone 8 app.
  2. Add a data service reference to the project.
  3. Query the OData service and bind the results to controls in the app

Prerequisites

  1. U2 Toolkit for .NET v1.2.1+
  2. U2 UniVerse Database with XDEMO Account – PRODUCTS File – movie image is stored in PRODUCTS File as MOVIE_IMAGE attribute (image can be stored as VARBIT or Base64String)
  3. Visual Studio 2012 with Windows Phone 8 SDK installed.
  4. OData client for Windows Phone 8 : WCF Data Services Tools for Visual Studio.

Create the Windows Phone app

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

In the Add New Project dialog box, select Windows Phone from the Installed Templates pane, and then select the Windows Phone Databound App template.

fig1

In the Windows Phone platform selection dialog box, select Windows Phone OS 8.0 in the Target Windows Phone Version drop-down box.

fig2

Click OK. This creates the app.

fig3

Add a data service reference to the project

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

Right-click the DataBoundApp1 project, click Add Service Reference. This displays the Add Service Reference dialog box.

fig4

In the Address text box, enter the following URI value and then click Go ( we will use similar link describe in stackover “Create U2 oData Service using Code First and U2 toolkit for .NET”

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

fig5

Take default everything 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 DataBoundApp1.ServiceReference1. A reference to the System.Data.Services.Client.dll assembly is also added.

Define the Windows Phone app UI

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 app.

Drag and Drop 4 Button Controls and put the name as shown in figure below. You can replace the existing XAML markup with the following markup that defines the user interface for the main page that displays product information. For this walkthrough, we will show “Using Code First” only.

fig6

To populate U2 data, we need to create another Windows Phone Page (CodeFirst_Details_Page.xaml). So when you click “Using Code First” button , new Windows Phone Page (CodeFirst_Details_Page.xaml) will be displayed with U2 Data.

fig7

Add the code that binds data service data to controls in the Windows Phone app

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

using U2PhoneApp.U2_CodeFirst_oData_Service;
using System.Data.Services.Client;

Add the following declarations to the MainPage class:

 // Declare the data service objects and URIs.
private ProductContext context;
private readonly Uri XdemoUri =
new Uri("http://9.72.199.235/U2_oData_Service/
U2_CodeFirst_oData_WcfDataService.svc/");
private DataServiceCollection products;

Add the following MainPage_Loaded method to the MainPage class:


private void PhoneApplicationPage_Loaded(object sender,
RoutedEventArgs e)
// Initialize the context and the binding collection
context = new ProductContext(XdemoUri);
products = new DataServiceCollection<Product>(context);
context.Products.AddQueryOption("$top", 10);
// Define a LINQ query that returns all products.
var query = from cust in context.Products
//where cust.ProductId == 2761685473
select cust;
// Register for the LoadCompleted event.
products.LoadCompleted
+= new EventHandler<LoadCompletedEventArgs>(products_LoadCompleted);
// Load the products feed by executing the LINQ query.
products.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 object, raised by the binding collection.

Add the following products _LoadCompleted method to the MainPage class:

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

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

  • The LoadNextPartialSetAsync() method of the DataServiceCollection object is called to load subsequent results pages, as long as the Continuation() property of the DataServiceCollection object returns a value.
  • The collection of loaded Products objects is bound to the DataContext property of the element that is the master binding object for all controls in the page.

Run the app in the emulator

fig8

On the Debug menu, click Start Without Debugging.

The emulator opens, and the app starts. You will see the following:

fig9

Click “Using Code First” button

fig10

Runs oData Service (REST) and get data from U2 UniVerse XDEMO account

fig11

Source Code

See Rocket U2 Server Lab GitHub

Conclusion

This demo/walkthrough shows how to consume U2 WCF oData Service (REST) in Windows Phone 8 application.

The following two tabs change content below.
Rocket Software is a leading global developer of software products that help corporations, government agencies and other organizations reach their technology and business goals. 1,200 Rocketeers on five continents are focused on building and delivering solutions for more than 10,000 customers and partners.

, ,

No comments yet.

Leave a Reply