Resizable/Dynamic UICollectionView 宽度（不是单元格动态宽度！！）

Question

我有一个带绿色背景的水平 UICollectionView（附图），我想根据可用单元格的数量调整其宽度。之后，按钮需要附加到 collection views trailing anchor

例如：我在 collection 视图中有一张照片，其视图宽度为 100。用户按下按钮，将照片添加到 collection，并且宽度增加到 200。因此 addImageButton已向右移动。

它应该看起来像这样：

resizable collection view

我目前的代码是这样的：

class ImagesViewController: UIViewController {
    
    lazy var collectionView: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = 8
        let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
        collectionView.register(ImagesCollectionViewCell.self, forCellWithReuseIdentifier: ImagesCollectionViewCell.reuseIdentifier)
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        return collectionView
    }()
    
    lazy var addImageButton: UIButton = {
        let btn = UIButton()
        btn.layer.cornerRadius = 8
        btn.clipsToBounds = true
        btn.contentMode = .scaleAspectFill
        btn.backgroundColor = Colors.tintDefault
        btn.setImage(UIImage(named: "addImage"), for: .normal)
        btn.translatesAutoresizingMaskIntoConstraints = false
        btn.addTarget(self, action: #selector(handleAddImage), for: .touchUpInside)
        return btn
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = Colors.backgroundPrimary
        
        [collectionView, addImageButton].forEach { view.addSubview ([=11=]) }
        
        collectionView.anchor(top: top.bottomAnchor, leading: view.leadingAnchor, paddingTop: 20, width: 272, height: 80)
        collectionView.backgroundColor = .green
        
        addImageButton.centerYAnchor.constraint(equalTo: collectionView.centerYAnchor).isActive = true
        addImageButton.anchor(leading: collectionView.trailingAnchor, paddingLeft: 32, width: 24, height: 24)
        
        
    }
}

extension ImagesViewController: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
    
    // Some code here... (numberOfItemsInSection, cellForItemAt, etc)
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: 80, height: 80)
    }
    
}

请仔细阅读问题！

动态collection需要视图宽度，而不是单元格宽度！

请帮我设置 collection 视图的动态宽度

Answer 1

尝试以下操作：

像这样在 UIViewController 子类中声明一个变量。

private var contentSizeObservation: NSKeyValueObservation?

在 viewDidLoad() 内或设置 myCollectionView 时，开始观察 contentSize 的变化。

contentSizeObservation = myCollectionView.observe(\.contentSize, options: .new, changeHandler: { [weak self] (cv, _) in
    guard let self = self else { return }
    self.myCollectionViewWidthConstraint.constant = cv.contentSize.width
})

不要忘记在 deinit 调用 -

deinit {
    contentSizeObservation?.invalidate()
}

此方法将确保您的 myCollectionView 宽度始终与其内容一样大。

Resizable/Dynamic UICollectionView 宽度（不是单元格动态宽度！！）

Resizable/Dynamic UICollectionView width (not a cell dynamic width!!)

ios

swift

uicollectionview

autolayout

nslayoutconstraint