Coding Paradox

Blog On .Net, CSharp, Windows Phone Programming

Calling Web Service from Windows Phone 8 App

without comments

In this post we will take a look at how to call a web service from a Windows Phone 8 app and retrieve data in JSON format. We will be calling a simple REST web service from our sample application to retrieve the latest weather information and display the same.

Web Service

We will be using the weather API provided by OpenWeatherMap.org. The Api is simple and free to use and provides current weather information as well as weather forecast from the next few days. The api provides various options to get the weather information based on Location, Pin Code, Latitude/Longitude coordinated etc. We will be using the below mentioned api call to get the weather forecast data for a week based on Pin Code.

http://api.openweathermap.org/data/2.5/forecast/daily?q=London&mode=json&units=metric&cnt=7” . As you can see, this query gets the weather data for ‘London’ in JSON format. We can also pass the Pincode to the same query instead of City Name. We are also specifying the ‘mode’ as JSON  as we want the data to be returned in JSON format. If you enter the above URL in Firefox/IE, you will get the data in JSON format as shown below.

This contains all the data we need and we will be using the same in our app.

Creating the Project

Open Visual Studio 2013 –> New Project –> Windows Phone Apps –> Blank App. In the Application Name enter “WebServiceExampleApp” and click “Ok”. This will create a new Windows phone application with the default template.

We will also be using the “JSON.Net” and “Microsoft Http Client Libraries” Nuget packages in our app. Right Click on the solution and select “Manage NuGet packages” to open Nuget package manager. Search and install these two packages as shown below in your project. The Json.net is a powerful JSON serializer which provides classes for serializing/deserializing json.

In our application, we will allow the user to enter the Pincode and hit the button the fetch the latest weather data for that Pincode. Our final UI will look as shown below.

Shown Below is the XAML that we have used.

The stack panel “spWeatherInfo” is used to display the data retrieved from the service. We are using a ListBox with a Data Template to display the weather information using DataBinding.

In the JSON received from the service, we are getting the “date” in Unix style format so we are making use of a value converter class to convert it into a DateTime object for display. Add a new class called “DateConverter.cs” in the application the code of which is shown below.

 It derives from the “IValueConverter” interface and implements the Convert() method which is used to convert the data from int to a DateTime. It also has a ConvertBack method which we have not implemented as we have not used it.

We have defined the converter in our MainPage.xaml above the Grid tag.

We then apply the Converter to the TextBlock as shown below

The converter will convert the date from “int” to DateTime before displaying it in the TextBlock.

Our JSON contains the information in a lot of complex objects. We will need to convert it into a list of objects that we can use with our application. I have used a online tool called Json2Csharp which generated C# classes from JSON. Add a new class to the application called WeatherObject having below code which has been generated using the tool.

We do our web service call and data retrieval on click of GetData button. In the MainPage.xaml.cs, include the following namespaces.

Our GetData button click method is implemented as shown  below

We are creating an object of the HttpClient class which will be used to call the web service. We are also specifying the base address of the service and we are construction the url dynamically based on the PinCode which the user has provided. The “client.DefaultRequestHeaders.Accept.Add(new MediaTypeWithQualityHeaderValue(“application/json”));” sets the request header to accept data in JSON format.

We then call the “GetAsync()” function passing the URL of the web service. We then check the response to see if that was successful or not. If the response was “Ok”, we read the JSON as a string by calling the “ReadAsStringAsync()” method of response object. Once that is done, we deserialize the JSON object and convert it into appropriate class which is then used to set the DataContext of stack panel.

Once DataBinding is complete, you will be able to see the data as shown below.

 

I have used a simple example to demonstrate how to call the web service from Windows Phone. In a real world scenario, you will need to check for a lot of error or exception conditions also.

Download Solution

Written by Mako

October 22nd, 2014 at 10:57 am