Custom UITableViewCell with a UIImageView not loading image for certain cells

Question

I have this really bizarre problem.

Basically I have a UITableViewCell subclass that ive written and linked some outlets to a Nib.

subclass of Cell.h

@property (weak, nonatomic) IBOutlet UIImageView *myImageView;

subclass of Cell.m

@synthesize myImageView = _myImageView; // do i need this?


- (void) setUpCell... image:(UIImage*)image
{
       if(image)
        self.myImageView.image = image;
    else
        self.myImageView.image = nil;
} 

In the view controller which manages the table view for the cell,

I have registered with the Nib using the following code:

[self.tableView registerNib:[UINib nibWithNibName:pathToNibForBaseMenuCell bundle:nil] forCellReuseIdentifier:identifierForBaseMenuCell];

In cellForRowAtIndexPath, I dequeue the cell and set the image...

CustomCell *cell = [tableView dequeueReusableCellWithIdentifier:identifierForBaseMenuCell];

switch (indexPath.section) {


    case 2:
        [cell setUpCell...image:self.cogWheelImageForSettingsIcon];
        break;

    default:
        break;
}

return cell;

}

The strange thing is, say I have 10 cells in a section 2 (as above), and I set them up in an identical way, some cells show the cogwheel icon, and some don't! Scrolling those cells in and out of view seems to change which cells show the icon and which don't.

This means that the registering the cell, including setting the re-use identifier, setting the subclass in the nib file, all of those sorts of things are fine (the common pitfalls).

This pattern of behaviour seems to me to be memory related - as if something is being deallocated somewhere...

Here is a picture to illustrate what I mean:

Please help!

Thanks

Vb

Edit:

OK just to be clear, im not using any data yet with this table, but in spite of that there's no reason why I those cogwheels shouldn't be appearing!

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

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
 {
switch (section) {
    case 0:
        return 1;
        break;

    case 1:
        return 10;
        break;

    case 2:
        return 10;
        break;

    default:
        return 0;
        break;
}
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
CustomCell *cell = [tableView dequeueReusableCellWithIdentifier:identifierForBaseMenuCell];

switch (indexPath.section) {
    case 0:
        [cell setUpCell... text:@"Username" image:nil];
        break;

    case 1:
        [cell setUpCell... text:@"Magazine" image:nil];
        break;

    case 2:
    {
        NSString* str = [NSString stringWithFormat:@"Settings: %d",indexPath.row];
        [cell setUpCell... text:str image:self.cogWheelImageForSettingsIcon];
        break;
    }

    default:
        break;
}

return cell;
}

The output of that is...

My point is that if im setting the same image for all cells which are in the 2nd section 'settings', why do only some of them have the image showing?

The Custom Cell class:

@interface CustomCell : UITableViewCell
@property (weak, nonatomic) IBOutlet UIImageView *backgroundImageView;
@property (weak, nonatomic) IBOutlet UILabel *mainLabel;
@property (weak, nonatomic) IBOutlet UILabel *arrowView;
@property (weak, nonatomic) IBOutlet UIImageView *myImageView;
- (void) setUpCelltext:(NSString*)text image:(UIImage*)image;


@implementation CustomCell

- (void) setUpCelltext:(NSString*)text image:(UIImage*)image
{
self.backgroundImageView.image = [UIImage imageNamed:pathForBackgroundImage];
self.myImageView.layer.cornerRadius = kCornerRadiusOfImageView;
self.myImageView.layer.masksToBounds = YES;

if(image)
    self.myImageView.image = image;
else
    self.myImageView.image = nil;

NSDictionary *attrsDictionary = [NSDictionary dictionaryWithObject:self.fontForText forKey:NSFontAttributeName];
NSAttributedString *attrString = [[NSAttributedString alloc] initWithString:text attributes:attrsDictionary];
self.mainLabel.attributedText = attrString;
}
@end

The cells have custom fonts, an arrow view, a background view - they all work as they should! They change depending on section. Its just the image that doesn't work. You can see that this function called by cellForRowAtIndexPath will either set an image, if its provided, or set the imageview to nil if it isn't.

Answer 1

Turns out that the problem was related to using 'imageView' as the name of my imageView in my nib. This was later changed but the original relationship was to the instance variable of UITableViewCell rather than Custom Cell.

Moral of the story: Don't call the image view of your custom table view cell 'imageView' !

Answer 2

UITableViewCell s are redrawn from old cells using dequeueReusableCellWithIdentifier: . If you do not want the cells being reused, then you will need to initialize a new cell every time in your tableView:cellForRowAtIndexPath: function.

However, if you want to reuse the cells (recommended), then you should be calling your - (void) setUpCell... image:(UIImage*)image function every time inside of your tableView:cellForRowAtIndexPath: in order to ensure that the image is set to only the correct cells.

You also seem to be using data stored inside your UITableViewCell subclass, but when the cell is reused on a different row, it will still think that it is the same cell from its original row.

Ex: A cell is created in row 2 and has an icon image. Cell 2 is off the screen and is now being used for row 16. Row 16 shouldn't have an image, but the cell still believes it is the same cell from row 2 and continues to show its image.

If you would like to have each cell be reused as well as have unique data for each one, only use an exterior data set (ex: an NSArray ) that provides the information necessary to draw the cell and pass that information to the cell each time, rather than depending on the information you give the cell upon its creation.