0

I created a UICollectionView in the storyboard editor and added it to my (custom) ViewController. Like every view controller in storyboard, it says the size is 600x600 and so the UICollectionView, which takes up the whole view, is also 600x600.

This is not correct though, as I am writing an iPhone app and so the real dimensions should be 320x568!

Because of this, when I add items to my collection, they are placed off the right side of the screen. For example, I first add a cell with an image in of size 160x213. It is left justified and it takes up exactly the left half of the screen. When I add the next image, there is a huge gap and it appears on the left side, partly cut off. The third image I would expect to appear below the first, but it doesn't appear at all. I believe it is off the right side of the screen. This implies that the size of the UICollectionView is 600x600 and not 320x568.

I should mention that I've tried everything I could think of to fix this. For example:

  • I tried adjusting the size of the collection view:

    self.photoCollection.frame = CGRectMake(0, 0, 320, 568);

  • I tried unchecking "Use Size Classes" in the storyboard editor.

It seems to work if I uncheck "Use Auto Layout" but I would like to use auto layout. How do I get this work?

rmaddy
  • 314,917
  • 42
  • 532
  • 579
Mike
  • 1,727
  • 2
  • 19
  • 32

1 Answers1

2
  1. You can set the "Simulated Metrics" of the view in your storyboard like this below. Personally, I prefer using 3.5/4-inch to construct my layout, as with auto layout, i only need to add some constraints to elements and iOS will automatically support the 4.7 and 5 inch screen size.

enter image description here

  1. I think you should google for some "Auto Layout" tutorials, and I don't think its too hard for you to pick up :D. For instance, if you want to set the collection view frame equal to your view frame. You can do it like this

enter image description here

Feel free to ask any follow up question if your have any, Cheers!

Pang Ho Ming
  • 1,299
  • 10
  • 29
  • Thanks! That fix most of my problems but Auto Layout still seems a little confusing. First, I noticed I had to se the vertical space for my UICollectionView to be -64. When it was set to 0, the first cell would not be aligned to the top-left corner but instead offset quite a ways down. I'm assuming this has something to do with the fact that I have a navigation view controller so there is a bar at the top. Still, I don't understand why that affects the collection view. – Mike Apr 10 '15 at 06:21
  • Second, my cells (I subclassed from UICollectionViewCell) consist solely of a UIImageView which I want to to fill the whole cell. When I set 4 constraints around the sides to "0", there still is a sizable margin around the image. If I hardcode the size of the cell and the UIImageView to be exactly the same size (the size of the image), there is no margin. I'm using aspect fit. – Mike Apr 10 '15 at 06:28
  • Refer to your -64 offset problem, 1. you can take a look to my image1. There is a option on the right hand side bar called "Extend Edges", uncheck the "Under Top Bars". 2. You may also check whether if your view is embedded into a navigation controller :D – Pang Ho Ming Apr 10 '15 at 06:30
  • for the cells problem, you can refer to this question http://stackoverflow.com/questions/18746929/using-auto-layout-in-uitableview-for-dynamic-cell-layouts-variable-row-heights – Pang Ho Ming Apr 10 '15 at 06:31