Using several types of cell types and custom cells in a UITableView

Question

I'm having trouble figuring out how to display different cell styles as well as custom cells together in a UITableView. I understand how to set up and arrange cells and create a basic UITableView, but just not how to “mix and match” a cell inside one.

The best example that I can show you about what I'm trying to achieve is with the Tweetie 2 app.

At the top of the segment is a paragraph of the block, and then below it is a UITableViewCell with a set of styles UITableViewCellStyleValue2. How exactly will I achieve this effect?

Thanks in advance

Answer 1

The main layout is a grouped table. Each cluster of cells represents a section of a table. The upper part of the cell is set by a transparent background.

The key to doing this work is having a logical structure in the tableview delegate that understands which cell layout goes in that section and in which row. The switch statement is usually the easiest, although you can also use arrays or dictionaries to customize the layout.

So in tableView:cellForRowAtIndexPath: you will have something like:

 switch (indexPath.section) { case 0: cell= //configure cell with transparent background break; case 1: if (indexPath.row==0) { cell = // configure cell for multiline }else { cell = // configure for UITableViewCellStyleValue2 } break; case 2: // .. and so on for each section and cell break; default: break; } 

In this layout, tableview is used less as a logical table (which displays repeating units of structured list data) and a more convenient layout control mechanism. The logic for managing the table view should be more complex and reflect the needs of the layout.

Answer 2

The most direct approach is to change your implementation of -tableView:cellForRowAtIndexPath: to use indexPath.section and indexPath.row to determine which type of cell to draw. For example:

 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { if (indexPath.section == 0) { if (indexPath.row == 0) { // return long text style cell } else { // return left/right label style cell } } else { // return the 4-way button style cell } } 

Depending on the number of cells displayed and the number of cell styles, you may need to reuse cells, in which case you must use a different cell identifier for each cell style.

Answer 3

This is an elegant way:

 -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ /* Call a function to create all custom cells. Send the tableview and the indexPath to this function. So, your code will be clean and easy to read an maintenance =D DON'T forget to change the height of each cell */ if (indexPath.row < 3) return [self createACustomCell1:tableView indexPath:indexPath]; else return [self createACustomCell2:tableView indexPath:indexPath]; } //************* // Create CUSTOM CELL 2 //************* -(UITableViewCell *)createACustomCell1:(UITableView *)anTableView indexPath:(NSIndexPath *)indexPath{ static NSString *CUSTOMCELL_1 = @"CUSTOMCELL_1"; CustomCell_1 *cell = [anTableView dequeueReusableCellWithIdentifier:CUSTOMCELL_1]; if (!cell){ [anTableView registerNib:[UINib nibWithNibName:CUSTOMCELL_1 bundle:nil] forCellReuseIdentifier:CUSTOMCELL_1]; cell = [anTableView dequeueReusableCellWithIdentifier:CUSTOMCELL_1]; } // Cell customization above return cell; } //************* // Create CUSTOM CELL 2 //************* -(UITableViewCell *)createACustomCell2:(UITableView *)anTableView indexPath:(NSIndexPath *)indexPath{ static NSString *CUSTOMCELL_2 = @"CUSTOMCELL_2"; CustomCell_2 *cell = [anTableView dequeueReusableCellWithIdentifier:CUSTOMCELL_2]; if (!cell){ [anTableView registerNib:[UINib nibWithNibName:CUSTOMCELL_2 bundle:nil] forCellReuseIdentifier:CUSTOMCELL_2]; cell = [anTableView dequeueReusableCellWithIdentifier:CUSTOMCELL_2]; } // Cell customization above return cell; } 

Answer 4

To get the same effect as a split Tweetie cell, create a custom cell and add Segmented Control and create title and detail labels