具有 3 列的 UICollectionView 不会产生所需的结果

Posted 2023-03-14

【中文标题】具有 3 列的 UICollectionView 不会产生所需的结果

【英文标题】：UICollectionView with 3 columns doesn't produce the desired result

【发布时间】：2018-10-11 18:33:52

【问题描述】：

我正在 iPhone XR 模拟器上对此进行测试。我有 3 行图像，我希望它们显示在 3 列中，距离顶部、左侧、右侧和底部 2 个点。这曾经有效，但由于某种原因它现在不起作用。

extension ProfileVC : UICollectionViewDelegateFlowLayout 
override func size(forChildContentContainer container: UIContentContainer, withParentContainerSize parentSize: CGSize) -> CGSize 
    return CGSize(width: collectionView.bounds.width / 3, height: collectionView.bounds.width / 3)


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


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

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets 
    return UIEdgeInsets(top: 2, left: 2, bottom: 2, right: 2)

这是我的结果：

【问题讨论】：

那么，您有 9 张图像，希望它们成为 3x3 网格，对吗？您是否希望图像与下一张图像之间都有 2 个点以及边缘周围有 2 个点？或者您是否希望图像相互接触，例如左侧的两个图像，并在图像组周围使用 2 点边框？

另外，您是否确认ProfileVC 实际上已设置为屏幕上集合视图中流布局的代表？ （即这些方法会被调用吗？）

@theMikeSwan 哦，伙计。谢谢你。这促使我检查我是否设置了我忘记的委托，因此我的方法从未被调用。

【参考方案1】：

尝试实现 sizeForItemAt indexPath 方法来修复三列的集合视图，仅根据屏幕宽度动态调整项目大小。 获取屏幕宽度或集合视图宽度，然后减去您喜欢的空格（8），然后除以 3（3 列）。 此外，从您的故事板或 nib 文件中设置 minSpacing for lines = 2 和 section insets for top = 2 并评论您的上述方法并仅实现此方法

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

【讨论】：

我忘了设置委托 (smh)。您的解决方案有效。谢谢