如何根据标签文本大小更改收藏夹视图项的宽度？

Question

我正在尝试制作一个可滚动的分段控件，如上图所示。我正在使用集合视图来制作可滚动的分段控件。我要根据该项目上标签的宽度，使每个项目具有不同的宽度。

像上面图像一样的集合视图宽度是使用下面的代码设置的，但是结果不是我想要的。因为它不会根据标签的宽度调整集合视图项目的宽度。

false

我尝试使用下面的代码，根据标签固有内容的大小来设置收集宽度。

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

        let collectionViewWidth = collectionView.frame.width
        let itemWidth = (collectionViewWidth / 3.1) - (2 + 2)
        return CGSize(width: itemWidth, height: 30)

    }

但是结果很奇怪，如下图所示：

似乎我在应用运行之前根据xib文件中标签的固有内容大小来调整集合视图项的宽度

宽度很小，因为我在xib文件的标签中设置了“ abc”，如下图所示。如果我将标签设置为“ abcdefghjklmnop”，则收藏夹视图项的宽度会变宽。

那么如何根据商品标签的宽度使每件商品具有不同的宽度？

这是我的视图控制器中的代码：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "segmentedControlCell", for: indexPath) as! SegmentedControlCell
        let itemWidth = cell.tagLabel.intrinsicContentSize.width + 16
        return CGSize(width: itemWidth, height: 30)

    }

这是我的收藏夹视图单元格中的代码：

class ViewController: UIViewController {

    @IBOutlet var segmentedControlCollectionView: UICollectionView!

    var arrayData = [TabScrollSegmentedControl]()


    override func viewDidLoad() {
        super.viewDidLoad()

        let nibCell = UINib(nibName: "SegmentedControlCell", bundle: nil) // nama disini adalah nama filenya blablabla.xib, BUKAN NAMA IDENTIFIER
        segmentedControlCollectionView.register(nibCell, forCellWithReuseIdentifier: "segmentedControlCell")

        let tab1 = TabScrollSegmentedControl(title: "Bahan Makanan", isSelected: true)
        let tab2 = TabScrollSegmentedControl(title: "Pembersih & Detergen", isSelected: false)
        let tab3 = TabScrollSegmentedControl(title: "Minuman Botol", isSelected: false)
        let tab4 = TabScrollSegmentedControl(title: "Kemasan Lainnya", isSelected: false)
        let tab5 = TabScrollSegmentedControl(title: "Kemasan Kotak", isSelected: false)
        let tab6 = TabScrollSegmentedControl(title: "Makanan Instan", isSelected: false)
        let tab7 = TabScrollSegmentedControl(title: "Alat Kecantikan", isSelected: false)
        let tab8 = TabScrollSegmentedControl(title: "Bahan Dapur", isSelected: false)
        let tab9 = TabScrollSegmentedControl(title: "Bahan masakan", isSelected: false)
        let tab10 = TabScrollSegmentedControl(title: "Shampoo", isSelected: false)


        arrayData.append(tab1)
        arrayData.append(tab2)
        arrayData.append(tab3)
        arrayData.append(tab4)
        arrayData.append(tab5)
        arrayData.append(tab6)
        arrayData.append(tab7)
        arrayData.append(tab8)
        arrayData.append(tab9)
        arrayData.append(tab10)


    }


}

extension ViewController : UICollectionViewDataSource, UICollectionViewDelegate {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return arrayData.count
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "segmentedControlCell", for: indexPath) as! SegmentedControlCell
        cell.selectedData = arrayData[indexPath.item]

        return cell
    }

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

        var tabContainer = [TabScrollSegmentedControl]()

        for tab in arrayData {
            var newTab = tab
            newTab.isSelected = false
            tabContainer.append(newTab)
        }

        var selectedTab = tabContainer[indexPath.item]
        selectedTab.isSelected = true
        tabContainer[indexPath.item] = selectedTab

        arrayData = tabContainer
        segmentedControlCollectionView.reloadData()

    }


}



//MARK: - Collection View Flow Layout
extension ViewController : UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "segmentedControlCell", for: indexPath) as! SegmentedControlCell
        let itemWidth = cell.tagLabel.intrinsicContentSize.width + 16
        return CGSize(width: itemWidth, height: 30)

    }


    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        // to give spacing between items in each colomns

        return 2

    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        // to give space between rows of item

        return 2

    }
}