uitableview - custom images keep loading in cell.contentView

Question

In cellForRowAtIndexPath I am adding a UIImageView to cell.contentView. The problem is that when the cell scrolls off the screen and back on, it adds the same image again on top of the one that is already there. This happens continuously until I get a very stacked-up blurry image.

Do you have to keep removing any image views that you add to cell.contentView? If so, in what delegate method do you do that in?

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

    static NSString *CellIdentifier = @"CellIdentifier";

    MyTableCell *cell = (MyTableCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"MyTableCell" owner:self options:nil];
        cell = [nib objectAtIndex:0];
    }
    cell.selectionStyle = UITableViewCellSelectionStyleNone;

    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.jpg"]];

    imageView.center = CGPointMake(310, 48);
    [cell.contentView addSubview:imageView];
    [imageView release];
    return cell;
}

Answer 1

If you don't want to keep putting imageViews in your cell, you have to do all the customization inside the if(cell==nil) block, otherwise it will add one every time a cell recycles. When using cell recycling you always want to keep anything that is consistent for all of your cells in that block so that they only get added once.

Ex:

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

    static NSString *CellIdentifier = @"CellIdentifier";

    MyTableCell *cell = (MyTableCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"MyTableCell" owner:self options:nil];
        cell = [nib objectAtIndex:0];

        //Add custom objects to the cell in here!
        UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.jpg"]];

        imageView.center = CGPointMake(310, 48);
        [cell.contentView addSubview:imageView];
        [imageView release];
    }
    cell.selectionStyle = UITableViewCellSelectionStyleNone;


    return cell;
}

Answer 2

If each cell should need a different image, you can try something like this:

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

    static NSString *CellIdentifier = @"CellIdentifier";
    static const int ImageViewTag = 1234; //any integer constant

    MyTableCell *cell = (MyTableCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    UIImageView *imageView;
    if (cell == nil)
    {
        NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"MyTableCell" owner:self options:nil];
        cell = [nib objectAtIndex:0];

        //Add custom objects to the cell in here!
        imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0, imgWidth, imgHeight)];

        imageView.center = CGPointMake(310, 48);
        imageView.tag = ImageViewTag;
        [cell.contentView addSubview:imageView];
        [imageView release];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
    }
    else
    {
        imageView = [cell viewWithTag:ImageViewTag];
    }
    imageView.image = yourUIImageForThisCell;

    return cell;
}