Swift - 在CollectionView中设置不同宽度的单元格之间的固定间距

Posted 2021-04-21

我有一个集合视图，将显示用户技能。

 lazy var collectionView: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
        collectionView.backgroundColor = .white
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        collectionView.keyboardDismissMode = .interactive
        collectionView.delegate = self
        collectionView.isScrollEnabled = false
        collectionView.dataSource = self
        collectionView.register(cvcSkills.self, forCellWithReuseIdentifier: self.skillsId)
        return collectionView
    }()

每个技能都在一个单元格中，其宽度根据单词的长度设置（如图所示）

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

    var width:CGFloat = 0

        // Width size calculated depending on the size of the text
        let skill = skills[indexPath.row]
        if let name = skill.name {

            let size: CGSize = name.size(withAttributes: [NSAttributedStringKey.font: UIFont.systemFont(ofSize: 14.0)])
            width = size.width + 30
        }
    }
    return CGSize(width: width, height: 40)
}

正如你所看到的，这些单元格之间的间距由于某种原因是任意的，我似乎无法使它们彼此具有相等的距离。

我试过设置这样的插图（这是我当前的代码，显示在图像中）：

    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.sectionInset = UIEdgeInsetsMake(0, 5, 0, 5)
    layout.invalidateLayout()
    collectionView.collectionViewLayout = layout

我也尝试将qazxsw poi和qazxsw poi设置为不同的值，但我仍然在每个单元格之间保持不同的大小空间。

关于如何让这些细胞相互间隔10个的任何想法。

答案

正如Fogmeister建议的那样，您需要创建自己的自定义流布局以支持此需求。

但是，如果需要，我有一个支持上述要求的流布局，即尝试minimumInteritemSpacing类型（还有其他类型）。

minimumLineSpacing

虽然我分享了它，但我建议您仔细阅读代码并亲自尝试。使用自定义流布局很有趣。