iOS 8 UITableViewCell extra broken separators

Question

OK, I don't know what's up with iOS 8 but when I run my app on it, I see these extra UITableViewSeparatorViews:

Update

I used the Xcode 6 View Debugger and I see that in this problematic UITableView, I see these extra views being added as a subview of my UITableViewCellContentView

_UITableViewCellSeparatorView

Why does iOS 8 add these random subviews to my cell's contentView ?

As you can see from the screenshot, those extra lines are the ones that doesn't reach the edge of the screen.

In my view controller, I am using the following code to make the lines go all the way to the edge of the screen:

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    cell.contentView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

    if ([tableView respondsToSelector:@selector(setSeparatorInset:)]) {
        [tableView setSeparatorInset:UIEdgeInsetsZero];
    }

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

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

In my custom cell class, I am setting:

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        // Initialization code

        _reuseID = reuseIdentifier;
        self.selectionStyle = UITableViewCellSelectionStyleNone;
        self.contentView.backgroundColor = [[BSGThemeManager sharedTheme] clearColor];

        self.contentView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

        self.containerView = [[UIView alloc] init];

        _photo = [[BSGUserPhotoView alloc] init];
        [_photo clipPhotoToRadius:37.5];
        //_photo.layer.cornerRadius = 37.5 / 2.0;
        //_photo.layer.borderColor = [[BSGThemeManager sharedTheme] photoBorderColor];
        //_photo.layer.borderWidth = [[BSGThemeManager sharedTheme] photoBorderWidth];
        //_photo.clipsToBounds = YES;

        self.photo.alpha = 0;

        _message = [[UILabel alloc] init];
        _message.backgroundColor = [[BSGThemeManager sharedTheme] clearColor];
        _message.numberOfLines = 0;
        _message.lineBreakMode = NSLineBreakByWordWrapping;
        _message.font = [[BSGThemeManager sharedTheme] varelaRoundFontWithSize:15];

        self.message.alpha = 0;

        _time = [[UILabel alloc] init];
        _time.textAlignment = NSTextAlignmentRight;
        _time.font = [[BSGThemeManager sharedTheme] helveticaNeueFontWithSize:16];
        _time.textColor = [[BSGThemeManager sharedTheme] postTimeColor];
        [_time setContentCompressionResistancePriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisHorizontal];
        [_time setContentHuggingPriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisHorizontal];

        self.time.alpha = 0;

        [self.containerView addSubview:_photo];
        [self.containerView addSubview:_message];
        [self.containerView addSubview:_time];

        [self.contentView addSubview:self.containerView];

        [self addAllConstraints];
    }
    return self;
}

I'm not sure if this line was the cause of it:

self.contentView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

My Autolayout code for my cell is:

-(void)addAllConstraints
{
    self.containerView.translatesAutoresizingMaskIntoConstraints = NO;
    self.photo.translatesAutoresizingMaskIntoConstraints = NO;
    self.message.translatesAutoresizingMaskIntoConstraints = NO;
    self.time.translatesAutoresizingMaskIntoConstraints = NO;

    id views = @{
                 @"containerView": self.containerView,
                 @"photo": self.photo,
                 @"message": self.message,
                 @"time": self.time
                 };

    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[containerView]|" options:0 metrics:nil views:views]];
    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[containerView]|" options:0 metrics:nil views:views]];


    // --------------------------------------------------
    // Horizontal Constraints
    // --------------------------------------------------

    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[photo(37.5)]-15-[message(195)]" options:0 metrics:nil views:views]];

    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[time]-10-|" options:0 metrics:nil views:views]];

    // --------------------------------------------------
    // Vertical Constraints
    // --------------------------------------------------

    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[photo(37.5)]" options:0 metrics:nil views:views]];

    [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.photo attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];

    [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.message attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.photo attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];

    [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:self.time attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.photo attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0.0]];
}

Anyone else came across this weird iOS 8 bug?

It doesn't show up on iOS 7.

Answer 1

For me, the dynamic height of the custom tableViewCells was causing an issue, to be specific, the heightForRowAtIndexPath and estimatedHeightForRowAtIndexPath delegate methods. One worked perfect for iOS 7 and the other for iOS 8. Solved it by conditionally checking for the iOS version.

Answer 2

I found an easy solution, when i overwrote the layoutSubviews method, i also called the super method as well, like so:

-(void)layoutSubviews {
[super layoutSubviews];
// rest of custom implementation code here
. . . 
}

Hope it helps

Answer 3

Lol....OK...I think I fixed this problem.

One of my subview is called "message" which is just a UILabel.

On my custom tableview cell's class, this code was causing the extra line to appear:

-(void)layoutSubviews
{
    self.message.preferredMaxLayoutWidth = self.bounds.size.width * 0.75;
}

After getting rid of it, the cells behaved how I liked it to like in iOS 7.

Answer 4

Change the highlighted to '0' then the it resolves. It was through XIB.