tableView implementation like on appStore

Question

Before

After

basically my point is I have customTableViewCell which has button on the right most (same as image1 "show version history"). When I clicked that I want to add a dynamic number of subviewCell which is under customTableViewCells.

my question is, how is this being implemented? is there any library that you can refer on this?

Answer 1

Have a look on these table view implementations

https://www.cocoacontrols.com/controls/jkexpandtableview

https://www.cocoacontrols.com/controls/sdnestedtable

https://www.cocoacontrols.com/controls/uiexpandabletableview

https://www.cocoacontrols.com/controls/ocborghettiview

Answer 2

I hope that You haven't search for it : Let's take a look on these links :

• UITableViewCell expand on click
• gitHub
• Expand / Collapse UITableViewCell with different cell and data source
• Expand collapse UITableViewCell
• GitHub
• Accordion table cell - How to dynamically expand/contract uitableviewcell?

Answer 3

That's very easy.

• You want to track if the section is expanded. Use a instance variable (or property) for this
• if it is not expanded you return 1 in tableView:numberOfRowsInSection: for the expandable section
• if it is expanded you return 1 + the number of expanded cells in t:numberOfRowsInSection:
• in tableView:didSelectRowAtIndexPath: you toggle the expansion state when the first cell is tapped and insert or delete the expanded rows.

e.g.:

@interface MBMasterViewController () {
    BOOL firstSectionExpanded;
}
@end

@implementation MBMasterViewController

#pragma mark - Table View

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 3;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    NSInteger count = 1;
    if (section == 0 && firstSectionExpanded) { count = 3; }
    return count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
    if (indexPath.row == 0) {
        cell.textLabel.text = [NSString stringWithFormat:@"Section %ld", (long)indexPath.section];
    }
    else {
        cell.textLabel.text = [NSString stringWithFormat:@"Sub Cell %ld", (long)indexPath.row];
    }
    return cell;
}

- (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    if (indexPath.row != 0) {
        // don't select sub cells
        return nil;
    }
    return indexPath;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    NSArray *cells = @[ [NSIndexPath indexPathForRow:1 inSection:indexPath.section],
                        [NSIndexPath indexPathForRow:2 inSection:indexPath.section]];

    NSArray *cellsToDelete;
    NSArray *cellsToInsert;
    if (indexPath.section == 0) {
        if (firstSectionExpanded) {
            cellsToDelete = cells;
        }
        else {
            cellsToInsert = cells;
        }
        firstSectionExpanded = !firstSectionExpanded;
    }

    if (cellsToDelete) {
        [tableView deleteRowsAtIndexPaths:cellsToDelete withRowAnimation:UITableViewRowAnimationAutomatic];
    }
    if (cellsToInsert) {
        [tableView insertRowsAtIndexPaths:cellsToInsert withRowAnimation:UITableViewRowAnimationAutomatic];
    }
    [tableView deselectRowAtIndexPath:indexPath animated:YES];
}