今天會是要講在UICollectionView的排版，通常會搞得一頭霧水到底那些參數要在哪邊使用
所以今天要介紹能夠用來簡單排版的UICollectionViewDelegateFlowLayout

// 首先先讓目前連結在tableViewCell上的collectionView的delegate = self
collectionView.delegate = self

// 讓tableViewCell繼承 UICollectionViewDelegateFlowLayout
extension ExampleTableViewCell: UICollectionViewDelegateFlowLayout {
    
}

建立統一的Struct方便參數統一管理

struct CellSetting {
    static let hspacing: CGFloat = 10
    static let size: CGSize = CGSize(width: 100, height: 140)
}

設定參數

extension ExampleTableViewCell: UICollectionDelegateFlowLayout {
    // 每個Cell的Size
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CellSetting.size
    }

    // 每個Cell彼此的間距（horiziontal
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return CellSetting.hspacing
    }
    // 每個Cell彼此的間距（vertical
    // 不過這次沒用到就簡單秀一下
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat{}
    
    // 可以設定Inset
    func collectionView(UICollectionView, layout: UICollectionViewLayout, insetForSectionAt: Int) -> UIEdgeInsets{}
}

就能得到自己所期望的編排方式

參考資料

https://developer.apple.com/documentation/uikit/uicollectionviewdelegateflowlayout

坑：
之前有遇過一個案例，因為每個CollectionViewCell的Size其實不太一樣，就變成需要手動去計算寬度，然後因為很多個CollectiontionViewCell，但是因為每個CollectionView大小各異造成每一行的Cell位置都會隨意分散，看起來不整齊，上網找了方法才發現要使用UICollectionViewFlowLayout去讓Cell置左，分享給有同樣困擾的人

建立Class繼承UICollectionViewFlowLayout

class LeftAlignedCollectionViewLayout: UICollectionViewFlowLayout {
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        let attributes = super.layoutAttributesForElements(in: rect)
        var leftMargin = sectionInset = sectionInset.left
        var maxY: CGFloat = -1.0
        attributes?.forEach { layoutAttribute in
            if layoutAttribute.frame.origin.y >= maxY {
                leftMargin = sectionInset.left
            }                             
            layoutAttribute.frame.origin.x = leftMargin
            leftMargin += layoutAttribute.frame.width + minimumInteritemSpacing
            maxY = max(layoutAttribute.frame.maxY, maxY)
        }
        return attributes
    }
}

再把Class套用在目前在使用的UICollectionView

@IBOutlet weak var tagCollectionView: UICollectionView! {
    didSet {
        let flowLayout = LeftAlignedCollectionViewFlowLayout()
        tagCollectionView.collectionViewLayout = flowLayout
        
    }
}

就可以實現靠左對齊了