UICollectionView FlowLayout左对齐失效问题求助

我之前也遇到过一模一样的问题！当使用estimatedItemSize时，UICollectionViewFlowLayout的默认布局逻辑确实会出现左对齐失效、元素居中还带空隙的情况——这是因为自动尺寸计算时，系统默认的FlowLayout没有正确处理行内元素的左对齐排列逻辑。下面是我亲测有效的解决方案：

1. 自定义左对齐FlowLayout子类 #

创建一个继承自UICollectionViewFlowLayout的子类，重写layoutAttributesForElements(in:)方法，手动控制每个单元格的位置，实现严格左对齐：

class LeftAlignedFlowLayout: UICollectionViewFlowLayout {
    
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        guard let originalAttributes = super.layoutAttributesForElements(in: rect) else {
            return nil
        }
        var leftMargin = sectionInset.left
        var maxY: CGFloat = -1.0
        let updatedAttributes = originalAttributes.map { attributes in
            let updatedAttribute = attributes.copy() as! UICollectionViewLayoutAttributes
            
            if updatedAttribute.frame.origin.y >= maxY {
                leftMargin = sectionInset.left
            }
            
            updatedAttribute.frame.origin.x = leftMargin
            leftMargin += updatedAttribute.frame.width + minimumInteritemSpacing
            maxY = max(updatedAttribute.frame.maxY, maxY)
            return updatedAttribute
        }
        return updatedAttributes
    }
}

2. 替换原有的FlowLayout #

把你原来使用的UICollectionViewFlowLayout替换成这个自定义的LeftAlignedFlowLayout：

代码方式初始化 #

let leftAlignedLayout = LeftAlignedFlowLayout()
leftAlignedLayout.estimatedItemSize = CGSize(width: 150, height: 35)
leftAlignedLayout.sectionInset = UIEdgeInsets(top: 8, left: 8, bottom: 0, right: 8)
leftAlignedLayout.minimumInteritemSpacing = 0
itemCollectionView.collectionViewLayout = leftAlignedLayout

Storyboard/Xib方式设置 #

如果是在界面编辑器里创建的UICollectionView，直接在Identity Inspector里把CollectionViewFlowLayout的类改成LeftAlignedFlowLayout，然后在代码里设置对应的属性即可。

3. 注意事项 #

• 确保不要在设置布局属性后重复调用invalidateLayout()，或者把调用时机放在布局属性设置完成之后；
• 如果你的单元格有动态高度，这个子类同样适用，只需要保证estimatedItemSize的高度设置合理即可；
• minimumInteritemSpacing的数值可以根据你的需求调整，代码里会自动按照这个值来控制单元格之间的空隙。

这样修改之后，你的UICollectionView就能实现真正的左对齐，sectionInset的左边距也会正常生效，单元格之间的空隙也会按照你设置的数值来显示啦！

内容的提问来源于stack exchange，提问作者Alexandre Baron