[IOS] 오토레이아웃 - ScrollView, StackView

Thursday. April 04, 2019

오토레이아웃 (AutoLayout)

오토레이아웃이란?
두개의 뷰 사이의 관계를 제약 조건(Constraints) 이라는 것을 이용하여
뷰의 위치 혹은 크기를 지정하는 것이다.

쉽게 말하자면, A B C 라는 사람(뷰)이 있으면
A는 왼쪽 벽에 딱 붙어 있어야한다는 조건,
C는 오른쪽 벽에 딱 붙어 있어야한다는 조건,
B는 A의 오른쪽에서 3m 떨어지고
C의 왼쪽에서 5m 거리에 있어야 한다는 조건을 걸어서
A B C 사람(뷰)들의 각 위치를 알 수 있고
사람(뷰)들의 움직일 수 있는 행동반경(크기)를 지정할 수 있다.

오토레이아웃의 장점

화면 회전 혹은 기기 해상도 어디에든 잘 맞게 화면이 구성된다.
유지보수성이 뛰어나진다.

스크롤뷰 (ScrollView)

스크롤뷰는 안에 있는 콘텐츠가 자신보다 커져야 스크롤이 가능하다.

스크롤뷰에서 오토레이아웃을 사용하는 것은 이제껏 적용해왔던 방법과는 다르다.
이전까지는 기준이 되는 뷰에서와 자신에게 제약조건을 적용해 오토레이아웃을 사용했는데
이 방법은 기준이 되는 뷰의 크기 혹은 위치를 정확하게 알 수 있을 때 가능한 방법이다.

하지만 스크롤뷰는 스크롤이 가능해서
스크롤뷰의 크기가 무한으로 커질 수 있기 때문에
기존의 적용해왔던 방법으로는 부족한 점이 있다.

그래서 스크롤뷰에서 오토레이아웃을 사용하는 방법은 무엇이냐?

스크롤뷰 콘텐츠들을 감싸줄 콘텐츠 래퍼뷰(Contents Wrapper)를 만들어서
콘텐츠들을 감싸준 콘텐츠 래퍼뷰를
스크롤뷰 내부에서 꽉차게끔 상하좌우의 제약조건을 걸고
스크롤뷰와 높이가 같게끔 제약조건을 걸어주면
이전까지 사용하던 오토레이아웃 적용 방법을 사용할 수 있다.

하지만, 이럴 경우 콘텐츠들이 많아져서 스크롤뷰보다 더 커질 경우
스크롤뷰와 높이가 같다고 제약조건을 걸었기 때문에
스크롤이 안 되는 문제가 생긴다.

이 문제를 해결하기 위해서는
아까 걸었던 스크롤뷰와 컨텐츠 래퍼뷰의 높이가 같다는 제약조건의
priority(우선순위) 를 낮게 잡아주면
콘텐츠들이 많아져도 스크롤이 가능해지게 된다.