Getting started with Web Requests & JSON in Windows Phone
This is a beginner level post to get you started with JSON, familiarize you with basic communication with web server and Facebook Graph API. Consider a scenario where you want to grab details of a particular Facebook page or a person’s profile in Windows Phone app. A standard practice is to use Facebook Graph API which is a social graph. To begin with you can grab JSON output of a particular page by calling the Facebook graph API end point,
https://graph.facebook.com/<PageNameHere>
Calling this Url you’ll get a JSON reply that will include the details of the particular page. For example calling Microsoft Pakistan’s Developers Facebook page would be like so,
https://graph.facebook.com/msftpk
You can open this file using any standard text processor. Studying this document provides a brief overview of the output attributes per pages returned.
Now here comes the interesting part; how would you parse the JSON into relevant C# objects? There are two important considerations here,
1) To convert JSON string to corresponding C# objects you can simply visit https://json2csharp.com/ and paste JSON response grabbed from the page and click Generate. This online utility will parse the JSOn and generate POCO classes ready to be replicated in the code.
2) To fill these objects you’ll have to make use of Newton Soft’s JSON .NET which is an open source utility available at https://json.codeplex.com/
After you have downloaded JSON .NET DLL’s and made the PCOO classes and add a reference to that in your code. Keeping the attributes in consideration for this particular app our implementation carries page looks like so.
Given the classes and magic of data binding, we’ll bind class level properties with text blocks on UI,
On the button event handler in XAML we’ll download the string from graph API using web client object, and then will deserialize the object using JSON .NET relative classes,
1) Downloading data using WebClient.
Here you download the data using webclient there is an async method so there must be a completed event for that.
2) Deserializing the object.
In the completed event we deserialize the object using JsonConvert class available as part of JSON .NET
Consider the last chunk of code. That’s used to display cover photo of relative page. How will we display the image from an external Url? Since ImageSource property of ImageBrush allows us to pass an external image Url so we’ll simply instantiate a ImageBrush object and assign that as stack panel’s background. Let's execute the app and call the Graph API end point to retrieve details for Microsoft Pakistan's Facebook,
Comments
Anonymous
June 13, 2013
Zabardast....Anonymous
June 21, 2013
I'd recommend using the HttpClient APIs which we recently released for Windows Phone. They provide a nicer, async way of making HTTP requests. For example, you don't need to split your code into a separate callback, you simply use the C# await keyword. See this blog post for more info: blogs.msdn.com/.../get-httpclient-rtm-200-ok.aspxAnonymous
June 23, 2013
Daniel, Thanks.Anonymous
July 26, 2013
where can i find code for this example?Anonymous
July 29, 2013
Bilal Azhar, the code is posted.Anonymous
November 05, 2013
There's typo in the graph.facebook.coom/msftpk .. One o-letter too much. Thanks for the article!Anonymous
November 10, 2013
Thanks Tonis, its fixed. :)Anonymous
December 17, 2013
The comment has been removedAnonymous
January 28, 2014
"Thanks Tonis, its fixed. :)" Actually, its not :P Nice Tutorial, thx for working this out!Anonymous
June 10, 2014
How can one scroll through images from url page by page loading an image after the other?Anonymous
February 18, 2015
it is showing RootObject can not be found...:(Anonymous
August 15, 2015
Good Example showingAnonymous
September 19, 2015
Can you make this Example in WIndows 8.1 Plz.