SwiftUI - Stack(HStack, Vstack, ZStack)

HStack(수평)

내부에 선언된 View들을 Leading에서 Trailing으로 배치한다. (배치 방향 : Leading -> Trailing)

 

VStack(수직)

내부에 선언된 View들을 Top에서 Bottom으로 배치한다. (배치 방향 : Top -> Bottom)

 

ZStack

내부에 선언된 View들을 겹쳐서 두 축으로 배치한다. (먼저 선언된 View가 뒤에 배치됨)

 

 

Stack 크기 변경

Stack의 크기는 내부 View를 표시하기 위한 최소한의 크기로 표시된다. (너비와 폭이 가장 큰 View에 의해서 프레임이 맞춰진다.)

 

Stack의 Frame을 직접 지정해주고 싶을 경우

.frame이라는 modifier를 이용해서 직접 설정해줄 수 있음

 

HStack {

	// …

}
.frame(width: 300, height: 300)

 

 

Stack내의 정렬 방식(alignment) 변경하기

Stack의 기본정렬은 .center

Stack을 생성할 때 파라미터 값으로 alignment를 직접 설정 가능

 

VStack(alignment: .trailing) {
	// …
}

 

 

Stack 내의 여백(spacing) 크기 변경하기

Stack 내부의 View 간격 간의 여백을 지정하는 spacing이란 파라미터의 기본 값은 nil인데

이때 nil은 0이 아니라 기본 값이다.

Stack을 생성할 때 파라미터 값으로 spacing을 설정 가능

 

HStack(spacing: 0) {
	// …
}

 

 

 

[참고 : https://babbab2.tistory.com]