인프런 커뮤니티 질문&답변
작성한 질문수
HStack과 VStack에서 alignment와 spacing 방향이 이해가 잘 안갑니다.
해결된 질문
작성
·
21
·
수정됨
1
스킬 창 아래 부분은 HStack에 VStack(앉아, 엎드려, 하우스)과 VStack(손, 코) 두개의 VStack 구조로 되어 있잖아요.
여기서 alignment와 spacing 방향이 너무 혼동됩니다. 처음에 간단한 구조는 이해하는 것 같았거든요. 살짝 구조가 복잡해지니까 혼동됩니다.
우선 제가 이해하고 있는 부분은 아래와 같습니다.
HStack은 수평 구조이기 때문에 alignment는 top, center, bottom이고 spacing은 수평 간격이 조정되고
VStack은 수직 구조이기 때문에 alignment는 leading, center, tailing이고 spacing은 수직 간격이 조정 되는 것이 맞을까요?
혹시 맞다면 이 정도만 이해하고 있으면 될까요?
이 부분의 대한 설명 좀 부탁드려도 될까요?
답변 2
0
설명 너무 감사드립니다.
알려주신 방법으로 해보겠습니다. ^^
그리고 제가 인강에서 배운거 돌아서면 잊어버리고 해서 반복해서 코드 쳐보느라 진도가 많이 느린데요. 이 방법이 맞을까요? 퇴근하고 와서 swift 문법 강의랑 같이 하려는데 복습하느라 진도가 안나가네요. ㅠㅠ
0
안녕하세요 Alex kim님!
"HStack은 수평 구조이기 때문에 alignment는 top, center, bottom이고 spacing은 수평 간격이 조정되고
VStack은 수직 구조이기 때문에 alignment는 leading, center, tailing이고 spacing은 수직 간격이 조정 되는 것이 맞을까요?"
너무 정확히 이해하고 계십니다!!
개념은 정확히 알고 계신데 이해가 와닿지 않으시면 팁이 하나 있는데요.
HStack(alignment: .top, spacing: 30) {
VStack(alignment: .leading, spacing: 10) {
Text(" - 앉아")
.background(Color.yellow)
Text(" - 엎드려(앉아와 자주 혼동함)")
.background(Color.yellow)
Text(" - 하우스(집으로 들어가기)")
.background(Color.yellow)
}
.background(Color.blue)
VStack(alignment: .leading, spacing: 10) {
Text(" - 손")
.background(Color.yellow)
Text(" - 코")
.background(Color.yellow)
}
.background(Color.blue)
}
이렇게 각각 뷰에 background 색상을 넣고 spacing과 alignment를 조정해보면 이해하는데 도움이 될거 같습니다. 저도 뷰를 배치할때 이해가 안되면 저렇게 .background() 모디파이어를 넣어서 보거든요
한번 이렇게 해보시고 이해가 안되면 또 질문 주시기 바랍니다.
즐거운 코딩 되시기 바랄게요~
감사합니다.
따라만 치기보다는, 본인이 직접 구현해보시는걸 추천드립니다.
새로운 기능을 구현하기 보다는, 강의에서 구현했던 부분을 강의를 수강하신 다음에, 해당 부분의 코드를 지운 다음에, 강의 코드를 보지 않고 직접 구현하다보면, 자기껄로 만들기가 수월합니다.
처음에는 쉽지 않을 수 있는데, 하다보면 코드가 자기껄로 되는 느낌을 받으실 수 있으실거에요!
감사합니다