UITableViewCell ImageView Resize - Selected Row Changes Image Size

Question

I am setting an table cell ImageView from a URL like the following:

NSURL *url = [[NSURL alloc] initWithString:[account valueForKeyPath:@"Avatar"]];
[cell.imageView sd_setImageWithURL:url placeholderImage:[UIImage imageNamed:@"default.png"]];

I am then using a table cell subclass and resizing the image and making it round like the following:

- (void)layoutSubviews {

    [super layoutSubviews];

    self.imageView.bounds = CGRectMake(0,0,32,32);
    self.imageView.layer.cornerRadius = 16;
    self.imageView.clipsToBounds = YES;
}

This works great until I actually tap on a table row. It will then shift the image to the left some pixels.

It's only the images that aren't a perfect square. Example 100x75 instead of 100x100

I must be missing something small here? Here is a small image showing the offset:

enter image description here

FYI I'm referencing this post: How do I make UITableViewCell's ImageView a fixed size even when the image is smaller

EDIT

I've also tried this as the table cell cellForRowAtIndexPath:

This seems to work, however, for some reason when the table view is loaded not all images are loaded in until I start scrolling

[[SDWebImageManager sharedManager] downloadImageWithURL:url options:0 progress: nil completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {

    // resize image code here, then set below
    cell.imageView.image = image;
}];

rather than setting bounds set frame inside layoutSubviews method as self.imageView.frame = CGRectMake(0,0,32,32); — Sanjay Mohnani, Apr 16 '15 at 14:19

score 0 · Answer 1 · answered Apr 16 '15 at 14:30

0

In my case I did this

-(void)layoutSubviews
{
    [super layoutSubviews];
    [self layoutIfNeeded];

    self.imageView.layer.cornerRadius = (self.imageView.bounds.size.width / 2.0);
    self.imageView.layer.masksToBounds = YES;

}

I haven't change bounds at run time. Hope it helps

answered Apr 16 '15 at 14:30

Zoeb S

695
1
7
21

This does not work unfortunately. Also I need the images to be 32x32 – aherrick Apr 16 '15 at 16:19

score 0 · Answer 2 · answered Apr 20 '15 at 13:52

0

FYI I ended up just creating a custom UITableViewCell with a UIImageView defined width/height 32x32 and custom labels to essentially mimic the Right Detail view.

answered Apr 20 '15 at 13:52

aherrick

19,799
33
112
188

score 0 · Answer 3 · answered May 08 '20 at 10:47

You can try adding cell.setNeedsLayout() after setting Cell's image view, if all images have same dimensions!

MenuController.shared.fetchImage(url: item.imageURL) { (image) in
        if let image = image {
            DispatchQueue.main.async {
                cell.imageView?.image = image
                cell.setNeedsLayout()
            }
        }
    }

score -1 · Answer 4 · answered Apr 16 '15 at 14:32

-1

Try this:

- (void)layoutSubviews {

[super layoutSubviews];

self.imageView.frame = CGRectMake(0,self.frame.size.width/2-16,32,32);
self.imageView.layer.cornerRadius = 16;
self.imageView.clipsToBounds = YES;

}

Or you may try set autoresizingMask

answered Apr 16 '15 at 14:32

Vladyslav Zubkov

375
1
8

UITableViewCell ImageView Resize - Selected Row Changes Image Size

4 Answers4