UITableViewController-单元格大小分隔符和backgroundcolor

Question

I'm trying to achieve airbnb look for my UITableViewController.

1. separators are not in the full width of the screen
2. each cell has a unique size and background color

I've managed to tackle #2 using static table and setting each cell size in IB but have the following problems:

1. setting a background color in IB didn't take (changed both background color as well as tint)
2. I wish to "delete" a cell programmatically when it has no content but the only function that returns cell height - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath is generic for all cells and is called prior to populating the cells with data, so at this method I can't decide if the cell should be deleted or not.

Answer 1

I think you should use the delegate method willDisplayCell: forRowAtIndexPath: of the table view. This delegate method is called just before the cell is ready to be displayed on the table view. In this delegate you will have the cell created, if you need some modifications you can do here, which will be reflected just before the cell is displayed.

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    [cell setBackgroundColor:[UIColor redColor]];
    // and all other cell customizations 
}

Answer 2

1. You could set separatorInset and layoutMargins properties of table view before layout subviews and cell's separatorInset and layoutMargins properties before displaying cell.

2. For setting custom cell's height you may get needed cell by calling a table view data source method instead of call cellForRowAtIndexPath: method of table view.

Example:

// 1. Make full width separators:
- (void)viewWillLayoutSubviews {
    if ([self.tableView respondsToSelector:@selector(setSeparatorInset:)]) {
        [self.tableView setSeparatorInset:UIEdgeInsetsZero];
    }
    if ([self.tableView respondsToSelector:@selector(setLayoutMargins:)]) {
        [self.tableView setLayoutMargins:UIEdgeInsetsZero];
    }
}

#pragma mark - Table view delegate

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    if ([cell respondsToSelector:@selector(setSeparatorInset:)]) {
        [cell setSeparatorInset:UIEdgeInsetsZero];
    }

    if ([cell respondsToSelector:@selector(setLayoutMargins:)]) {
        [cell setLayoutMargins:UIEdgeInsetsZero];
    }
}

#pragma mark - Table view data source
// 2.Customize cells background color and height
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *cellIdentifier = [NSString stringWithFormat:@"s%ld-r%ld", indexPath.section, indexPath.row];
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier];

    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:cellIdentifier];
    }

    if (indexPath.row % 2) {
        cell.backgroundColor = [UIColor redColor];
        cell.contentView.backgroundColor = [UIColor whiteColor];
        cell.textLabel.text = cellIdentifier;
    } else {
        cell.backgroundColor = [UIColor cyanColor];
        cell.contentView.backgroundColor = [UIColor whiteColor];//background color of contentView overlaps cell's background color
    }

    return cell;
}


- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

    UITableViewCell *cell = [self tableView:tableView cellForRowAtIndexPath:indexPath]; //getting cell at indexPath
    if ([self isCellEmpty:cell]) {
        return 22;
    }
    return 44;
}

- (BOOL)isCellEmpty:(UITableViewCell *)cell {
    return !cell.textLabel.text.length; //Place your code for checking cell's content
}