[Unity] Scroll View 내용에 맞게 크기 조절하기

Scroll View를 사용하다보면 스크롤이 끝까지 되지 않고, 돌아온다 거나 하는 현상이 일어나고는 한다.

이는 Content의 크기가 충분히 크지 않기 때문이다.

 

Scroll View에서 Content의 크기

위의 흰색 실선과 같이 Content의 크기가 설정되어 있다면 Scroll View는 아주 약간 수직으로 스크롤 되고, 수평방향으로는 아무리 스크롤을 해도 제자리로 돌아오게 된다.

 

따라서 스크롤 되기 원하는 만큼 Content의 크기를 키워줘야 하는 것이다.

 

가로의 크기를 키워줬더니 수평 스크롤바에 스크롤 공간이 생겼다.

가로의 크기를 키웠더니 수평 방향 스크롤바에 스크롤 가능한 공간이 생긴 것을 확인할 수 있다.

이와 같이 스크롤 영역은 Viewport를 넘어가는 Content 영역의 크기만큼 생긴다고 볼 수 있다.

 

---

 

그렇다면, 이 스크롤 영역이 게임 내에서 동적으로 바뀌어야한다면 어떻게 구현해야할까?

가령 내가 추가한 리스트의 크기만큼 스크롤 영역의 크기가 설정되어야만 한다면?

 

어렵게 코드로 구현하는 방법도 있지만, 보다 간단하게 Content Size Fitter 라는 컴포넌트를 활용하는 방법이 있다.

 

Content에 컴포넌트를 추가하자.

여기서 3가지 설정이 있다.

 

Unconstrained (설정하지 않음.)	Content 크기에 관여하지 않으므로 수평과 수직 모두 이것으로 설정했다면 컴포넌트를 추가하기 전이나 후나 같다.
Min Size (최소 사이즈)	Content에 들어있는 콘텐츠의 사이즈에 딱 맞게 설정된다. 주로 아이템 리스트 등에 사용된다.
Preferred Size (권장 사이즈)	Content에 들어있는 콘텐츠에 맞게 사이즈를 알아서 적당히 설정해준다. 주로 텍스트만 들어있는 Content에 사용된다.

 

내가 사용할 리스트의 특성에 맞게 설정해 주면 되겠다.

다만, 여기서 주의할 점은 Content의 크기가 게임의 진행이나 내용에 따라 동적으로 변하는 것이 아니라면, 수동으로 Content 크기를 설정해주는 것이 Content Size Fitter를 사용하는 것보다 최적화 측면에서 낫다.

 

Content Size Fitter를 남발할 경우 최적화 이슈를 불러올 수 있으니, 예시를 잘 보고 내가 Content Size Fitter를 적용해야하는지 아닌지 판단하여 적용하도록 하자.

Content Size Fitter를 사용해야하는 상황의 예시는 다음과 같다.

공지사항 글 리스트 - 공지사항이 추가될 때 마다 동적으로 변경되어야 한다.

다음 티어까지만 표시해주는 연구트리 리스트 - 하나의 연구를 마치면 다음 연구가 보여지면서 리스트가 추가되어야 한다.

동적 상점 리스트 - 상점에 아이템이 추가된다면 리스트가 추가되어야 한다.

 

Content Size Fitter를 사용하지 않아도 되는 상황의 예시는 다음과 같다.

모든 티어를 표시해주는 연구트리 리스트 - 연구 트리의 길이가 동적으로 변하지 않는다.

정적 상점 리스트 - 상점에 아이템이 추가될 가능성이 없다면 길이가 동적으로 변하지 않는다.