How to retrieve images from Facebook Graph API in android - xamarin

Question

I have retrieved json data from facebook graph api requesting GET from
https://graph.facebook.com/YOUR_PAGE_ID/albums?fields=name,photos{picture}&access_token=YOUR_ACCESS_TOKEN/
Json data is as follows:
{
"data": [
{
"name": "School Kids",
"photos": {
"data": [
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/s130x130/15267641_1789056354665765_6384898034258459703_n.jpg?oh=44daa7be0ac1878e769bc16df444bd0a&oe=58B29329",
"id": "1789056354665765"
},
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/s130x130/15356660_1789056361332431_834718824553815513_n.jpg?oh=69b3f1b1697808b87eed1e3053a67aaf&oe=58B735FB",
"id": "1789056361332431"
},
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/s130x130/15356635_1789056401332427_1231396155404307815_n.jpg?oh=3de32d320ac6762adc0dbf8b1ef64e0e&oe=58F69648",
"id": "1789056401332427"
},
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/s130x130/15380574_1789337074637693_1697389498501034556_n.jpg?oh=ddd57d119882b47172af689abde20cfb&oe=58F15477",
"id": "1789337074637693"
}
],
"paging": {
"cursors": {
"before": "MTc4OTA1NjM1NDY2NTc2NQZDZD",
"after": "MTc4OTMzNzA3NDYzNzY5MwZDZD"
}
}
},
"id": "1789056284665772"
},
{
"name": "Cover Photos",
"photos": {
"data": [
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/s130x130/14519945_1762073987364002_4539899568406717011_n.jpg?oh=fc8c02e9ced0839eea22d08859b964d0&oe=58BC80D4",
"id": "1762073987364002"
}
],
"paging": {
"cursors": {
"before": "MTc2MjA3Mzk4NzM2NDAwMgZDZD",
"after": "MTc2MjA3Mzk4NzM2NDAwMgZDZD"
}
}
},
"id": "1762074137363987"
},
{
"name": "Profile Pictures",
"photos": {
"data": [
{
"picture": "https://scontent.xx.fbcdn.net/v/t1.0-0/p130x130/14495327_1762072887364112_1611299743258720903_n.jpg?oh=ae87944069fd154e817468a38d9cb4a1&oe=58AE8D02",
"id": "1762072887364112"
}
],
"paging": {
"cursors": {
"before": "MTc2MjA3Mjg4NzM2NDExMgZDZD",
"after": "MTc2MjA3Mjg4NzM2NDExMgZDZD"
}
}
},
"id": "1762072884030779"
}
],
"paging": {
"cursors": {
"before": "MTc4OTA1NjI4NDY2NTc3MgZDZD",
"after": "MTc2MjA3Mjg4NDAzMDc3OQZDZD"
}
}
}
What I want from these data is to get image and album name and display in GridView in android.
My attempt parsing these data is as json object from this method
public async void downloadJsonFeedAsync(string url) {
var httpClient = new HttpClient();
Task < string > contentsTask = httpClient.GetStringAsync(url);
// await! control returns to the caller and the task continues to run on another thread
string content = await contentsTask;
Console.Out.WriteLine("Response Body: \r\n {0}", content);
//Convert string to JSON object
mObject = Newtonsoft.Json.JsonConvert.DeserializeObject < ImageGridItemRootObject > (content);
//Update listview
Activity.RunOnUiThread(() => {
mGridView.Adapter = new PhotoGalleryGridViewAdapter(this.Activity, Resource.Layout.PhotoGalleryGridItemView, mObject.data);
mProgressBar.Visibility = ViewStates.Gone;
});
}
// root object
public class ImageGridItemRootObject
{
public string name { get; set; }
public string photos { get; set; }
public List<ImageGridItem> data { get; set; }
}
//ImageGridItem
public class ImageGridItem
{
private string picture;
private string id;
public ImageGridItem():base()
{
}
public string Picture
{
get { return picture; }
set { picture = value; }
}
public string Id
{
get { return id; }
set { id = value; }
}
}
The problem is I get Picture Null. I wonder which is jSon Object and which is jSon Array so that I can format rootObject in-order to retrieve jSon Array .
Thank you in advance.

Answer 1

If you take the returned JSON and use Edit > Paste Special > Paste JSON as classes in Visual Studio you get the following classes:
public class Rootobject
{
public Datum[] data { get; set; }
public Paging paging { get; set; }
}
public class Paging
{
public Cursors cursors { get; set; }
}
public class Cursors
{
public string before { get; set; }
public string after { get; set; }
}
public class Datum
{
public string name { get; set; }
public Photos photos { get; set; }
public string id { get; set; }
}
public class Photos
{
public Datum1[] data { get; set; }
public Paging1 paging { get; set; }
}
public class Paging1
{
public Cursors1 cursors { get; set; }
}
public class Cursors1
{
public string before { get; set; }
public string after { get; set; }
}
public class Datum1
{
public string picture { get; set; }
public string id { get; set; }
}
It looks like your classes are not matching the JSON, which means the Deserializer does not know what to do with the key/values that do not match in your contract.
Adjust your classes to better match the classes above, and it will deserialize with the image urls.