[Swift] [iOS] ScrollView (스크롤뷰) 를 사용해보자

JB
4 min readDec 10, 2020

--

개발을 하다보면 한 화면에 많은 정보를 넣어야 할 상황이 옵니다. 많은 정보를 담기위해서는 더 넓은 화면이 필요한데, 보여줄 수 있는 단말기의 화면 크기는 한정적이죠.

이럴때 스크롤을 통해 보여주고자 하는 정보들을 보여줄 수 있는게, ScrollView입니다!

정말 기초적인 화면이면서도, ScrollView에 친숙하지않으면 헤맬수도있어요.

[실습] 전체화면을 ScrollView로 만들기

스토리보드에 Scroll View를 먼저 추가해줍니다!

후에 ScrollView를 View의 크기에 맞게 재배치 해주시고

AutoLayout 설정을 위와같이 0,0,0,0으로 해줍니다.

그러면!

Scrollable content의 사이즈가 autolayout 처리가 잘 되지않아 위와같이 나옵니다. ~~ 괜찮아요~ 다음단계로 넘어가시죠!

이제 View를 찾아서

ScrollView에 위와같이 올려줍니다~!

그리고, 여기서 중요!! 합니다 !!

방금 올려준 뷰를 ScrollView에 Autolayout 관계를 맺어줍니다. 이때,

Leading, Top, Trailing, Bottom 그리고 Equal Widths와 Equal Heights까지 모두 체크해줍니다.~

그러면!

이렇게 Autolayout이 정상적으로 잡히게 됩니다.

이제 많은 데이터들을 담을 수 있는 Scroll View가 되었으니 크기를 키워봐야겠죠?

View Controller를 클릭 한 후에

Fixed로 되어있는 Size를

클릭하여 Freedom으로 클릭 해 주고,

원하는 크기로 사이즈를 맞춰줍니다!

사이즈가 커졌네요!

제가 간단한 백그라운드와 아래쪽에 Label을 하나 넣어주었어요.

하지만, 여기서 중요한점 2번째!

여기서 Height를 클릭해 준다음, Priority를 250으로 맞춰줍니다! (default값이 1000으로 되어있으면 ScrollView가 작동하지 않을 수 있어요)

자 이제 스크롤 뷰 구현된 (사고싶은)iPhone12 Pro Max 비디오를 보며 블로그 마치도록 하겠습니다!

--

--

JB
JB

Written by JB

iOS engineer @kakaobank

No responses yet