[오토레이아웃] ScrollView 기본

ScrollView

ScrollView는 일반적으로 view에 대한 오토레이아웃을 적용하는 것과 다르다. 그렇다면 어떻게 진행될지는 apple의 autolayout Guide를 참고할 수 있다.

1. 먼저 scene에 scrollview를 추가한다.

2. 그리고 scrollview를 오토레이아웃을 잡아준다. superview에 constraint를 잡아줘도 되고, safearea에 constraint를 잡아줘도 된다.

3. Scrollview안에 View 하나를 추가한다. 그리고 그것을 contentView라고 이름 짓는다.

4. Contentview를 scrollview에 맞게 오토레이아웃을 또 잡아준다. scrollview에 엣지에 우리는 contentview의 constraint를 잡아주면된다. 이 contentview가contentarea로 될 것이다. 

5. 이후에 우리는 scrollview가 위아래로만 scroll이 되고 싶어하기 때문에 contentview와 scrollview의 너비를 맞춰준다.

6. 그담에 contentview에 우리가 원하는 view를 넣어준다. 아래에서는 label 하나를 넣어줬다. 이렇게 된다면, scrollview에 label 하나만 있는 그런 화면이 생성된다.

scrollview를 superview와 맞출때 / scrollview를 safearea와 맞출때

scrollview의 오토레이아웃이 까다로운 이유는 다음과 같다.

scrollview는 자신이 움직일 수 있는 영역을 contentsize라고 한다. 하지만, scrollview의 contentsize가 지정되지 않는다면, 계속 오토레이아웃에서 빨간줄이 생기게 된다. 왜냐면 안에 아무것도 설정되지 않는다면 scroll을 내릴수도 없기 때문이고, contentsize도 없기 때문이다. 

scrollview를 만든다면 다음과 같은 2가지가 생긴다.

여기서 Content Layout Guide는 컨텐츠가 들어가 있는 영역을 의미한다. 그리고 Frame layout Guide는 현재 scrollview가 실제로 위치하는 frame 영역이다. 이 둘의 차이가 어떤 것이냐면, Content Layout Guide가 content가 길어져서 Frame Layout Guide를 넘어선다면, scroll을 내릴 수 있게 해준다.

하지만 여기서 중간에 스크롤에도 내려가지 않는 view를 만들고 싶다면??? 어떻게 해야할까?? 고정적인 뷰는 어떻게 해야할까? 이때는 view를 하나 만든다음, Frame Layout Guide와 constraint를 맺어주면된다.