如何以编程方式将宽高比约束应用于自定义UICollectionViewCell？

Question

I'm trying to create a grid style view that displays photo album covers. I would like 3 album covers per row. The tricky part is getting the cells to increase size appropriately depending on what device is being used eg iPhone 4s/5/5s/5c/6/6 plus, so that 3 items/cells are always shown per row no matter what device is being used.

I've never been able to do this. I was thinking about setting the sizes manually like so:

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    if DeviceHelper.DeviceType.IS_IPHONE_4_OR_LESS {
        return CGSizeMake(115, 140)
    } else if DeviceHelper.DeviceType.IS_IPHONE_5 {
        return //size
    } else if DeviceHelper.DeviceType.IS_IPHONE_6 {
        return //size
    } else {
        return //size 
    }
}

I have a helper that determines what device is being used and I can call it from anywhere within my app. But isn't there a way to make sure 3 cells are always displayed in each row no matter what device is being used and also have equal padding shown to something like this:

The aspect ratio constraints have been helpful but this time round I can't apply them to the cell because interface builder won't allow it. Is there a straight forward to do this?

Thanks in advance for your time.

Answer 1

Remove default cell spacing :

Try this code :

Just set value for numberOfCellInRow for number of cells in a row of collection view

Obj-C

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
   int numberOfCellInRow = 3;
   CGFloat padding = 5.0;
   CGFloat collectionCellWidth =  [[UIScreen mainScreen] bounds].size.width/numberOfCellInRow;
   CGFloat finalWidthWithPadding = collectionCellWidth - padding;
   return CGSizeMake(finalWidthWithPadding , finalWidthWithPadding);
}

Swift

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    var numberOfCellInRow : Int = 3
    var padding : Int = 5
    var collectionCellWidth : CGFloat = (self.view.frame.size.width/CGFloat(numberOfCellInRow)) - CGFloat(padding)
    return CGSize(width: collectionCellWidth , height: collectionCellWidth)
}

I think it will work for all the devices.