iPhone 7/8 Plus、7/8s及X机型UICollectionView布局适配问题求助

嘿，这个问题我之前帮好几个开发者排查过，大概率是iPhone X及以后机型的**安全区域（Safe Area）**适配没做好导致的，给你几个针对性的解决方向，一步步来应该就能搞定：

1. 先检查Auto Layout约束的参考系 #

如果你是用Auto Layout给UICollectionView加约束，一定要确保约束是连到safeAreaLayoutGuide，而不是直接连到superview的边缘。iPhone X及以后机型有顶部刘海和底部Home Indicator，直接连superview会导致内容被遮挡或者间距异常。

举个代码示例：

// 正确的约束写法（Swift）
collectionView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true
collectionView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor).isActive = true
collectionView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor).isActive = true
collectionView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor).isActive = true

如果是用Storyboard/XIB，在添加约束时选择“Safe Area”作为参照，而不是“Superview”。

2. 动态调整UICollectionViewFlowLayout的内边距 #

如果你的布局用的是UICollectionViewFlowLayout，可以根据设备的安全区域动态调整section的内边距，比如给有底部Home Indicator的机型额外增加底部内边距：

let flowLayout = UICollectionViewFlowLayout()
// 基础内边距（和iPhone 8 Plus上正常的内边距一致）
var sectionInsets = UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)

// iOS 11及以后支持安全区域判断
if #available(iOS 11.0, *) {
    let bottomSafeInset = view.safeAreaInsets.bottom
    // 如果底部有安全区域（比如iPhone X及以后），就把底部内边距加上这个值
    if bottomSafeInset > 0 {
        sectionInsets.bottom += bottomSafeInset
    }
}

flowLayout.sectionInset = sectionInsets
collectionView.collectionViewLayout = flowLayout

3. 确保ItemSize的计算基于可用空间 #

如果你是手动计算CollectionView Cell的大小，一定要用CollectionView的可用宽/高（也就是减去内边距和安全区域后的尺寸），而不是直接拿屏幕尺寸来算。比如2列布局的计算：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    guard let flowLayout = collectionViewLayout as? UICollectionViewFlowLayout else {
        return CGSize(width: 0, height: 0)
    }
    // 计算可用宽度：CollectionView宽度 - 左右内边距 - 列间距
    let availableWidth = collectionView.bounds.width 
                        - flowLayout.sectionInset.left 
                        - flowLayout.sectionInset.right 
                        - flowLayout.minimumInteritemSpacing
    // 2列布局，所以每个item的宽度是可用宽度除以2
    let itemWidth = availableWidth / 2
    // 保持和iPhone 8 Plus上一致的宽高比
    return CGSize(width: itemWidth, height: itemWidth * 1.5)
}

4. 检查contentInsetAdjustmentBehavior属性 #

iOS 11及以后，UICollectionView新增了contentInsetAdjustmentBehavior属性，默认是.automatic，会自动根据安全区域调整内容内边距。如果这个自动调整影响了你的布局，可以根据需求修改：

if #available(iOS 11.0, *) {
    // 只在滚动轴方向上调整内边距，适合需要滚动的布局
    collectionView.contentInsetAdjustmentBehavior = .scrollableAxes
    // 如果不需要自动调整，可以设置为.never，但不推荐，尽量配合安全区域适配
    // collectionView.contentInsetAdjustmentBehavior = .never
}

如果以上方法都试过还是有问题，建议你在viewWillLayoutSubviews方法里重新刷新布局，确保设备旋转或者屏幕尺寸变化时，CollectionView能重新计算布局：

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

内容的提问来源于stack exchange，提问作者veerendra pratap singh