Swift中自定义视图内UICollectionView添加到父视图后不显示如何解决？

问题原因总结 #

你代码里的问题主要出在布局计算时机和约束缺失两方面，具体问题如下：

• 1. 约束不完整导致布局计算失败
  GiftFilterView里的customInputView只设置了top、left、right三个约束，没有设置高度约束，AutoLayout无法确定其尺寸，后续依赖它底部锚点的collectionView位置也会异常。
• 2. 初始化阶段读取frame值不准确
  你在GiftFilterView的init方法中给collectionView设置宽度用了self.frame.size.width，但此时GiftFilterView刚被初始化，frame是.zero，等于直接把collectionView宽度设为0，自然无法显示。
  同理FlowLayout的sizeForItemAt方法里你用了self.frame.width计算cell宽度，此时frame值还未被AutoLayout更新，计算结果也是错的。
• 3. 尺寸设置冲突
  你给collectionView设置的固定高度是30，但FlowLayout返回的cell高度是40，cell高度大于父容器高度，内容会被截断无法正常显示。
• 4. cell宽度计算逻辑错误
  你设置了cell之间的最小间距为10，却直接用frame.width / 6计算cell宽度，6个cell加5个间距的总宽度会超过collectionView的宽度，导致cell换行，而collectionView高度不足就会看不到后续内容。

修复方案 #

1. 补全customInputView的高度约束，根据你的业务需求设置固定高度即可，示例：

customInputView.anchor(top: topAnchor, left: leftAnchor, right: rightAnchor, paddingTop: 5, height: 80)

2. 不要在init里用frame设置collectionView宽度，改为锚定right约束，同时修正collectionView高度和cell高度匹配：

// 原代码collectionView.anchor(top: customInputView.bottomAnchor, left: leftAnchor, paddingTop: 10)
// 新增right锚定，删除固定宽度设置
collectionView.anchor(top: customInputView.bottomAnchor, left: leftAnchor, right: rightAnchor, paddingTop: 10, height: 40)

3. 修正cell宽度计算逻辑，把间距纳入计算，同时使用collectionView的尺寸计算：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let totalSpacing = CGFloat(giftImageIcon.count - 1) * 10
    let cellWidth = (collectionView.bounds.width - totalSpacing) / CGFloat(giftImageIcon.count)
    return CGSize(width: cellWidth, height: 40)
}

4. 如果你需要视图尺寸变化时自动刷新布局，可以重写layoutSubviews方法：

override func layoutSubviews() {
    super.layoutSubviews()
    collectionView.collectionViewLayout.invalidateLayout()
}

5. 额外优化：在GiftAccessoryCollectionView中初始化filterView后，记得把代理赋值过去，否则后续点击事件无法响应：

private lazy var filterView: GiftFilterView = {
    let giftView = GiftFilterView()
    giftView.translatesAutoresizingMaskIntoConstraints = false
    // 补全代理传递
    giftView.delegate = self.delegate
    giftView.giftIcondelegate = self.giftIcondelegate
    return giftView
}()

内容的提问来源于stack exchange，提问作者Ios Developer