Web Service Apps in iOS7 JSON with UITableView in XCode5

This is my first iOS7 iPhone Developer in XCode5 with JSON Data and UITableView step-by-step to show, how to display json data on UITableView

[sorry for my poor english] 

First my JSON Data is something like that...

[
  {
   id: 844,
   title: "Post From Wordpress Title",
   permalink: "http://www.youweb.com/lillian-powers-vine/",
   content: "Some Content from Post on Wordpress",
   date: "2013-08-28 16:01:37",
   author: "Banyapon Poolsawasd",
   thumbnail: "http://www.youweb.com/wp-content/uploads/2013/08/image.png",
   categories: [
                    "Comedy",
                    "Feature",
                    "Lifestyles",
                    "Techonlogy"
                   ],
     tags: [
                    "Lillian Powers",
                    "Lillian Powers Vine",
                    "Vine"
              ]
  }
]

I used Wordpress CMS and install plug-in name "Feed JSON" to convert RSS Feed from my blog to a new type of feed you can subscribe to.
Example
http://example.com/feed/json or http://example.com/?feed=json to anywhere you get a JSON form.

Start!

First open Xcode5 and create New iPhone developer's Project in Single View Application and choose you project name

As you confirm, Xcode automatically creates the “JSONView” project based on the options you’ve provided. The resulting screen looks like this:

Goto MainStoryBoard from project solution tree on you left side and drag UITableView object, paste it on ViewController.

Press and hold the Control key on your keyboard, select the Table View and drag to the “File’s Owner”. Release both buttons and a popup shows both “dataSource” and “delegate”.

Insert one prototype cell on your UITableView

Next, select “ViewController.h” Append “<UITableViewDelegate, UITableViewDataSource>” after “UIViewController” and define an instance variable for holding the table data.

Chang this code below:

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
@end

to

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>
{
    IBOutlet UITableView *tableData;
}
@end

Next, select “ViewController.m” and define an instance variable for holding the table data.

@interface ViewController ()
{
    NSMutableArray *myObject;
    // A dictionary object
    NSDictionary *dictionary;
    // Define keys
    NSString *title;
    NSString *thumbnail;
    NSString *author;
}
@end

In the “viewDidLoad” method, add the following code to initialize the JSON data array.

- (void)viewDidLoad
{
    [super viewDidLoad];
 title = @"title";
    thumbnail = @"thumbnail";
    author = @"author";
 
    myObject = [[NSMutableArray alloc] init];
 
    NSData *jsonSource = [NSData dataWithContentsOfURL:
       [NSURL URLWithString:@"http://gooruism.com/feed/json"]];
 
    id jsonObjects = [NSJSONSerialization JSONObjectWithData:
       jsonSource options:NSJSONReadingMutableContainers error:nil];
 
    for (NSDictionary *dataDict in jsonObjects) {
        NSString *title_data = [dataDict objectForKey:@"title"];
        NSString *thumbnail_data = [dataDict objectForKey:@"thumbnail"];
        NSString *author_data = [dataDict objectForKey:@"author"];
 
        NSLog(@"TITLE: %@",title_data);
        NSLog(@"THUMBNAIL: %@",thumbnail_data);
        NSLog(@"AUTHOR: %@",author_data);
 
        dictionary = [NSDictionary dictionaryWithObjectsAndKeys:
                      title_data, title,
                      thumbnail_data, thumbnail,
                      author_data,author,
                      nil];
        [myObject addObject:dictionary];
    }
}

Add two datasource methods: “tableView:numberOfRowsInSection” and “tableView:cellForRowAtIndexPath”.

The first method is used to inform the table view how many rows are in the section. So let’s add the below code.

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return myObject.count;
}
 

And insert cellForRowAtIndexPath ( required methods).

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *CellIdentifier = @"Item";
 
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell=[[UITableViewCell alloc]initWithStyle:
        UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];
    }
 
 
    NSDictionary *tmpDict = [myObject objectAtIndex:indexPath.row];
 
    NSMutableString *text;
    //text = [NSString stringWithFormat:@"%@",[tmpDict objectForKey:title]];
    text = [NSMutableString stringWithFormat:@"%@",
           [tmpDict objectForKeyedSubscript:title]];
 
    NSMutableString *detail;
    detail = [NSMutableString stringWithFormat:@"Author: %@ ",
             [tmpDict objectForKey:author]];
 
    NSMutableString *images;
    images = [NSMutableString stringWithFormat:@"%@ ",
             [tmpDict objectForKey:thumbnail]];
 
    NSURL *url = [NSURL URLWithString:[tmpDict objectForKey:thumbnail]];
    NSData *data = [NSData dataWithContentsOfURL:url];
    UIImage *img = [[UIImage alloc]initWithData:data];
 
 
    cell.textLabel.text = text;
    cell.detailTextLabel.text= detail;
    cell.imageView.frame = CGRectMake(0, 0, 80, 70);
    cell.imageView.image =img;
 
    return cell;
}

Run your project and see the NSlog Console it's will show.

The JSON data will import to UITableView and you first iOS7 will complete!

From my iOS Dev in Thailand community : Daydev.com [All Tutorial in Thai]

Source Code available: http://www.daydev.com/source-code-web-service-ios7-uitableview