iOS Programming: XCode5 Basic UITableView

Table View is one UI element in iOS apps to display a list of data like your mail boxes and emails. Table View allows you to present data in form of images.

This is a sample step to create iOS Apps with UITableViews

When you launched XCode IDE, create a new project for "Single View Application"

After click "Next" button please field in Options for your new project look like this:

Click "Next" again to continue and follow the step when you click "Create", as you confirm this, go to "MainStoryBoard"to create the user interface select TableView and drag it to ViewController.

and "Run" the project in simulator to check some errors.

In MainStoryBoard on ViewController Control release both buttons and a pop-up shows both “dataSource” & “delegate”. Select “dataSource” to make a connection between the Table View and its data source. Repeat the above steps and make a connection with the delegate look like this:

Go back to the Project Navigator and select “ViewController.h”. Append “<UITableViewDelegate, UITableViewDataSource>” after “ViewController”. Your code should look like below:

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDataSource,UITableViewDelegate>

@end

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

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

{

NSArray *tableData;

}

In the “viewDidLoad” method, add the following code to initialise the “tableData” array. Initialise an array with a list of your data.

- (void)viewDidLoad

{

[super viewDidLoad];

tableData=[NSArray arrayWithObjects:@"Daydev",@"Bangkok University",@"Adways Labs Thailand", nil];

}

Create two new method in ViewController.m

-(NSInteger)tableView:(UITableView*)tableView

  numberOfRowsInSection:(NSInteger)section{

}

-(UITableViewCell *)tableView:(UITableView *)tableView 

  cellForRowAtIndexPath:(NSIndexPath *)indexPath{

}

Let’s add the below code. The “count” method simply returns the number of items in the “tableData” array.

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

return [tableData count];

}

and

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

static NSString *simpleTableIdentifier =@"Item";

UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:simpleTableIdentifier];

if(cell == nil){

cell =[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:simpleTableIdentifier];

}

cell.textLabel.text = [tableData objectAtIndex:indexPath.row];

return cell;

}

Insert Prototype Cells in MainStoryBoard

Click in Prototype Cell and identifier name "item"

Finally, to run your app. Hit the “Run” button and let the Simulator load your app look like this:

This tutorial in Thai: XCcode UITableView, iOS Developer Thailand