Unity UI - 스크롤을 넣어주는 Scroll View 사용하기

유니티 UI에는 Scroll Rect라는 컴포넌트가 있습니다.

우리가 평소 알고 있는 그 스크롤을 지원해주는 유용한 기능입니다.

오브젝트에 스크롤 바랑 Scroll Rect 컴포넌트를 넣어서 처음부터 하나하나 쌓아가기보단

차라리 Scroll View 오브젝트를 하나 생성해 그 오브젝트를 편집하는 것을 추천합니다.

 

Scroll View 오브젝트를 생성하면 뷰포트와 스크롤바 2개가 한 세트로 생성됩니다.

Scroll Rect에서 수직,수평 스크롤 여부를 설정할 수 있습니다.

그러나 체크를 해제해도 해당 스크롤 바가 자동으로 꺼지긴 않기 때문에 직접 스크롤바를 비활성화 하면 됩니다.

 

Movement Type-Unrestricted

 

내부 이동에 제한이 없습니다.

컨텐츠 영역 외부까지 마음껏 이동이 가능합니다.

 

Movement Type-Elastic

 

영역 이동에 약간의 제약이 있습니다.

가장자리 너머까지 이동하며 약간 튕기듯이 돌아옵니다.

전자기기를 자주 사용하신 분들이라면 익숙한 형태일 듯합니다.

 

 

마지막으로 Clamped는 해당 영역 외부를 벗어날 수 없습니다.

현재 Content 영역 내부는 이미지만 추가하고 사이즈 조절 등을 하지 않아 Clamped 상태에서는 스크롤이 작동하지 않습니다.

이 때 저번 포스팅에서 설명했던 Layout과 Size Fitter를 활용하면 스크롤 오브젝트의 내용 칸인 Content 사이즈가 자동으로 설정되어 정상적으로 스크롤이 가능하도록 만들 수 있습니다.

 

여하튼 Clamped 상태의 스크롤 모습입니다.

내용 바깥으로 나가지 못하는 모습을 보입니다.

 

 

스크롤 뷰를 처음 사용해보신 분들은 위 움짤처럼 쥐똥만한 스크롤 속도에 경악을 금치 못하셨을 수도 있습니다.

스크롤 속도를 조절하는 Scroll Sensitivity를 약 60 정도로 설정하는 것을 추천드립니다.

 

그 아래 스크롤바에 관련된 옵션들입니다.

 

설명을 위해 수평 스크롤 옵션을 해제해 놓겠습니다.

 

Visibility를 Permanent로 설정하면 스크롤 해제한 축의 스크롤바가 자동으로 사라집니다.

솔직히 Visibility의 다른 옵션들은 별 기능을 모르겠습니다.

아무튼 별거 없겠죠.