[SwiftUI] Grid에 대해서 알아보자

List?? Grid?

List는 UIkit에 테이블뷰와 거의 유사하고, Grid는 CollectionView라고 생각하면 이해하기 쉬운 것 같습니다.

가장 큰 차이점으로는 List는 수직스크롤만 가능하다는 점이고, Grid는 수직, 수평 스크롤 둘다 가능합니다.
수직은 LazyVGrid, 수평은 LazyHGrid를 사용합니다.

예시

1부터 99까지의 숫자들을 수직 형식으로 구현해보려 합니다.

Cell로 사용될 View를 다음과 같이 작성해주었습니다.

먼저 LazyVGrid로 수직 방향으로 스크롤이 되도록 구현하려 합니다.

그런데 [GridItem] 타입을 넣어주어야 하는군요.

LazyGrid의 layout을 구현하는 용도라고 합니다.

GridItem을 작성하려고 하니 다음과 같은 enum 타입의 무언가가 있군요...

음.. fixed는 고정된 값이란 건 알겠는데 adaptive랑 flexible이랑은 뭐가 다른지 잘 모르겠네요.

먼저 adaptive를 사용해서 최소 60만큼의 크기를 같도록 다음과 같이 작성하였습니다.

셀이 기기크기에 맞춰서 알아서 최소 60만큼으로 5개씩 쌓여있습니다.

다음은 flexible을 사용해보겠습니다.

5열로 맞추어주니 adaptive랑 동일하네요.

fixed로 60의 고정 값을 주면 어떻게 될까요?

위와 거의 비슷한 레이아웃을 띄고 있습니다.

이것들을 섞어서도 사용이 가능합니다.

첫번째 열에는 fixed로 100만큼의 고정 값을 주었고 나머지는 adaptive 최소 60의 크기로 유연하게 넣어라~ 라고 작성하였습니다.

100을 제외한 나머지 공간에 최소 60만큼의 크기가 4개가 들어갈 수 있어서 4개가 들어간 것을 확인할 수 있습니다.

마찬가지로 fixed랑 flexible을 사용해보았습니다.

첫번째 열에는 fixed로 100만큼 고정 값을 갖고있고, 두번째 열에서는 그냥 알아서 채우게 됩니다.

제가 생각하기에 flexible이랑 adaptive의 차이점으로는 adaptive는 한 줄만 작성하면 그 공간을 알아서 채우는 반면에,
flexible을 작성한 수 대로 채운다고 이해하였습니다.

틀린점이 있으면 댓글로 알려주시면 감사하겠습니다.