3

I have a Table View Cell, and all that is in it is an ImageView.

How would I get the Table View Cell size to change dynamically with the Image (sizes) I get from Instagram's API?

I'm having a hard time solving, because there are essentially two variables I'm solving for:

  • Variable Size of Image from Instagram API (standard res always seem to be at least 600+ so will always be able to stretch from left to right no matter what phone size)
  • Variable iPhone Size (iPhone 6, 6 Plus, etc)

I've tried pinning all sides, that didn't work. I've tried pinning left and right along with add constraints Bottom Space to Container Margin and Top Space to Container Margin, that didn't work.

But I can't get it right. I'm sure its something small I'm missing. Any help would be appreciated. Thanks!

I'm using Xcode 6 and iOS 8. I'm using Storyboard. Only Portrait orientation.

SRMR
  • 3,064
  • 6
  • 31
  • 59
  • What exactly do you want the size to be? Do you want the images to always be full width on whatever screen size you have, and make the height whatever is appropriate to keep the aspect ratio correct? – rdelmar Nov 08 '14 at 01:10
  • this might help http://stackoverflow.com/questions/18746929/using-auto-layout-in-uitableview-for-dynamic-cell-layouts-variable-row-heights – madmik3 Nov 08 '14 at 01:11
  • @rdelmar yes I want the images to be as full width as possible. So width from my understanding of iPhone resolutions: iPhone 5s width = 320, iPhone 6 width = 375, iPhone 6 Plus width = 414. And then the height would correspond to the width (i.e. iPhone 5s height = 320, iPhone 6 height = 375, iPhone 6 Plus height = 414). So yes, make height whatever is appropriate to keep the aspect ratio correct. – SRMR Nov 08 '14 at 02:00
  • @madmik3 yes I've seen that thanks tho! Just can't figure out why what I have isn't working, even though I see all of his troubleshooting solutions – SRMR Nov 08 '14 at 02:01
  • Your comment is self-contradictatory. Unless all the images are square, then setting the height of the image view to the same as the width won't keep the aspect ratio correct. Also, what you said doesn't change the height based on the image size, only the screen size. – rdelmar Nov 08 '14 at 02:06
  • Sorry if my comment was wrong or confusing. I want the images to always be full width on whatever screen size I have, and make the height whatever is appropriate to keep the aspect ratio correct. Appreciate the help, looking forward to your answer, really want to get this figured out!! – SRMR Nov 08 '14 at 02:24
  • (I think from my understanding of Instagram's API, all of their images are square. But I might be misreading their API docs. So in case I'm wrong, just ignore that I guess.) – SRMR Nov 08 '14 at 02:25

1 Answers1

1

I don't know whether this can be done in the storyboard or not. Maybe there's a way to do it in iOS 8 using self-sizing cells, but I didn't find the way to do that, and in any case, that would only work for iOS 8, not 7. Anyway, it's easy enough to do with code, and simple constraints setup in the storyboard. Just pin your image view to all four sides of the cell (I did it in my example using the standard margins of 8 to all sides), and then implement heightForRowAtIndexPath,

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    CGSize imageSize = [[UIImage imageNamed:self.theData[indexPath.row]] size];
    CGFloat height = imageSize.height/imageSize.width * (tableView.frame.size.width - 16);
    return height + 16;
}

The 16's in the code are to account for the padding of 8 on all the sides of the image view. If you have your image view go all the way to the left and right edges, then you can eliminate those.

rdelmar
  • 103,982
  • 12
  • 207
  • 218
  • 1
    I see, makes sense. I'm looking for iOS 8 only code, so I'm not too worried about it not working for iOS 7. Thanks for the response! – SRMR Nov 08 '14 at 15:59
  • @SRMR, I think this may be the only way. I don't think the system can take into account the aspect ratio of the image, and adjust the cell size automatically. – rdelmar Nov 08 '14 at 16:34
  • I ran into some issues with a similar solution. `tableView.frame.size.width` might still be set to the storyboard preview frame value when `tableView:heightForRowAtIndexPath:` is called (at least with local dummy data). I'd throw in a `[tableView layoutIfNeeded]` to make sure the frame is done auto-layouting. – Suau Dec 08 '14 at 08:26