Custom label background gets covered when cell is selected

Question

I'm having a weird problem with my cells when it gets highlighted.

Just to introduce you better what the problem is, take a look at these two pictures:

This is how the cell looks like when it's not selected (normal state): http://cl.ly/0n193u3U1o403x1s0m3z

This is how the cell looks when it's highlighted (during tap): http://cl.ly/1o2U400D3L0b3n3m1N1J

As you can see, the background of the second label seems to get ignored when the cell is selected. I don't want this to happen. I just want the 2nd label to stay there and remain as it is.

This is how I create the cells (there are several types each of them using different cell identifier).

if (cell == nil) {
    cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle
                                   reuseIdentifier:CellTableIdentifier] autorelease];
    cell.backgroundView = [[[UIView alloc] init] autorelease];
}

switch (indexPath.section) {
    ...
    ...
    case kTableSectionPending:


        UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(10, 10, self.tableView.frame.size.width - 20, 30.0)] autorelease];
        UILabel *label2 = [[[UILabel alloc] initWithFrame:CGRectMake(10, 50, self.tableView.frame.size.width - 20, 30.0)] autorelease];
        label.text = NSLocalizedString(@"IncompletePath", @"");
        label.font = [UIFont boldSystemFontOfSize:16];
        label.textAlignment = UITextAlignmentCenter;
        label.backgroundColor = [UIColor clearColor];
        label.layer.cornerRadius = 10;
        FFRoute *lastPoint = ((FFRoute *) [[[FFSQLite sharedSingleton] getRoutesFromItinerary:itinerary] lastObject]);
        label2.text = [NSString stringWithFormat:@"%@: %@", NSLocalizedString(@"LastPoint", @""), [self getStringFromTimestampOfFFRoute:lastPoint]];
        label2.font = [UIFont systemFontOfSize:15];
        label2.textAlignment = UITextAlignmentCenter;
        label2.textColor = [UIColor whiteColor];
        label2.backgroundColor = [UIColor colorWithRed:68/255.f green:82/255.f blue:124/255.f alpha:1];
        label2.layer.cornerRadius = 10;
        [label2 setOpaque:YES];
        [cell.contentView addSubview:label];
        [cell.contentView addSubview:label2];

        // Set up background color
        UIColor *bgcolor = [UIColor colorWithRed:250/255.f green:212/255.f blue:137/255.f alpha:1];
        cell.backgroundView.backgroundColor = bgcolor;            
        break;
}

I tried to set to true the Opaque property with no luck.

What am I missing? Thank you

Answer 1

In iOS 6, you can use 2 methods in UITableViewDelegate to customise highlighting for the cell, and also its subviews:

- (void)tableView:(UITableView *)tableView didHighlightRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    [cell setBackgroundColor:[UIColor lightGrayColor]];  // Your highlight color
    // Make changes to subviews in cell
}

- (void)tableView:(UITableView *)tableView didUnhighlightRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    [UIView animateWithDuration:0.5f animations:^{
        [cell setBackgroundColor:[UIColor whiteColor]];  // Your unhighlight
        // Revert back changes for subviews
    }];
}

Answer 2

When you create the cell, do:

cell.selectionStyle = UITableViewCellSelectionStyleNone;

A cell can be highlighted, selected or both. You might want to customize your drawing so that it draws in a selected state (but draws as usual when only in highlighted state).