SwiftUI의 그리드 구축하기

멀티컬럼 그리드란 여러개의 열을 가지는 그리드 레이아웃을 의미한다 콘텐츠를 여러 열로 나누어 배치해 가독성을 높이고 공간을 효율적으로 사용할 수 있게 한다 swiftUI에서 LazyVGrid, LazyHGrid, GridItem의 세가지 뷰를 가지고 있다

SwiftUI의 그리드

LazyVGrid(columns: [GridItem], alignment: ‹horizontal alignment›,
spacing: CGFloat?, pinnedViews: <views>) {
  //콘텐츠 뷰
}

LazyVGrid에서는 colums 인수만 필수이고, GridItem은 배열 형태를 취한다

LazyHGrid(rows: [GridItem], alignment: ‹vertical alignment›,
spacing: CGFloat?, pinnedViews: <views>) {
  //콘텐츠 뷰
}

 

GridItem

그리드 레이아웃의 각 행 또는 열은 GridItem 뷰의 인스턴스를 포함한다 LazyVGrid, LazyHGrid 뷰 모두 GridItem 인스턴스를 가지고 각 열을 의미한다

GridItem(sizing, spacing: CGFloat?, alignment: <alignment>)

sizing 인수는 flexible, adaptive, fixed 중 하나로 선언되어야 한다

• flexible( ) : 그리드의 행, 열은 GridItem의 인수에 따라 정해진다
• adaptive(minimum: CGFloat) :