UIScrollView XIB와 스토리보드에서 AutoLayout으로 구현하기

iOS에서 XIB를 사용해서 UIUIScrollView 구현을 하는 방법입니다.

간만에 하려니 잘 않되서 공유차원에서 올립니다.

AutoLayout사용되었으니 참고하시면 좋겠습니다.  

아래 예제는 XIB로 하고 있는데 스토리보드도 동일하게 적용이 가능합니다. ^^

환경은 

macOS Sierra 10.12.2

Xcode 8.2.1에서 테스트 하였습니다.

아래 설명하는 절차를 따라하여 완성되면 다음과 같이 되는데

View > Scroll View > Content View 의 구조입니다.

Content View도 편의상 이름만 변경한 View 이니 헷갈리지 마시기 바랍니다.

Content View에 올리고 싶은 UI를 마음껏 구현하시면 됩니다. ^^ 

스크롤뷰에 선택하고 오토레이아웃 핀메뉴를 선택합니다.

상하좌우를 선택하여 빨갛게(^^?) 하시구요.

Add Constraints 합니다.

Content View 선택하고 핀메뉴 선택하여

상하좌우 선택하고

Width, Height를 필요한 만큼 잡아 놓습니다.

Add Constraints 합니다.

Contents View에 오른쪽 클릭하면서 ( 터치패드에서는 콘트롤키를 누르기)

Contents View => View로 드래그하여 끌어다 놓습니다.

Equal Widths 를 선택합니다.

다시한번 Contents View에 오른쪽 클릭하면서 ( 터치패드에서는 콘트롤키를 누르기)

Contents View => View로 드래그하여 끌어다 놓습니다.

Equal Heights를 선택합니다.

가장 상위의 Constraints에서

Content View.height = height를 선택하고

우측의 Attributes Inspector를 선택하고

Priority에서 Low (250)을 선택합니다.

완성된 결과 입니다. ^^

보너스로 UIScrollView의 delegate설정을 알려드리겠습니다. ^^

코드로 하신다면 scrollview.delegate=self;

하시면 되겠지만 Interface Builder XIB나 스토리보드를 사용하는경우는 아래처럼 해야 합니다. ^^ 

스크롤뷰를 File's Owner까지 오른쪽 클릭으로 끌어다 놓습니다.

스토리보드를 쓰신다면 노란색 동그라미 아이콘(ViewController)에 갖다 놓으면 됩니다.

Outlets > delegate를 선택하면 끝입니다.

아래는 구현되었을때 스크롤이 정상적으로 되는 걸 캡쳐한 동영상이니 참고하세요. ^^