Я реализую UICollectionView с двумя рядами ячеек, и мне нужно, чтобы оба можно было прокручивать по горизонтали одновременно

Question

У меня есть UICollectionView с горизонтальной прокруткой.Мне нужно разместить все свои ячейки представления коллекции в два ряда, и оба должны прокручиваться горизонтально.Макет выглядит так, как показано на скриншоте.

Как показано на скриншоте выше, мне нужно построить две строки, которые будут прокручиваться горизонтальнот. е. обе строки будут прокручиваться вместе в одном и том же направлении.

Ранее я рассматривал использование разделов в представлении прокрутки, но тогда прокрутка, вероятно, будет независимой, и поэтому я надеюсь найти лучшее решение..

Я посмотрел эту ссылку здесь: Аналогичное сообщение

Эта ссылка использует табличное представление для хранения нескольких представлений коллекции.Несмотря на то, что решение кажется хорошим, я действительно не уверен, может ли оно работать на меня, я хочу знать, есть ли лучшая альтернатива.Я посмотрел другие посты переполнения стека относительно того же (хотя не могу вспомнить, какие именно), но они не сильно помогли.

Теперь у нас обычно есть два столбца в виде коллекции, и мы можем прокручивать по вертикали.Вместо этого поведения, есть ли способ иметь две строки в UICollectionView, которые могут прокручиваться по горизонтали и одновременно?

Следует ли мне рассмотреть возможность использования двух представлений коллекции и иметь некоторую логику, которая связывает прокрутку обоих представлений?(Я бы предпочел не иметь два UICollectionview только для решения этой проблемы) Кроме того, я делаю это с помощью чистого кода.Раскадровки или файлы XIB не использовались.

Answer 1

Можете ли вы попробовать приведенный ниже код?

Мне удалось сделать это, я думаю

class CollectionViewController: UIViewController {
    @IBOutlet weak var collectionView: UICollectionView!

    override func viewDidLoad() {
        super.viewDidLoad()
        setUpCollectionView()
    }

    fileprivate func setUpCollectionView() {

        let collectionFlowLayout = UICollectionViewFlowLayout()

        collectionFlowLayout.scrollDirection = .horizontal
        collectionFlowLayout.itemSize = CGSize(width: 145, height: 145)
        collectionView.setCollectionViewLayout(collectionFlowLayout, animated: true)
        collectionView.delegate = self
        collectionView.dataSource = self
    }
}

extension CollectionViewController: UICollectionViewDelegate, UICollectionViewDataSource {

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 100
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CustomCollectionViewCell", for: indexPath)

        if indexPath.row % 2 == 0 {
            cell.contentView.backgroundColor = UIColor.red
        } else {
            cell.contentView.backgroundColor = UIColor.green
        }

        return cell
    }
}

ПРИМЕЧАНИЕ. Я установил коллекцию heightView как 300

ВЫХОД

Answer 2

Использовать 2 collectionView

    let CellId1 = "CellId1"
    lazy var collectionViewOne: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = 0
        let width = collectionView.frame.width
        let collectionViewOne = UICollectionView(frame: CGRect(x: 0, y: 100, width: width, height: 100), collectionViewLayout: layout)
        collectionViewOne.showsHorizontalScrollIndicator = false
        collectionViewOne.backgroundColor = .red
        return collectionViewOne
    }()

    let CellId2 = "CellId2"
    lazy var collectionViewTwo: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = 0
        let collectionViewTwo = UICollectionView(frame: CGRect(x: 0, y: 250, width: width, height: 100), collectionViewLayout: layout)
        collectionViewTwo.backgroundColor = .blue
        return collectionViewTwo
    }()

затем для получения числаOfItem и cellForRow:

   override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

        if collectionView == self.collectionViewOne {
            return 10
        } else if collectionView == self.collectionViewTwo {
            return 20
        } 

    }

    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        if collectionView == self.collectionViewOne {
            let Cell1 = collectionViewOne.dequeueReusableCell(withReuseIdentifier: CellId1, for: indexPath)
Cell1.backgroundColor = .green

            return Cell1

        } else if collectionView == self.collectionViewTwo {
            let Cell2 = collectionViewTwo.dequeueReusableCell(withReuseIdentifier: CellId2, for: indexPath )
Cell2.backgroundColor = .purple
            return Cell2
        } 

    }

и не забудьте зарегистрировать collectionView в viewDidLoad ()

    collectionViewOne.delegate = self
        collectionViewOne.dataSource = self

        collectionViewTwo.delegate = self
        collectionViewTwo.dataSource = self

collectionViewOne.register(Cell1.self, forCellWithReuseIdentifier: storyCell)
        collectionViewTwo.register(Cell2.self, forCellWithReuseIdentifier: cardCell)