ScrollingFrame은 사용자 정의 가능한 캔버스와 스크롤 바로 구성되어 있으며, 내장된 스크롤 상호작용과 스크롤 작동 방식을 사용자 정의하는 다양한 방법을 제공합니다. ScrollingFrame은 제한된 공간에서 많은 정보를 표시하는 데 이상적이며, 목록 및 그리드 레이아웃과 잘 작동합니다.
캔버스
캔버스는 ScrollingFrame의 주요 영역으로, 다른 GuiObjects를 포함할 수 있습니다. 스크롤 동작은 다음 시나리오에서 자동으로 조정됩니다:
| 프레임 설정 | 결과 |
|---|---|
| 프레임의 CanvasSize가 전체 높이보다 더 높습니다. 구체적으로, 총 CanvasSize.Y가 총 Size.Y를 초과합니다. | 수직 스크롤이 활성화되고 수직 스크롤 바가 나타납니다. |
| 프레임의 CanvasSize가 전체 너비보다 더 넓습니다. 구체적으로, 총 CanvasSize.X가 총 Size.X를 초과합니다. | 수평 스크롤이 활성화되고 수평 스크롤 바가 나타납니다. |
| 프레임의 AutomaticCanvasSize가 Y 또는 XY로 설정되어 있고, 내용(자식 GuiObjects)의 총 높이가 총 Size.Y를 초과합니다. | 수직 스크롤이 활성화되고 수직 스크롤 바가 나타납니다. |
| 프레임의 AutomaticCanvasSize가 X 또는 XY로 설정되어 있고, 내용(자식 GuiObjects)의 총 너비가 총 Size.X를 초과합니다. | 수평 스크롤이 활성화되고 수평 스크롤 바가 나타납니다. |
CanvasPosition 속성은 캔버스의 현재 위치 오프셋을 픽셀 단위로 반영하며, 이에 따라 스크롤 바의 위치를 설정합니다. 이 속성은 스크롤 바가 보이지 않는 경우에는 아무런 작용을 하지 않습니다.
인셋
스크롤 프레임의 CanvasSize는 VerticalScrollBarInset 및/또는 HorizontalScrollBarInset 속성의 영향을 받을 수 있습니다. 다음 예제 다이어그램에서, 수직 스크롤 프레임은 캔버스 너비가 100%입니다. VerticalScrollBarInset가 None(기본값)으로 설정되면, 캔버스는 스크롤 프레임의 전체 너비로 확장되어 스크롤 바 아래에 약간의 내용이 가려집니다. 반대로, VerticalScrollBarInset 설정이 Always 또는 ScrollBar인 경우, 캔버스는 ScrollBarThickness만큼 인셋되어 스크롤 바와 가장자리가 맞닿습니다.
스크롤 바
프레임의 스크롤 바는 현재 캔버스 위치를 반영하고 자동 드래그-투-스크롤 상호작용을 제공합니다. 수직 스크롤 바의 경우, VerticalScrollBarPosition 속성은 바의 위치를 캔버스의 왼쪽 또는 오른쪽으로 전환하지만, 수평 스크롤 바는 캔버스 아래에만 위치할 수 있습니다.
스크롤 바 구성은 세 가지 자산 속성으로 이루어져 있습니다:
- TopImage — 수직 스크롤 바의 상단 또는 수평 스크롤 바의 왼쪽에 표시됩니다(수평 스크롤 바의 경우 90° 반시계 방향으로 회전).
- BottomImage — 수직 스크롤 바의 하단 또는 수평 스크롤 바의 오른쪽에 표시됩니다(수평 스크롤 바의 경우 90° 반시계 방향으로 회전).
각 이미지는 ScrollBarThickness 속성에 따라 크기가 조정되며, 이는 수직 스크롤 바의 너비 또는 수평 스크롤 바의 높이를 변경합니다.
추가적인 시각적 수정은 ScrollBarImageColor3 및 ScrollBarImageTransparency 속성을 통해 이루어질 수 있으며, 이는 바의 이미지 자산에 색조를 추가하고 불투명도를 수정합니다.
클리핑
기본적으로, GuiObject 컨테이너는 ClipsDescendants 부울을 통해 그 내용(하위 GuiObjects)을 클립합니다. 하위 요소가 컨테이너의 경계 밖에 나타나기를 원한다면, 단순히 ClipsDescendants를 false로 설정하면 됩니다.
중요하게도, 회전된 하위 요소(0이 아닌 Rotation)에서 클리핑이 작동하려면 StarterGui.ClipsDescendantsSupportsRotation가 true여야 합니다. 그러나 회전된 컨테이너(클리핑 컨테이너 자체가 회전된 경우)나 둥근 모서리(UICorner)에 의한 클리핑은 지원되지 않습니다. 회전되거나 둥근 컨테이너에서 클리핑이 필요하다면 CanvasGroup을 고려하십시오.
Rotation = 0
Rotation = 10
탄성
기본적으로, ScrollingFrames는 터치 지원 장치에서 탄성 스크롤 동작을 나타내며, 사용자가 캔버스를 경계보다 약간 더 드래그할 수 있고, 놓을 때 캔버스는 최소 또는 최대 한계로 되돌아갑니다. 탄성 동작을 완전히 제거하고 캔버스가 한계를 넘어 스크롤되지 않도록 하려면, ElasticBehavior 속성을 Never로 설정하십시오.