Custom Table in IPhone

Introduction

In this article I will create a single-view application. Here I use a table in a view and customize its cell size using the UITabelViewCell class. For adding the UITableViewCell class we use the following procedure.

Select any one Objective-C class and right-click on it then choose new file -> select Objective-C class then click on next -> Choose subclass UITableViewCell from the drop down list and fill in whatever class name you want. If you want to use xib then you mark it then click on next -> select the location where you import this class to in the project.

In this article I use a table and its cell size is customized. When we click on the first row it doesn't take any action but when we only click on the second row it shows an image because I gave a condition on didselectrow at the index path method of the table.

To understand it we use the following procedure.

Step 1

Open XCode by double-clicking on it.

Step 2

Create a new XCode project by clicking on it.

Step 3

Now select Single View Application and click on Next.

Step 4

Now give your product a name. Here I use Customtable and for the Company Identifier net.mcnsolutions.www (a reversed domain name is usually used) and click on Next.

Step 5

Select the location where you want to save your project and click on Create.

Step 6 

Select the ViewController.Xib class and right-click on it.

Choose New File..

Step 7

Select Objective-C class.

Step 8

Select Subclass of UITableViewCell from the drop down list and give it the name Customcell, when we select the UITabelViewCell Xib option it is automatically disabled because when we use tableviewcell it will be created using code. 

Click on next.

Step 9

Now click on create. To import the class into the project.

Repeat the same steps to add a UIViewController class and assign the name ImageViewController to it.

Step 10

Now we code each class.

Appdelegate.h

#import <UIKit/UIKit.h>

@class ViewController;

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;
@property (strong, nonatomic) UINavigationController *nav;

@property (strong, nonatomic) ViewController *viewController;

@end

Appdelegate.m

#import "AppDelegate.h"

#import "ViewController.h"

@implementation AppDelegate
@synthesize nav;

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
// Override point for customization after application launch.
self.viewController = [[ViewController alloc] initWithNibName:@"ViewController" bundle:nil];
self.nav = [[UINavigationController alloc]initWithRootViewController:_viewController];
self.window.rootViewController = self.nav;
[self.window makeKeyAndVisible];
return YES;
}

@end

Viewcontroller.h

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController
{
IBOutlet UITableView *table;
NSMutableArray *array1,*array2;
}

@property (nonatomic,strong) UITableView *table;
@property(nonatomic,strong)NSMutableArray *array1,*array2;
@end

Viewcontroller.m

#import "ViewController.h"
#import "customcell.h"
#import "ImageViewController.h"

@interface ViewController ()

@end

@implementation ViewController
@synthesize table,array1,array2;

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
// Custom initialization
}
return self;
}

- (void)viewDidLoad
{
array1=[[NSMutableArray alloc]init];
[array1 addObject:@"Rahul"];
[array1 addObject:@"Sachin"];
[array1 addObject:@"Nikhil"];
array2=[[NSMutableArray alloc]init];
[array2 addObject:@"Jatti"];
[array2 addObject:@"Bhardwaj"];
[array2 addObject:@"Sharma"];
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{

// Return the number of sections.
return 1;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return 100;
}


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
// Return the number of rows in the section.
return [array1 count];

}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";
customcell *cell = [table dequeueReusableCellWithIdentifier:CellIdentifier];

if(cell==nil)
{
cell=[[customcell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}

cell.lbl1.text =[array1 objectAtIndex:indexPath.row];
cell.lbl2.text=[array2 objectAtIndex:indexPath.row];

return cell;
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
if(indexPath.row==1)
{
ImageViewController *image=[[ImageViewController alloc]init];
[self.navigationController pushViewController:image animated:YES];
}

}
@end
 

Viewcontroller.xib

Here we use a table from xib and connect it's delegate and datasource method to Fileowner.

Customcell.h

#import <UIKit/UIKit.h>

@interface customcell : UITableViewCell
{
IBOutlet UILabel *lbl1,*lbl2;
}
@property(nonatomic,strong) UILabel *lbl1,*lbl2;
@end

Customcell.m

#import "customcell.h"

@implementation customcell
@synthesize lbl1,lbl2;

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
lbl1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 20, 80, 30)];
lbl2=[[UILabel alloc]initWithFrame:CGRectMake(80, 20, 80,30)];
[self.contentView addSubview:lbl1];
[self.contentView addSubview:lbl2];
// Initialization code
}
return self;
}


- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
[super setSelected:selected animated:animated];


}

@end

Imageviewcontroller.Xib

Here we use an image from the Image inspector window but before that we import an image into the project we use it in.

For taking a simple imageview there is no need to code in the Imageviewcontroller.h or .m class.

Step 11

Now click on the run button to see the output.

Output

Output 1 in iPhone:

Output 2 in iPhone:

Output 3 in iPhone: