4

I tried this solution here but it seems to only work for vertical layout. I'm trying to make it work for a horizontal layout. In my case, I always want 3 cells on top and 2 on bottom that is center aligned.

Example:Example

picciano
  • 22,341
  • 9
  • 69
  • 82
Oranges
  • 51
  • 3
  • 5
  • Sorry @MilanNosáľ I should have said that it's not always 5 cells, it can be any number of cells. My question is how do I manage the layout so that it always displays my cell in the format that I want – Oranges Dec 13 '17 at 21:32
  • Any update on this problem? – Chetan Rajagiri Dec 06 '18 at 12:04

1 Answers1

0

I think this should help you a bit (I defined insets in delegate method because collectionview would otherwise center only my 1st section and leave others untouched):

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {

        // handling layout
        // which needs to be centered vertically and horizontally
        // also:
        // maximum number of items = 6
        // maximum number of rows = 2
        // maximum number of items in row = 3
        let numberOfItems: CGFloat
        let numberOfRows: CGFloat
        if collectionView.numberOfItems(inSection: section) > Constants.maxNumberOfItemsInRow  {
            numberOfItems = CGFloat(Constants.maxNumberOfItemsInRow)
            numberOfRows = CGFloat(Constants.maxNumberOfRows)
        } else {
            numberOfItems = CGFloat(collectionView.numberOfItems(inSection: section))
            numberOfRows = CGFloat(Constants.minNumberOfRows)
        }


        let totalCellWidth = Constants.itemSize.width * numberOfItems
        let totalSpacingWidth = Constants.minimumInteritemSpacing * numberOfItems
        var leftInset = (collectionView.layer.frame.size.width - CGFloat(totalCellWidth + totalSpacingWidth)) / 2

        let totalCellHeight = Constants.itemSize.height * numberOfRows
        let maximumSectionHeight = (Constants.itemSize.height * CGFloat(Constants.maxNumberOfRows)) + (CGFloat(Constants.maxNumberOfRows + 1) * Constants.minimumLineSpacing)

        if leftInset < 0.0 { leftInset = 0.0 }

        let topInset = (maximumSectionHeight - totalCellHeight) / 2

        let rightInset = leftInset

        return UIEdgeInsets(top: topInset, left: leftInset, bottom: topInset, right: rightInset)
    }

Also, layout is defined by class:

class CollectionViewFlowLayout: UICollectionViewFlowLayout {

    // MARK: - Constants

    private struct Constants {
        static let minimumInteritemSpacing: CGFloat = 12.5
        static let minimumLineSpacing: CGFloat = 16.5
        static let itemSize = CGSize(width: 64.0, height: 90.0)
    }

    override func prepare() {

        guard let collectionView = collectionView else { return }

        /// Defining flow layout for collectionview presentation
        itemSize = Constants.itemSize

        headerReferenceSize = CGSize(width: collectionView.dc_width, height: 1)
        scrollDirection = .vertical
        minimumInteritemSpacing = Constants.minimumInteritemSpacing
        minimumLineSpacing = Constants.minimumLineSpacing

        super.prepare()
    }
}
Kristijan Delivuk
  • 1,253
  • 13
  • 24