Change color of inset area in UITableView separator

Question

I have a customized UITableView, the cells have a different background color (set in a custom backgroundView). However, the background color is only applied within the cell, but not extended to the inset area of the separator. As you can see in the screenshot, there is a white area to the left of the colored separator.

How can we change the color of this white line? We would like to make the line "disappear" by setting it to the same color as the cell background. Thanks!

Answer 1

Setting the cell's background colour to the same as the contentView's background colour seems to give the best results.

cell.backgroundColor = cell.contentView.backgroundColor;

That will handle cases where the accessoryView is the wrong colour as well.

Answer 2

So I just had this problem myself, and it's strange because it seems to work fine on some tableviews. I'm assuming that the grey color you are using is the background color of your tableview. If not, this solution may not work.

It seems like cells in iOS 7 don't always pick up the tableview background color when a separator inset is present, so you need to manually set the cell background to clearColor. Interestingly, setting this value in storyboards didn't work for me, I had to do it in code. Add this:

cell.backgroundColor = [UIColor clearColor];

when you configure the cell in this delegate function:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

Answer 3

It's the default in iOS 7. But you can change it to the way iOS 6 looks. Please try my code below. You will be amazed:

    tableView.separatorColor = [UIColor colorWithRed:red green:green blue:blue alpha:1.0];
    NSString *iosversion = [[UIDevice currentDevice] systemVersion];
    int version = [iosversion intValue];
    if(version>6)
    {
        tableView.separatorInset = UIEdgeInsetsZero;
    }

Swift 3+:

tableView.separatorInset = UIEdgeInsets.zero

Answer 4

Use image for separator. This the only easy way to acechive your expected result. For ios 7 in xib we have edge insect property is there you can use.

Answer 5

Go to storyboard > Attribute Inspector > Separator Insets, then select cutom and change left coordinate from 15 to 0. it will be Done.

Answer 6

In Interface builder on the UITableViewCell set the attribute 'background' to be clear (or whatever) and then on the Content View set the attribute 'background' to be clear as well and the problem should go away.

Answer 7

This is the only method that worked for me... (separator = None via storyboard)

Answer 8

I had similar issue and below code worked like charm. [self.tableView reloadData]

reload tableview on didSelectRowAtIndexPath Method.

• (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { [self.tableView reloadData] }

only this fixed my issue.