iOS 7.1 UitableviewCell content overlaps with ones below

Matej Kosiarcik picture Matej Kosiarcik · Mar 12, 2014 · Viewed 29.9k times · Source

So I have code, which is sucessfully working on iOS 7.0 but not in 7.1. I have a simple tableview, with code:

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

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

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return 70.0;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];

    for (UIView *view in cell.contentView.subviews) {
        [view removeFromSuperview];
    }

    UILabel *label = [[UILabel alloc] init];
    label.text = [NSString string];

    for (NSInteger i = 0; i < 20; i++) {
        label.text = [label.text stringByAppendingString:@"label String "];
    }

    label.translatesAutoresizingMaskIntoConstraints = NO;
    label.numberOfLines = 0;
    label.lineBreakMode = NSLineBreakByWorldWrapping;
    //label.lineBreakMode = NSLineBreakByTruncatingTail; //I have tried this too
    [cell.contentView addSubview:label];

    NSDictionary *dict = NSDictionaryOfVariableBindings(label);
    [cell.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-8-[label]-8-|" options:0 metrics:nil views:dict]];
    [cell.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-8-[label]" options:0 metrics:nil views:dict]];

    if (indexPath.row == 0) {
        label.textColor = [UIColor colorWithRed:1.0 green:0 blue:0 alpha:1.0];
    }
    else if (indexPath.row == 1) {
        label.textColor = [UIColor colorWithRed:0 green:1.0 blue:0 alpha:1.0];
    }
    else if (indexPath.row == 2) {
        label.textColor = [UIColor colorWithRed:0 green:0 blue:1.0 alpha:1.0];
    }
    else {
        label.textColor = [UIColor colorWithWhite:0.3 alpha:1.0];
    }

    cell.backgroundColor = [UIColor colorWithWhite:1.0 alpha:1.0];
    return cell;
}

I have 1section with 10rows. With each row reused I delete all subviews from contentView(I tried alloc-init UITableViewCell, but came with the same results).

On iOS 7.0, UILabel is displayed only in cell it belongs to. But in 7.1 UILabel continues displaying over another cells. What is interresting, that when I click on cell, it stop being overlaping by anothers, but only till I click on cell above. My question is, how to make it work on 7.1devices like on 7.0ones.

I tried both simulator and device and I took a look at iOS 7.1 API Diffs, but found nothing related to this.

Maybe it is issue of Auto Layout, that i have variable height of UILabel, but I need to do so. I want to have all text in UILabel, but display only part of UILabel, that can be displayed in a cell, which is default behavior in 7.0, but 7.1 changes this and I don't why why and how to deal with it.

This is dropbox folder for images with detail explanation: Folder with images

Update: I tried things like tese, but nothing worked for me.

cell.frame = CGRectMake(0, 0, self.tableView.frame.size.width, 70);
cell.contentView.frame = CGRectMake(0, 0, self.tableView.frame.size.width, 70);

cell.opaque = NO;
cell.contentView.opaque = NO;

cell.clearsContextBeforeDrawing = NO;
cell.contentView.clearsContextBeforeDrawing = NO;

cell.clipsToBounds = NO;
cell.contentView.clipsToBounds = NO;

Answer

RyanJM picture RyanJM · Mar 12, 2014

The issue has to do with the height of your cell. It isn't going to dynamically adjust that for you.

You'll probably notice that as you scroll and the view above goes out of view the overlapping text will disappear with it.

If you are wanting your text to clip at a certain height, then you need to set the number of lines, rather than setting it to 0 since that will let it continue forever.

The lineBreakMode won't take effect since it isn't stopped.

Optionally you could try to set clipping on the contentView to make sure all subviews stay inside.

Depending on the end result you want, you could do dynamic heights and change based on the content. There are a bunch of SO questions related to doing this.

Update - clipping the contentView

I'd have to try it out myself, but in lieu of that, here are a couple links related to clipping the contentView:

Looks like this works:

cell.clipsToBounds = YES;