How to customize tableView separator in iPhone

Question

By default there is a single line separator in uitableview.

But I want to put my customized line as a separator.

Is it possible? How?

Answer 1

Swift version:

private let kSeparatorTag = 123
private let kSeparatorHeight: CGFloat = 1.5

func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath)
{
    if cell.viewWithTag(kSeparatorTag) == nil //add separator only once
    {
        let separatorView = UIView(frame: CGRectMake(0, cell.frame.height - kSeparatorHeight, cell.frame.width, kSeparatorHeight))
        separatorView.tag = kSeparatorId
        separatorView.backgroundColor = UIColor.redColor()
        separatorView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]

        cell.addSubview(separatorView)
    }
}

Answer 2

You add the following code cellForRowAtIndexPath delegate of tableView to create a custom image view of 1px height and 200px width for everyCell

UIView *lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 200, self.view.bounds.size.width, 1)];
lineView.backgroundColor = [UIColor blackColor];
[cell.contentView addSubview:lineView];

Note: i dont know how heavy it is on the performance.

Answer 3

If you use a customized UITableViewCell, You can simply add UIView on the bottom of the UItableViewCell.xib and put the background colour as the colour you want.

For example, on xib I add a UIView on the bottom and set the height as 1. Using autolayout, I set left constraint to 12, bottom constraint to 0, right constraint to 0 and height to 1.

Answer 4

These answers result in the highlight rect being overwritten by the separator you add to your cell (on iOS 6 with my testing at least). You need to set the separatorColor to [UIColor clearColor] so that cells are still separated by 1px, you can then draw your separator in the gap:

- (void)viewDidLoad {
    self.tableView.separatorColor = [UIColor clearColor];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    // snip
    CALayer *separator = [CALayer layer];
    separator.backgroundColor = [UIColor redColor].CGColor;
    separator.frame = CGRectMake(0, 43, self.view.frame.size.width, 1);
    [cell.layer addSublayer:separator];
    return cell;
}

Answer 5

I dont know if this can be done "automatically" with some setting. But a suggestion would be to set the line separator as none, and in the borders of your cells actually draw your line separator that you want..

Answer 6

If you want to do more than change the color of the separator using the separatorColor property of the UITableView then you could set the separatorStyle property to UITableViewCellSeparatorStyleNone and then either:

• create custom UITableViewCells that include your custom seperator within them
• create alternate [UITableViewCell][6]s that include your custom separator

For example, if your table currently displays 5 rows you could update it to display 9 rows and the rows at index 1, 3, 5, 7 would be separator cells.