🐶 개요
✔️ Scroll view는 frame과 content 2개의 size/position을 각각 지정해줘야 합니다
(Scroll view <-> 외부 object간 constraint는 frame을 대상으로 설정됩니다)
✔️ Scroll view <-> 내부 content간 constraint는 attribute에 따라 다르게 동작합니다
-
scroll view의 edge/margin <-> 내부 content
: scroll view의 content area를 대상 -
scroll view의 height/bottom/center <-> 내부 content
: scroll view의 frame area를 대상
✔️ 내부 content <-> 외부 object 간 fix position constraint를 사용할 수 있습니다
이 방법은 content가 scroll view를 떠다니는 것처럼 보이게 만듭니다
🐱 Scroll view 오토레이아웃 메뉴얼 (Interface Builder)
1. scene에 scroll view 추가
2. scroll view의 size/position 정의
(내부 content가 없어 아직은 빨간 줄 발생)
3. content view를 scroll view에 추가
4. content view의 top/bottom/leading/trailing edge를 scroll view의 edge에 고정
이때 content view가 scroll view의 'content area'를 정의하게 됩니다
content view는 아직 고정된 size를 갖지 않습니다. 내부에 content를 배치하면서 확장될 수 있습니다
5. (Optional) scroll 하지 않을 방향에 대해선, content view와 scroll view의 width 혹은 height를 같게 만듭니다
6. content view 안에 content를 놓습니다. content view 내에서의 position을 잡기 위해 constraint를 걸어줍니다
🐭 Content intrinsic size로 설정하기
당신의 layout은 content view의 size를 완전히 정의해야 합니다.
✔️ height를 content instrinsic size로 설정하려면
content view의 top edge에서 bottom edge까지 constraints와 views가 끊기지 않도록 체인 형태로 걸고 늘어날 수 있도록 해야 합니다
✔️ width를 content instrinsic size로 설정하려면,
유사하게, leading부터 trailing까지 체인을 이어야 합니다
✔️ 만약 content가 intrinsic size를 갖고 있지 않다면,
content view나 content에 적절한 size constraint를 걸어야 합니다
✔️ content view가 scroll view보다 크면 scroll 기능 활성화
content view가 scroll view보다 길면 자동으로 vertical scroll 기능이 활성화됩니다
마찬가지로, content view가 scroll view보다 넓으면 자동으로 horizontal scroll 기능이 활성화됩니다
content view가 작은 경우에는 scroll이 비활성화됩니다
