Unity ScrollView 사용 가이드
이 문서에서는 Unity의 ScrollView에 대해 설명하고, 이를 활용하는 방법 및 예제를 제시하겠습니다.
ScrollView 개요
ScrollView는 콘텐츠를 스크롤할 수 있는 영역에 표시합니다. ScrollView에 콘텐츠를 추가하면, 해당 콘텐츠는 ScrollView의 콘텐츠 컨테이너에 추가됩니다.
주요 기능
- 스크롤 방향 설정: 수직(Vertical) 또는 수평(Horizontal)로 스크롤 방향을 설정할 수 있습니다.
- 스크롤바 표시 관리: 스크롤바의 표시 여부를 조정할 수 있습니다.
- 스크롤 속도 조정: 스크롤 속도를 제어하는 다양한 옵션 제공.
속성 설정
- 스크롤 방향을 설정하려면, UI 빌더의 인스펙터 창에서 아래 옵션 중 하나를 선택합니다:
- Vertical (기본값)
- Horizontal
- Vertical and Horizontal
- 스크롤 속도 조정은 아래 코드를 사용하여 설정할 수 있습니다:
:root {
--unity-metrics-single_line-height: 500px;
}
ScrollView 안에 요소 래핑
ScrollView 안의 요소를 다음과 같이 래핑할 수 있습니다:
- ScrollView의 콘텐츠 컨테이너 플렉스 방향을 행으로 설정합니다.
- 플렉스 래핑을 래핑으로 설정합니다.
.unity-scroll-view__content-container {
flex-direction: row;
flex-wrap: wrap;
}
예제: 콘텐츠 래핑
ScrollView 안에 콘텐츠를 래핑하는 방법은 다음과 같습니다. 레이블 요소의 텍스트 래핑도 동일한 로직으로 진행됩니다.
- 레이블 인스펙터 확인: Text > Wrap > normal 선택.
- 스타일 적용: USS, UXML, C#에서
white-space: normal;
스타일을 레이블 요소에 적용.
C# 클래스 및 네임스페이스
- C# 클래스: ScrollView
- 네임스페이스: UnityEngine.UIElements
- 기본 클래스: VisualElement
ScrollView 구성원 속성
Name | Type | 설명 |
---|---|---|
elasticity | float | 사용자 스크롤 시 탄력도 |
horizontal-page-size | float | 가로 스크롤 속도를 제어 |
vertical-page-size | float | 세로 스크롤 속도를 제어 |
scroll-deceleration-rate | float | 스크롤 이동 감속도 설정 |
mouse-wheel-scroll-size | float | 마우스 스크롤 시 속도 제어 |
horizontal-scroller-visibility | UIElements.ScrollerVisibility | 가로 스크롤바 표시 여부 |
vertical-scroller-visibility | UIElements.ScrollerVisibility | 세로 스크롤바 표시 여부 |
mode | UIElements.ScrollViewMode | ScrollView의 스크롤 방법 제어 |
USS 클래스
다음 표는 ScrollView에서 사용되는 C# 프로퍼티와 관련된 USS 선택자입니다.
C# 프로퍼티 | USS 선택자 | 설명 |
---|---|---|
ussClassName | .unity-scroll-view | ScrollView 요소의 USS 클래스명 |
horizontalVariantContent | .unity-scroll-view__content-container--horizontal | 가로 모드일 때 추가되는 클래스명 |
verticalVariantContent | .unity-scroll-view__content-container--vertical | 세로 모드일 때 추가되는 클래스명 |
verticalHorizontalVariantContent | .unity-scroll-view__content-container--vertical-horizontal | 가로 및 세로 모드일 때 추가되는 클래스명 |
결론
ScrollView를 활용하면 UI 요소를 효과적으로 배치하고 스크롤 가능한 콘텐츠를 표시할 수 있습니다. 위에서 설명한 방법을 통해 다양한 UI 구성 요소를 구현하시기 바랍니다.
추가적으로 Unity 공식 문서와 커뮤니티 자료를 참고하여 더 많은 예제를 찾아보는 것을 추천드립니다.