Creating UIImageView in Custom Cell leaves Artifacts from old image when using ScaleAspectFit

Question

I have a table with a CustomCell, when drawing the cell I create a UIImageView and add it as a Subview to a scrolView. The image also has it's contentMode set to UIViewContentModeScaleAspectFit. The problem is when the next Cell is drawn if the image is smaller than the previous image then the borders of the previous image will still be there.

The code is such;

  UIImageView *smallImgView = [[UIImageView alloc]initWithFrame:CGRectMake(picXCount,0, 216, 216)];
  smallImgView.image = nil;
  smallImgView.contentMode = UIViewContentModeScaleAspectFit;

I am now thinking that I should collect the dimensions from the image and set the CGRectMake to that size rather than using the contentMode but if there is an easy fix...

Setting the image to nil does not work and another idea is to load a blank image first (which is nasty). Any ideas would be appreciated.

EDIT

Here is the cell Method

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    cellID = @"Cell"
    newsItemCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID forIndexPath:indexPath];
    if (cell == nil)
    {
        cell = [[newsItemCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
    }
    for(int imgCount = 0; imgCount < [[newsExtraImages objectAtIndex:indexPath.row] count]; imgCount++)
    {
        UIImageView *smallImgView = [[UIImageView alloc]initWithFrame:CGRectMake(picXCount,0, 216, 216)];
        smallImgView.image = nil;
        smallImgView.contentMode = UIViewContentModeScaleAspectFit;
        [smallImgView setImage:[allImages objectAtIndex:[[[newsExtraImages objectAtIndex:indexPath.row] objectAtIndex:imgCount] intValue]]];

        picXCount = picXCount + 216 + 12;

        [cell.newsItemImages addSubview:smallImgView];
    }
    [cell.newsItemImages setContentSize:CGSizeMake(picXCount, 216)];

    return cell;
}

In short it checks a 3D array to see how many images there are in there for this cell, if there are 5 it creates the UIImageView 5 times each time adding them to the view. The next cell is the next list of images which may only have 3 in and so on.

The picXCount keeps track of where to plot the images horizontally in the Scroll View (newsItemImages). The Content is also set so it scrolls.

Answer 1

Can you provide the cellForRowAtIndexPath code. I have a suspicion that you add a new UIImageView over and over again above existing one every time you have to provide a cell for a different item. And when it turns out you get to reuse some cell you stack the UIImageViews on top of each other.

Answer 2

With guidence from Ivan I managed to do it, not sure it is the most ecinomical method but...

When an image added to a view I now add a Tag too. There is now a For loop which looks over the cell's Scroll View just before it is made which removes all subview which are not 0 (the default).

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    cellID = @"Cell"
    newsItemCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID forIndexPath:indexPath];
    if (cell == nil)
    {
        cell = [[newsItemCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
    }

    // Remove the old Subviews from the cells if they are there
    for(UIView *subview in [cell.newsItemImages subviews])
    {
        if (subview.tag != 0 )
        {
            [subview removeFromSuperview];
            NSLog(@"Removing View with Tag : %i", subview.tag);
        }
    }


    for(int imgCount = 0; imgCount < [[newsExtraImages objectAtIndex:indexPath.row] count]; imgCount++)
    {
        UIImageView *smallImgView = [[UIImageView alloc]initWithFrame:CGRectMake(picXCount,0, 216, 216)];


        smallImgView.tag = imgCount + 1;  // I added this, plus one to keep it above 0


        smallImgView.contentMode = UIViewContentModeScaleAspectFit;
        [smallImgView setImage:[allImages objectAtIndex:[[[newsExtraImages objectAtIndex:indexPath.row] objectAtIndex:imgCount] intValue]]];

        picXCount = picXCount + 216 + 12;

        [cell.newsItemImages addSubview:smallImgView];
    }
    [cell.newsItemImages setContentSize:CGSizeMake(picXCount, 216)];

    return cell;
}