我正在用两行单元格实现UICollectionView，我需要两个可以同时水平滚动

Question

我有一个具有水平滚动的UICollectionView。我需要将所有集合视图单元格放在两行中，并且两者都应该水平滚动。布局如屏幕截图所示。

如上面的屏幕截图所示，我将不得不构建两行将水平滚动，即两行将在同一方向上一起滚动。

我之前考虑过在滚动视图中使用部分，但滚动可能是独立的，因此，我希望找到更好的解决方案。

我在这里查看了这个链接：A similar post

此链接使用tableview来保存多个集合视图。虽然解决方案似乎很好，但我真的不确定它是否适用于我，我想知道是否有更好的选择。我查看了相同的其他堆栈溢出帖子（虽然不记得哪个）但是它们没有多大帮助。

现在通常，我们在集合视图中有两列，我们可以垂直滚动。而不是这种行为，有没有办法在UICollectionView中有两行可以水平和同时滚动？

我应该考虑使用两个集合视图并使用一些逻辑来绑定两个视图的滚动吗？ （我宁愿没有两个UICollectionviews来解决这个问题）另外，我是通过纯代码完成的。没有使用故事板或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
    }
}

注意：我已将collectionView高度设置为300

OUTPUT

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
    }()

然后获取numberOfItem和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
        } 

    }

并且不要忘记在viewDidLoad（）中注册collectionView

    collectionViewOne.delegate = self
        collectionViewOne.dataSource = self

        collectionViewTwo.delegate = self
        collectionViewTwo.dataSource = self

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