UICollectionView 水平分页仅在第一页上每行显示 3 个单元格

Posted 2023-02-23

【中文标题】UICollectionView 水平分页仅在第一页上每行显示 3 个单元格

【英文标题】：UICollectionView horizontal paging presenting 3 cells per row on first page only

【发布时间】：2018-10-03 18:21:15

【问题描述】：

我有一个 UICollectionView，我已经实现了水平滚动，但由于某种原因，当我滚动浏览时，只显示了 3 个单元格（应该有 9 个）

class BusinessPhotosViewController: UICollectionViewController ,UICollectionViewDelegateFlowLayout

    let cellId = "photos"

    override func viewDidLoad() 
        super.viewDidLoad()

        if let layout = collectionView?.collectionViewLayout as? UICollectionViewFlowLayout 
            layout.scrollDirection = .horizontal
            layout.minimumLineSpacing = 0
        

        collectionView?.register(BusinessPhotoCells.self, forCellWithReuseIdentifier: cellId)
        collectionView?.contentInset = UIEdgeInsets.init(top: 0, left: 0, bottom: 0, right: 0)
        collectionView?.scrollIndicatorInsets = UIEdgeInsets.init(top: 0, left: 0, bottom: 0, right: 0)
        collectionView?.isPagingEnabled = true
    

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

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

    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath) as! BusinessPhotoCells

        return cell
    

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
        let width = view.frame.width / 3
        return CGSize(width: width, height: width)
    

我在另一个名为 BusinessDetailViewController 的 UICollectionViewController 的单元格中展示了这个 BusinessPhotosViewController

class BusinessDetailViewController : UICollectionViewController 

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

            let scrollCell = collectionView.dequeueReusableCell(withReuseIdentifier: pictureCellId, for: indexPath)

            let bizVC = BusinessPhotosViewController(collectionViewLayout: UICollectionViewFlowLayout())

            scrollCell.addSubview(bizVC.view)
            bizVC.view.anchor(top: scrollCell.topAnchor, left: scrollCell.leftAnchor, bottom: scrollCell.bottomAnchor, right: scrollCell.rightAnchor, paddingTop: 0, paddingLeft: 0, paddingBottom: 0, paddingRight: 0, width: scrollCell.frame.width, height: scrollCell.frame.height)

            return scrollCell
    
 

所以我可以看到滚动工作，但我看到的问题是只加载了 3 个单元格（共 9 个），并且视图看起来像这样：

我见过here 和here 和其他解决方案，但没有一个对我有帮助。

【问题讨论】：

如果缩小尺寸，您将看到所有 9 个单元格

【参考方案1】：

我尝试了您的代码，如果 9 个单元格的大小小于滚动单元格大小，我可以看到所有 9 个单元格。

import UIKit

class ViewController: UIViewController
    override func viewDidLoad() 
        view.backgroundColor = .red;

        view.addSubview(photosContainer);

        photosContainer.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true;
        photosContainer.topAnchor.constraint(equalTo: view.centerYAnchor).isActive = true;
        photosContainer.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true;
        photosContainer.heightAnchor.constraint(equalTo: view.heightAnchor, multiplier: 0.4).isActive = true;

        ***let layout = UICollectionViewFlowLayout();
        layout.scrollDirection = .horizontal
        let bizVC = BusinessPhotosViewController(collectionViewLayout: layout)
        bizVC.view.frame = photosContainer.bounds;
        photosContainer.addSubview(bizVC.view)***

    

    let photosContainer : UIView = 
        let view = UIView();
        view.backgroundColor =  .green;
        view.translatesAutoresizingMaskIntoConstraints  = false;
        return view;
    ();

在添加视图之前，如果您设置了框架，那么我可以看到所有九个单元格，无论它们大小。

让我知道它是否有效