UICollectionView 单元格不会根据具有自动调整大小的单元格内容调整大小

时间:2021-07-20 18:00:18

标签: ios swift uicollectionview uicollectionviewcell uicollectionviewlayout

我正在尝试使用根据单元格内容调整宽度的单元格创建 UICollectionView,使用 layout.estimatedItemSize = UICollectionViewFlowLayout.automaticSize 但它不会更新。波纹管是我试图实现的目标的两个图像,下一个是我已经实现的目标。

这就是我想要实现的目标。

Correct display

这是我已经能够实现的

What I have now

这是我的代码

import UIKit

struct Model {
    let name: String
    let color: String
}

class DisplayTagsView: UIView {

    // Collection View
    var projectTagsCollectionView: UICollectionView!
    var projectTagsCollectionViewHeightConstraint: NSLayoutConstraint!

    private var tagsObjects = [Any]() // Object to allow add button
    private var tags: [Model] = [] // Tags

    // MARK: - Init
    init() {
        super.init(frame: .zero)
        initViews()
        initTags()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)
    }

    func initTags() {
        self.tags.append(Model(name: "Some tag", color: "color"))
        self.tags.append(Model(name: "Twotwo", color: "color"))
        self.tags.append(Model(name: "Smartparking", color: "color"))
        self.tags.append(Model(name: "Development", color: "color"))
        
        self.tagsObjects = self.tags
        self.tagsObjects.append(AddButtonCollectionViewCell.self)
    }

    // MARK: - Private
    private func initViews() {
        initTagCollectionView()
    }

    private func initTagCollectionView() {

        let layout = UICollectionViewFlowLayout()
        layout.estimatedItemSize = UICollectionViewFlowLayout.automaticSize
        layout.minimumLineSpacing = 5
        layout.minimumInteritemSpacing = 5
        layout.scrollDirection = .vertical

        projectTagsCollectionView = UICollectionView(frame: self.frame, collectionViewLayout: layout)
        projectTagsCollectionView.delegate = self
        projectTagsCollectionView.dataSource = self
        projectTagsCollectionView.register(cell: ProjectCollectionViewCell.self)
        projectTagsCollectionView.register(cell: AddButtonCollectionViewCell.self)
        projectTagsCollectionView.isScrollEnabled = false
        projectTagsCollectionView.backgroundColor = .clear
    }

    // set up views
    func setupView() {
        addSubview(projectTagsCollectionView)
        setCollectionHeight()
    }

    // update height
    func setCollectionHeight() {
        projectTagsCollectionViewHeightConstraint = projectTagsCollectionView.heightAnchor.constraint(equalToConstant: 200)
        projectTagsCollectionViewHeightConstraint.isActive = true
    }
    
    // Button button
    func addButton() -> UIButton {
        let addButton = UIButton()
        addButton.setImage(#imageLiteral(resourceName: "settings"), for: .normal)
        return addButton
    }

}

// MARK: - UICollectionViewDelegateFlowLayout
extension DisplayTagsView : UICollectionViewDelegateFlowLayout {
    // Auto resizing of the cell tags
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        let flowLayout = collectionViewLayout as? UICollectionViewFlowLayout
        var newEdgeInsets = UIEdgeInsets(top: flowLayout!.sectionInset.top, left: flowLayout!.sectionInset.left, bottom: flowLayout!.sectionInset.bottom, right: flowLayout!.sectionInset.right)
        if collectionView.numberOfItems(inSection: section) == 1 {
            let edgeInset = newEdgeInsets.right + (collectionView.frame.width - flowLayout!.itemSize.width)
            newEdgeInsets.right = edgeInset
        }
        return newEdgeInsets
    }
}

// MARK: - UICollectionViewDelegate
extension DisplayTagsView: UICollectionViewDelegate {

}

// MARK: - UICollectionViewDataSource
extension DisplayTagsView: UICollectionViewDataSource {

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let tagObject = self.tagsObjects[indexPath.item]
        if let tag = tagObject as? Model {
            let cell: ProjectCollectionViewCell = projectTagsCollectionView.dequeueTypedCell(forIndexPath: indexPath)
            cell.configureCell(tagName: tag.name, tagBackground: tag.color)
            return cell

        } else {
            // Adding button to the UICollection
            let cell: AddButtonCollectionViewCell = membersCollectionView.dequeueTypedCell(forIndexPath: indexPath)

            let addButto = addButton()

            cell.contentView.subviews.forEach({$0.removeFromSuperview()})
            cell.contentView.addSubview(addButton)
            settingButton.snp.makeConstraints { make in
                make.size.equalTo(cell.contentView)
            }
            return cell
        }
    }

    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        print(indexPath)
    }
}


1 个答案:

答案 0 :(得分:0)

尝试以下库。标签列表视图。

https://github.com/ElaWorkshop/TagListView。它肯定在你的条件下工作