xcode ios: in cell image overlaps on the label - objective-c

Question

I am displaying an image on my cell in the table. I have the code within
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
While I am using storyboard, so I displayed the image in the cell with
cell.imageView.image = [UIImage imageNamed:_lotImagesArray[row]];
However, when I tried to load the image from a webserver, The image sits on top of the label in the cell (blocking the label text)
The code I used to display the image from webserver is this:
NSString *strURL = [NSString stringWithFormat:#"http://www.domainhere.com/images/%#", lotPhoto[row]];
NSURL *url = [[NSURL alloc] initWithString:strURL ];
cell.imageView.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:url]];
Can someone please advice where did I go wrong?

Answer 1

A couple of likely possibilities:
First, you might want to double-check to make sure that you have
cell.imageView.clipsToBounds = YES;
If you don't, when it sizes the image to fit in the UIImageView, the image can bleed over the bounds of the image view. I notice this problem, especially, when I'm doing this image loading in a background queue.
Second, if you're setting the imageView property of the UITableViewCell in the background (like the simplified sample code below), you should know that it's important to properly initialize the image with a blank image before you kick off the background image loading process. So, an example of very common code when loading a cell from a web based source is something like:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
cell.textLabel.text = ... // you configure your cell however you want
// make sure you do this next line to configure the image view
cell.imageView.image = [UIImage imageNamed:#"blankthumbnail.png"];
// now let's go to the web to get the image
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT,0), ^{
UIImage *image = ... // do the time consuming process to download the image
// if we successfully got an image, remember, ALWAYS update the UI in the main queue
dispatch_async(dispatch_get_main_queue(), ^{
// let's make sure the cell is still visible (i.e. hasn't scrolled off the screen)
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
if (cell)
{
cell.imageView.image = image;
cell.imageView.contentMode = UIViewContentModeScaleAspectFill;
cell.imageView.clipsToBounds = YES;
}
});
});
return cell;
}
Clearly, if you do something like that, you'll want to make sure that the [UIImage imageNamed:#"blankthumbnail.png"]; is not returning nil (i.e. make sure your app is successfully finding it in the bundle). Common problems might include failure to have a blank image at all, a mistake in the name, failure to include the image in your Target settings, under the "Build Phases" tab, under "Copy Bundle Resources".
Third, you need to make sure that when you're using subclassed UITableViewCell entries, that you don't use the standard UITableViewCell property names of imageView, textLabel, etc. Make sure to use your own, unique names. If you use imageView, the system gets confused between your new IBOutlet and the default imageView property of the UITableViewCell.