Using multiple cell style types and custom cells in a UITableView

Question

I'm having problems figuring out how to display different cell styles as well as custom cells together within a UITableView. I understand how to set up and put cells together and the construction of a basic UITableView, but just not how to "mix and match" cell within one.

The best example I can show you on what I am trying to achieve is with the Tweetie 2 application.

The top of the segment there is a block paragraph, then below it there UITableViewCell's with the UITableViewCellStyleValue2 style set. How exactly would I go about achieving this effect?

Thanks ahead of time

Answer 1

The main layout is a grouped table. Each cluster of cells is a table section. The top most cell is set with a transparent background.

The key to making this work is to have a logical structure in the tableview delegate that understands which cell layout goes in which section and which row. A switch statement is usually easiest although you can also use arrays or dictionaries configure to reflect the layout.

So, in tableView:cellForRowAtIndexPath: you would 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, the tableview is being used less as a logical table (which displays repeating units of list structured data) and more as convenient mechanism for managing a layout. The logic managing the tableview has to be more complex and reflect the needs of the layout.

Answer 2

The most direct approach would be 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 how many cells you are rendering and how many cell styles you've got, you may need to re-use cells in which case you should use a different cell identifier for each style of cell.

Answer 3

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