UITableView with Custom Cell and Separator. Alpha value changes on scroll

Question

I have a UITableView with a Custom Cell. Some custom cells are being loaded with an image. And I'm adding a custom separator for the cells that have an image. The problem arises on scrolling. Whenever I scroll, the UIView opacity changes.

Here is my code :

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

static NSString *CellIdentifier = @"Cell";
CustomCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if(cell == nil){
    NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:@"CustomCell" owner:self options:nil];
    cell = [topLevelObjects objectAtIndex:0];
}  

if (cell && (NSNull*) imageString != [NSNull null])
{
    UIView* separatorLineView; = [[UIView alloc] initWithFrame:CGRectMake(0, -1, 320, 5)];
    separatorLineView.backgroundColor = [UIColor blackColor];
    separatorLineView.alpha = 0.2;
    [cell.contentView addSubview:separatorLineView];
}  

Alpha for the view given is 0.2 and on scrolling it becomes thicker and thicker. How can I solve this issue?

Answer 1

Do what @rmaddy and @rdelmar have suggested but since you're using a custom cell anyways, the quickest way, imho, would be:

1. Add this line to the cell's contentView via the Interface Builder directly
   • @property (strong, nonatomic) IBOutlet UIView *vwLine;
     • also @synthesize vwLine;
   • Set it's frame, background color & alpha value (obviously)
   • Set it's hidden property to YES
2. When you do the imageString != [NSNull null] check
   • if TRUE then [cell.vwLine setHidden:NO];

Example:

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

    if(cell == nil) {
        NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:@"CustomCell"
                                                                 owner:self
                                                               options:nil];
        cell = [topLevelObjects objectAtIndex:0];
    }  

    if (imageString != [NSNull null]) {
        [cell.vwLine setHidden:NO];
    }
} 

Answer 2

I think the problem is that you're adding a separatorLineView to cells that already have one as you scroll, so what you're seeing is lines on top of other lines. You could fix that by adding a tag to your line view, and checking if the cell has a subview with that tag, and if so, don't add another line.

Answer 3

In your code might be problem of reusability of cell. So try with following code:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    . 
    .
    .
    .
    if(cell == nil)
    {
       NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:@"CustomCell" owner:self options:nil];
       cell = [topLevelObjects objectAtIndex:0];

      if(cellHasImage == YES)
      {
         //// just initialize UIView and add as addSubview of cell.contentView
         UIView* separatorLineView; = [[UIView alloc] init];
         separatorLineView.frame = CGRectMake(0, -1, 320, 5);
         separatorLineView.tag = 111; // set whatever you like
         [cell.contentView addSubview:separatorLineView];
      }
    }
    .
    .
    .
    /// get UIView base on it's tag
    if(cellHasImage == YES)
    { 
       UIView* separatorLineView; = (UIView *) [cell.contentView viewWithTag:111];
       separatorLineView.backgroundColor = [UIColor blackColor];
       separatorLineView.alpha = 0.2;
     }

    .
    .
    .

    return cell;
}