[iOS] UICollectionViewCompositionalLayout

UICollectionViewCompositionalLayout(Class)

적응력이 뛰어나고 유연한 시각적 배열로 item을 결합할 수 있는 Layout 개체

---

UICollectionViewCompositionalLayout의 구성

 

•  CompositionalLayout은 레이아웃을 별개의 시각적 Group으로 나누는 하나 이상의 Section으로 구성
• 각 Section을 표시하려는 데이터의 가장 작은 단위인 Item들의 Group으로 구성
• Group은 Item을 가로 행, 세로 열 또는 사용자 정의 배열로 배치할 수 있음

---

Layout 구성 코드

func createBasicListLayout() -> UICollectionViewLayout { 
    let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                  
                                         heightDimension: .fractionalHeight(1.0))    
    let item = NSCollectionLayoutItem(layoutSize: itemSize)  
  
    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),                                          
                                          heightDimension: .absolute(44))    
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,                                                   
                                                     subitems: [item])  
  
    let section = NSCollectionLayoutSection(group: group)    


    let layout = UICollectionViewCompositionalLayout(section: section)    
    return layout
}

---

Size

• Absolute(절댓값)
• Estimate(추정값)
• Fractional(비율)

// Absolute(절댓값)
let absoluteSize = NSCollectionLayoutSize(widthDimension: .absolute(44), 
                                          heightDimension: .absolute(44))
// Estimate(추정값)                                         
let estimatedSize = NSCollectionLayoutSize(widthDimension: .estimated(200), 
                                           heightDimension: .estimated(100))
// Fractional(비율)                                           
let fractionalSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.2),
                                            heightDimension: .fractionalWidth(0.2))

 

UICollectionViewCompositionalLayout | Apple Developer Documentation