Outline view from UITableView

Question

Hi guys,

I need to implement a 1 level outline view out of UITableView. The cells which have children in them will have a '+' symbol and if user taps on it, the cells below it should slide down and the children cells of current selected row should appear. The sliding of cells should be visible and if the user taps '-' button of the already expanded row, the children cells should slide back into the parent.

I have tried googling but did not find any pointers.

How should I start, should I subclass UITableView? Or should I implement my own view sub-class and handle all the stuff there?

I somehow feel it would be easier to sub-class UITableView because it will handle all the row selection for us, but I cannot figure out how to do it.

Thanks and Regards, Raj

Answer 1

You must subclass and UITableViewCell

@interface OutlineCell : UITableViewCell

Then, in the ViewController of your table

- (UITableViewCell*) tableView: (UITableView*) tableView cellForRowAtIndexPath: (NSIndexPath*) indexPath {
    NSString* MyIdentifier = @"MyIdentifier";

    OutlineCell* cell = (OutlineCell*) [tableView dequeueReusableCellWithIdentifier: MyIdentifier];
    if (cell == nil) {
        cell = [[OutlineCell alloc] init];
    }

    // Populate cell data
}

You can define the interface via IB, creating an Empty XIB and dragging an UITableViewCell, with your custom OutlineCell class as File Owner. Then add buttons, labels and so on.

EDIT: if you want an inner table within a cell, try the same approach adding a subview to the UITableViewCell that you define, with a UITableView inside it.

Answer 2

Can't you maintain a dictionary as a datasource? dictionary holding array of dictionaries. And inner dictionary with two key value pairs:

1. isExpanded
2. children information.

By checking the bool isExpanded you will get the number of rows. And you need to customize the cell to add buttons. Will it work for you?

you can differentiate the children cells by pushing you cell contents slightly to right side.

Answer 3

Raj did you ever get this to work, if you did could you post a link to the project.