CollectionView не отображает 3 столбца, как ожидалось

Question

У меня 3 разных UICollectionView с в одном UIViewController. Они работают нормально. Моя проблема со стилем, у 2 из них должен быть одинаковый стиль - 3 столбца и некоторый интервал.

Это то, что мне нужно для достижения: скриншот

И это то, что я получил до сих пор: желаемый результат

 func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if collectionView == gameCollectionView {
        let width = gameCollectionView.frame.size.width
        return CGSize(width: ((width / 2) - 7), height: 150)
    }
    else {
        let width = paymentCollectionView.bounds.width / 3 // < THIS IS What should give 3 columns 
        return CGSize(width: width, height: 70)
    }
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 0

}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
    return 0
}

Может кто-нибудь сказать мне, как этого добиться, и желательно объяснить, как это работает, потому что я не могу понять это

ОБНОВЛЕНИЕ: По запросу - Раскадровка для CollectionView Раскадровка

Answer 1

Если вы планируете развернуть для iOS 13 или выше , я бы рекомендовал использовать Композиционный макет для достижения этой сетки.

Ресурсы

У Apple есть отличный WWD C и SDK, который вы можете скачать, чтобы просмотреть их пример кода. Вот ссылки:

Достижения в макете представления коллекции WWD C 2019

Связанный SDK

Рекомендация

Я бы также рекомендовал обернуть все три представления коллекции в это представление одной коллекции. Этого легко достичь, используя Compositional Layout.

Пример кода

Пример ниже по ссылке выше. Вы можете расположить 3 столбца, просто определив его в своей группе. В качестве альтернативы вы можете расположить свои элементы как часть их группового контейнера.

    func createLayout() -> UICollectionViewLayout {
    let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                         heightDimension: .fractionalHeight(1.0))
    let item = NSCollectionLayoutItem(layoutSize: itemSize)

    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                          heightDimension: .absolute(44))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitem: item, count: 3)
    let spacing = CGFloat(10)
    group.interItemSpacing = .fixed(spacing)

    let section = NSCollectionLayoutSection(group: group)
    section.interGroupSpacing = spacing
    section.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10)

    let layout = UICollectionViewCompositionalLayout(section: section)
    return layout
}

}

Answer 2

CGSize(width: ((width - `section's left & right spce` - minimumInteritemSpacing) / `numberofCellYouWant`), height: 150)

вы можете получить minimumInteritemSpacing из collectionView.collectionViewLayout объекта

Answer 3

Вы можете попробовать это

let screenWidth = self.CollecionView.frame.width
let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.itemSize = CGSize(width: (screenWidth/3)-5, height: (screenWidth/3)-5)
self.CollecionView.collectionViewLayout = layout

Answer 4

Вам необходимо изменить эту делегатскую работу

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if collectionView == gameCollectionView {
        let width = gameCollectionView.frame.size.width
        return CGSize(width: ((width / 2) - 7), height: 150)
    }
    else {
        let width = (paymentCollectionView.frame.width / 3) - 5 // if you want to more space so increase
        return CGSize(width: width, height: 70)
    }
}