Get to the point: Tab Bar Application – Adding an UITableView to a Navigation Controller

1- Open the previous tutorial sources (Tab Bar Application – Navigation Controller Embedded).

2- Edit the NavigationContentsViewController.h file. Change the source code so it looks like this:

#import <UIKit/UIKit.h>

@interface NavigationContentsViewController : UIViewController <UITableViewDelegate, UITableViewDataSource> {

NSMutableArray *itemsList;

UITableView *myTableView;

}

@property(nonatomic,retain)NSMutableArray *itemsList;

@property(nonatomic,retain)UITableView *myTableView;

@end

Notice the <UITableViewDelegate, UITableViewDataSource> protocols we’ve added.

3- Edit the NavigationContnensViewController.m file and add the following code after the @implementation line:

@synthesize itemsList;
@synthesize myTableView;

4- Add the TableView functions to the NavigationContnensViewController.m file.

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

return [itemsList count];

}

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

static NSString *CellIdentifier = @"Cell";

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

}

// Set up the cell...

NSString *cellValue = [itemsList objectAtIndex:indexPath.row];

cell.textLabel.text = cellValue;

return cell;

}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

NSString *selectedCellItem = [NSString stringWithFormat:@"%d", indexPath.row];

TableViewController *fvController = [[TableViewController alloc] initWithNibName:@"TableViewController" bundle:[NSBundle mainBundle]];

fvController.selectedCellItem = selectedCellItem;

[self.navigationController pushViewController:fvController animated:YES];

[fvController release];

fvController = nil;

}

5- Add these lines of code below the previous added code.

-(void)loadView{

myTableView = [[UITableView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame] style:UITableViewStylePlain];

myTableView.delegate = self;

myTableView.dataSource = self;

myTableView.autoresizesSubviews = YES;

itemsList = [[NSMutableArray alloc] init];

[itemsList addObject:@"Item1"];

[itemsList addObject:@"Item2"];

self.navigationItem.title = @"Test List";

self.view = myTableView;

}

6- Remember to release the itemsList array. Do so by adding [itemsList release]; to the dealloc function.

7- We will need a View Controller so go ahead and create it (File->New File ->Cocoa Touch Class->UIViewController subclass) and name it TableViewController (Figure 1). Make sure the “With XIB for user interface” option is marked.

8- Open the TableViewController.h file and change the source code so it looks like this:

#import <UIKit/UIKit.h>

@interface TableViewController : UIViewController {

NSString *selectedCellItem;

}

@property (nonatomic, retain) NSString *selectedCellItem;

@end

9- Now open the TableViewController.m file and add this line of code below the @implementation:

@synthesize selectedCellItem;

10- Uncomment the viewDidLoad function and add these lines of code:

self.navigationItem.title = @"Selected Item";

CGRect frame = CGRectMake(0, 0, 320, 180);

self.view = [[UIView alloc] initWithFrame:frame];

self.view.backgroundColor = [UIColor whiteColor];

frame = CGRectMake(100, 20, 100, 50);

UILabel *label = [[UILabel alloc] initWithFrame:frame];

label.text = selectedCellItem;

[self.view addSubview:label];

[label release];

[super viewDidLoad];

11- Go back to the NavigationContentsViewController.m file and add this code below the #import “NavigationContentsViewController.h”:

#import "TableViewController.h"

12- That’s it, if you have followed all the previous steps, your project should compile & run without errors.

Download the sources of this tutorial by clicking here.