如何以编程方式将 UIPageController 和 UICollectionViewController 添加到 UIViewController

Question

我已经有一个以编程方式制作的 UIViewController，并希望在底部有一个包含 4 个单元格的集合视图，但我希望能够在集合视图的不同页面中滑动以查看不同的单元格。我不确定从哪里开始在集合视图上启用分页以及如何设置单元格，或者创建页面控制器并将集合视图添加到其中？我已经在网上看到了几种方法，但这并不真正符合我的需求。

我想要这样的东西：

如果我可以为您提供更多信息，请告诉我。我刚刚创建了一个基本的页面控制器，但不确定如何实现我想要的。

编辑：我创建了一个集合视图并添加了约束以获得我想要的布局；但是我不确定如何让它像页面一样滑动。

这是集合视图的代码：

let friendsCollectionView: UICollectionView = {
    let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .horizontal
    let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
    cv.translatesAutoresizingMaskIntoConstraints = false
    cv.register(FriendsCell.self, forCellWithReuseIdentifier: "cell")
    cv.backgroundColor = UIColor.blue
    cv.layer.cornerRadius = 10
    return cv
}()

view.addSubview(friendsCollectionView)
friendsCollectionView.anchor(top: separatorView.bottomAnchor, left: nil, bottom: nil, right: nil, paddingTop: 50, paddingLeft: 0, paddingBottom: 0, paddingRight: 0, width: 250, height: 250)
 friendsCollectionView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true

  func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: 75, height: 75)
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
    if section == 0 {
        return UIEdgeInsets(top: 85, left: 10, bottom: 0, right: 0)
    }
    if section == 1 {
        return UIEdgeInsets(top: 10, left: 0, bottom: 10, right: 0)
    }
    if section == 2 {
        return UIEdgeInsets(top: 85, left: 5, bottom: 0, right: 0)
    }


    return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        if section == 0 { return 1 }
        if section == 1 { return 2 }
        if section == 2 { return 1 }


    return 0
}
func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 3
}

Answer 1

您所需要的只是一个 UICollectionViewController 或者我假设您有一个符合 collectionView 协议的 UIViewController。带有一个 UICollectionView 的 UIViewController 是一个很好的起点。但是，您插入的单元格需要不同。首先，ViewController 中的 collectionView 需要有 collectionView?.isPagingEnabled = true 并且它的布局 scrollDirection 设置为 .horizo​​ntal。完成后，您需要创建单元格。

您实现的单元格应该是 UICollectionViewController 和 UICollectionViewDelegateFlowLayout 的子类。此 collectionView 的布局需要将 scrollDirection 设置为 .vertical 尽管我相信您无论如何都不会在此视图中滚动。此 collectionView 中的单元格数将为 4。然后，您出列您希望拥有 4 个单元格的单元格（头部为蓝底白字的那个）。

UICollectionViewController 需要出列作为您的第一个 collectionView 的单元格。基本上：

您的主 ViewController 有一个水平滚动的 collectionView。这个 collectionView 有一个 UICollectionViewController 作为单元格并垂直滚动。

这听起来可能很复杂，但我已经做到了，而且运行顺利。如果您有任何问题，请告诉我。