UITableView separator strange behavior

Question

I have a plain style table, with multiple sections.

Symptoms: when the table is first loaded, each cell has it's separator as normal, except the last cell in each section (that is "before" a header). However, when there is scrolling, on some cells the separator appears. Also, if a cell is selected, then deselected, the separator appears.

Printing the view hierarchy shows, that on clean start, the separator view of the last cell in each section is hidden, so I would assume that would be the normal behavior:

<_UITableViewCellSeparatorView: 0x145b1990; 
    frame = (0 47.5; 320 0.5); 
    hidden = YES; 
    layer = <CALayer: 0x145b2950>>

On scrolling sometimes; and by selecting the cell; this hidden property gets removed, and so the separator appears.

First assumption was I was doing something wrong; but this happens with the most basic hello world application too:

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.tableView reloadData];
}

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

- (NSInteger)tableView:(UITableView *)tableView 
    numberOfRowsInSection:(NSInteger)section {
    return 2;
}

- (NSString *)tableView:(UITableView *)tableView 
    titleForHeaderInSection:(NSInteger)section {
    return @"test";
}

- (UITableViewCell *)tableView:(UITableView *)tableView 
    cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *reuseIdentifier = @"TestCell";
    UITableViewCell *cell = [tableView 
        dequeueReusableCellWithIdentifier:reuseIdentifier];
    return cell;
}

Screens (left: after start; right: after selecting a cell):

Is this a bug on Apple's side, or am I missing something? Also, for example, in the iOS Contacts application the separator is never hidden above a section header...

**Update: **

Was able to reproduce this in stock Music app: e.g. Songs tab, no spearator. Select then deselect first cell of any section; separator appears.

Extra info: iOS 7.1

Answer 1

Since this is an iOS 7.1 bug, as a workaround I would suggest hiding the built-in separator and showing one of your own at the bottom of each cell.

Hiding the built-in separator:

[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];

Showing a custom separator:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *reuseIdentifier = @"TestCell";
    XXYourCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseIdentifier];
    cell.customSeparatorView.hidden = (indexPath.row == ([self numberOfRowsInSection:indexPath.section] - 1));
    return cell;
}

Answer 2

On my case, it was the Clip To Bounds on the custom UITableViewCell. Accidentally deselected it from the storyboard. Then again setting Clip To Bounds to true resolve this issue.

Answer 3

As it occurs iOS 7 onwards, I suggest following tricky steps which works fine to avoid this scenario.

Hide tableView's default cell separator as :

    [self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];

Add custom view to your custom cell as :

CustomCell.h
@property (nonatomic,strong) UIView* cellSeperatorView;

CustomCell.m
@synthesize cellSeperatorView;


-(UIView *)cellSeperatorView{
      if (!cellSeperatorView) {
          self.cellSeperatorView = [[UIView alloc]    initWithFrame:CGRectZero];
        [self.cellSeperatorView setBackgroundColor:[UIColor lightGrayColor]];
         [self addSubview:self.cellSeperatorView];
      }
      return cellSeperatorView;
 }

-(void)prepareForReuse{

     self.cellSeperatorView = nil;

 }

-(void)layoutSubviews{
    [super layoutSubviews];
    [self.cellSeperatorView setFrame:CGRectMake(0, 100, self.width, 1)];
}

Answer 4

I had this issue in a somewhat different situation though, my cells are in editing mode but it shouldn't matter. In my case I didn't want the bottom _UITableViewCellSeparatorView showing after selecting a cell so after looking through the subviews of the cell NSLog(@"%@", [cell.subviews[0] subviews]); I seen

(
    "<_UITableViewCellSeparatorView: 0x9df7f30; frame = (0 99; 280 1); layer = <CALayer: 0x9dfb800>>",
    "<UITableViewCellContentView: 0x9d65950; frame = (38 0; 242 99.5); opaque = NO; gestureRecognizers = <NSArray: 0x9d2e0d0>; layer = <CALayer: 0x9de8290>>",
    "<_UITableViewCellSeparatorView: 0x9dfab90; frame = (0 99.5; 280 0.5); layer = <CALayer: 0x9dfb7d0>>",
    "<UITableViewCellEditControl: 0x9df3f60; frame = (0 0; 47 100); opaque = NO; userInteractionEnabled = NO; layer = <CALayer: 0x9d91370>>",
    "<UIView: 0x9df4470; frame = (0 98; 280 3); layer = <CALayer: 0x9df44d0>>",
    "<UIView: 0x9d35f10; frame = (0 98; 280 3); layer = <CALayer: 0x9d39e20>>"
)

which made it easier to find and get rid of the annoying separator views by using this

[[[cell.subviews[0] subviews] objectAtIndex:2] setBackgroundColor:[UIColor clearColor]];

For some reason I don't have an issue with the top separator view, most likely because my header in each section has a dark background color that hides the separator view but if you wanted to cover them up you could probably add this code

[[[cell.subviews[0] subviews] firstObject] setBackgroundColor:[UIColor clearColor]];

Note that I put this code within my didHighlightRowAtIndexPath delegate. In addition, my cells selectionStyle is set to default. Hope this helps someone out there!