[SwiftUI] Stack

 

출처 : 스윗한 SwiftUI (이봉원 저, 비제이퍼블릭)

 

 

Stack

---

- SwiftUI에서 뷰를 배치하는 데 사용하는 컨테이너 뷰

- UIKit에서 UIStackView와 같은 역할

- 세 종류의 Stack

1. HStack(Horizontal) : 가로 방향
2. VStack(Vertical) : 세로 방향
3. ZStack(Depth) : 뷰 계층을 겹겹이 쌓아 올리는 형태로 배열
   ※ offset 수식어로 다른 뷰를 이동해야 함

 

 

왼쪽부터 HStakck, VStack, ZStack

 

- 생성자 : alignment(정렬), spacing(간격), content

 

- alignment(Top)

- alignment(Center)

 

 

-alignment(Bottom)

 

 

 

- spacer

 

- VStack, ZStack도 HStack처럼 사용

 

 

- VStack Spacer

 

- HStack과 ZStack을 결합하여 사용

 

 

- ZStack(아래 예시는 동일한 사이즈기 때문에 하나의 Object로 보임)

 

 

 

 

 

Overlay, Background vs ZStack

---

- overlay : 뷰 원본의 공간을 기준으로 그 위에 새로운 뷰를 중첩하여 쌓는 기능

- backgroud : overlay와 마찬가지로 뷰 원본의 공간을 기준으로 뷰를 중첩하지만 아래 방향으로 쌓아나간다는 점이 다름

overlay

 

Zstack