✅ 학습 내용
📌 ScrollView
💎 UIScrollView
A view that allows the scrolling and zooming of its contained views.
-
포함된 뷰를 스크롤하고 줌할 수 있는 뷰 입니다.
-
스토리보드에서 스크롤 뷰를 뷰 컨트롤러에 올리면 두 개의 레이아웃 가이드가 생기게 된다.
✏️ frameLayoutGuide
The layout guide based on the untransformed frame rectangle of the scroll view.
- 변형되지 않은 프레임을 기반으로 한 레이아웃 가이드입니다.
- 컨텐츠가 아닌 스크롤 뷰 자체의 프레임을 명시적으로 포함하는 오토 레이아웃 제약조건을 작성하려면 이 레이아웃 가이드를 사용한다.
- 실제로 스크롤 뷰가 보여지는 영역에 관한 레이아웃이다.
- 또, 실제 스크롤 뷰의 위치를 지정하는 레이아웃이기에 스크롤 뷰의 스크롤을 가로로 할지 세로로 할지 결정하는 것 역시 이 레이아웃 가이드를 기준으로 적용시켜 주면 된다.
✏️ contentLayoutGuide
The layout guide based on the untranslated content rectangle of the scroll view.
- 변형되지 않는 스크롤 뷰의 사갹형 콘텐츠를 기반으로 한 레이아웃 가이드 입니다.
- 스크롤 뷰의 콘텐츠 영역에 관련된 오토레이아웃 제약조건을 작성하려면 이 레이아웃 가이드를 사용한다.
- 콘텐츠의 레이아웃을 잡을 때는 이 가이드를 기준으로 잡으면 된다.
✏️ frame? content?
- 프레임과 컨텐츠의 차이가 무엇일까.
- 위 오토레이아웃 가이드의 설명에서 유추할 수 있듯, 프레임은 스크롤 뷰 자체의 크기를 결정하는 것이고, 컨텐츠는 그 스크롤 뷰가 담고 있는 컨텐츠들을 의미한다.
- 그림을 통해 보면 쉽게 이해할 수 있다.
- 스크롤 뷰는 결국 스크롤 뷰의 프레임보다 더 큰 컨텐츠를 나태낼 때 사용하는 뷰다. 그렇다면 결국 컨텐츠의 크기가 프레임의 크기보다 더 커야 스크롤이 가능해지는 것이다.
✏️ contentOffset
The point at which the origin of the content view is offset from the origin of the scroll view.
- 컨텐츠 뷰의 origin이 스크롤 뷰의 origin에서 오프셋되는 지점입니다.
- 여기서 origin은 모두 bounds의 origin을 의미하는 것이다.
- 좀 더 쉽게 말해 콘텐츠 뷰의 오리진 부터 스크린 뷰의 오리진이 얼마나 떨어져 있는가? 를 나타내는 프로퍼티이다.
- 이 역시 그림을 보면 쉽게 이해할 수 있다.
- 보통 앱에서 사용하는 스크롤은 세로스크롤인 경우가 많아 세로 스크롤로 그려보았다.
- 한번에 이해가 된다!
- 그렇다면 우리가 왜 스크롤을 맨 밑으로 내리도록 설정할 때 컨텐츠 사이즈에서 프레임이나 바운스를 빼는지 알 수 있다.
✏️ 코드를 이용해 맨 밑으로 스크롤 하기
scrollView.setContentOffset(CGPoint(x: 0,
y: scrollView.contentSize.height - scrollView.bounds.height),
animated: false)- 그림을 보고 코드를 보자. 이제 완벽하게 이해가 갈 것이다!
- 그리고,
bounds가 아니라frame을 써도 똑같이 작동할 것이라는 것 역시 우리는 이전에 공부한 내용을 토대로 알 수 있다.
scrollView.setContentOffset(CGPoint(x: 0,
y: scrollView.contentSize.height - scrollView.frame.height),
animated: false)UIScrollView
frameLayoutGuide
contentLayoutGuide
UIScrollView의 contentOffset 이해
[iOS] UIScrollView 다루기 (storyboard / programatically)
[iOS] scrollView 개념 부터 구현까지 뽀개기 - HoonIOS
