티스토리 뷰

iOS/iOS-AutoLayout

stack-view

malrang-malrang 2022. 4. 29. 19:17

stack-view

스택뷰 를 이해하기 위해 알고있어야 하는 개념들

  • compression Resistance (줄어들지 않으려고 버티는 힘)
  • Content hugging (늘어나지 않으려고 버티는 힘)

스택뷰의 개념들

  • axis
    • 가로(vertical), 세로(Horizontal)
  • distribution
    • 스택뷰 내부의 요소들을 어떻게 분배할것인지 설정할수 있다.
  • alignment
    • 위치에 대한 설정(정렬)
  • spacing
    • 사이의 간격

Stack-View Properties

distribution: UIStackView.Distribution

스택뷰 내부의 요소들을 어떻게 분배할것인지 설정할수 있다.

  1. .fill

내부의 요소 뷰들을 최대한 늘릴것이다.
어떤애가 얼만큼 늘어날것인지 고민이 필요하다.

  1. .fillEqually

내부 요소 뷰들을 모두 같은 사이즈로 설정

  1. .fillProportionally

자신의 콘텐츠 사이즈의 비율대로 채워주겠다.

  1. .equalSpacing

fill 과 비슷하게 동작함.
fill 에서 spacing 은 동일하게 가져가겠다.

  1. .equalCentering

각자 뷰의 중앙지점의 거리가 같다 라는뜻.
뷰가 4개라면 각 뷰의 중앙지점이 4개이며 각 중앙지점끼리의 거리가 모두 같게된다.

alignment: UIStackView.Alignment

위치에 대한 설정

  1. .fill

현재 예시는 가로 StackView 이다.
axis 의 반대방향으로 꽉채우겠다 라는뜻.

  1. .leading

세로 스택뷰에서 설정하게되면 왼쪽(leading) 에 정렬되게 된다.

  1. .top

가로 스택뷰일 경우 모든 뷰들이 top 에 맞춰 정렬 하게됨.

  1. .firstBaseline

    텍스트가 들어있는 뷰 들이 있을경우
    첫째줄의 기준으로 위치를 정렬해준다.
    (예시 이미지를 보는게 이해가 빠르다.)

  2. .center

말그대로 중앙 정렬이다.

  1. .traling

leading 의 반대
세로 스택에서 오른쪽으로 정렬해준다

  1. .bottom

가로 스택뷰에서 아래 bottom 에 맞게 정렬해준다.

  1. .lastBaseline

뷰의 콘텐츠 텍스트의 맨아랫줄을 기준으로 정렬해준다.

'iOS > iOS-AutoLayout' 카테고리의 다른 글

Programmatically Creating Constraints  (0) 2022.04.29
AutoLayout  (0) 2022.04.29
Interface Builder 의 도구들  (0) 2022.04.29
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/07   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31
글 보관함