# ScrollingFrame

ScrollingFrame : `GuiObject`

## Overview

ScrollingFrame은 내부에 배치된 UI 요소가 표시 영역을 벗어날 경우, 자동으로 가로 또는 세로 스크롤을 제공하는 UI 컨테이너입니다. 인벤토리, 퀘스트 목록처럼 많은 항목을 한 화면에서 정돈된 형태로 보여주고자 할 때 특히 유용하며, 다양한 스크롤 동작을 상황에 맞게 설정할 수 있습니다.

ScrollingFrame은 **클라이언트 환경**에서만 제어할 수 있습니다.

## Properties

### AbsoluteCanvasSize

`Vector2`

사용자가 스크롤로 이동할 수 있는 전체 영역의 크기를 정의하는 읽기 전용 속성입니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

wait(2)
print(ScrollingFrame.AbsoluteCanvasSize)
```

### AbsoluteWindowSize

`Vector2`

스크롤 바 영역을 뺀 실제 표시 영역의 크기를 정의하는 읽기 전용 속성입니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

print(ScrollingFrame.AbsoluteWindowSize)
```

### AutomaticCanvasSize

`Enum.AutomaticSize`

ScrollingFrame 내부 콘텐츠의 실제 크기에 맞추어 CanvasSize를 자동으로 조정하도록 설정하는 속성입니다.

AutomaticSize가 None이 아닐 경우, 지정한 방향에 따라 내부 UI 요소들의 실제 크기를 기반으로 AbsoluteCanvasSize가 산출되며, 자동으로 업데이트됩니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.AutomaticCanvasSize = Enum.AutomaticSize.XY
```

### CanvasPosition

`Vector2`

ScrollingFrame 안에서 캔버스가 현재 어느 위치에 놓여 있는지를 픽셀 단위로 지정하는 속성입니다.

설정된 값에 따라 스크롤 바도 동일한 위치로 조정됩니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.CanvasPosition = Vector2.new(0, 210)
```

### CanvasSize

`UDim2`

사용자가 스크롤로 이동할 수 있는 전체 영역의 크기를 지정합니다.

내부 콘텐츠의 양에 따라 스크롤 범위를 자동으로 산출하고자 할 때는 AutomaticCanvasSize를 사용할 수 있습니다.

또한 CanvasSize에 값을 직접 지정한 상태에서 AutomaticCanvasSize를 활성화하면, 자동으로 계산된 크기보다 CanvasSize에 입력한 값이 더 클 경우 해당 수동 설정 값이 우선적으로 적용됩니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.CanvasSize = UDim2.new(0, 0, 0, 400)
```

### ScrollBarImageColor3

`Color3`

스크롤 바 이미지의 색상을 지정합니다.

값이 흰색이면 별도의 색 보정 없이 원본 이미지 그대로 표시됩니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.ScrollBarImageColor3 = Color3.fromRGB(255, 0, 0)
```

### ScrollBarImageTransparency

`number`

스크롤 바 이미지의 투명도를 지정합니다.

0은 완전한 불투명 상태를 의미하고, 1은 전혀 보이지 않는 상태를 의미합니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.ScrollBarImageTransparency = 0.3
```

### ScrollBarThickness

`number`

스크롤 바의 두께를 픽셀 단위로 지정합니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.ScrollBarThickness = 30
```

### ScrollingDirection

`Enum.ScrollingDirection`

사용자가 콘텐츠를 어느 방향으로 스크롤할 수 있는지를 지정합니다.

선택한 방향으로만 스크롤 바가 생성됩니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.ScrollingDirection = Enum.ScrollingDirection.Y
```

### ScrollingEnabled

`bool`

스크롤 동작을 허용할지 여부를 지정합니다.

스크롤을 비활성화하면 스크롤 바도 표시되지 않으며, 사용자는 콘텐츠를 스크롤 할 수 없습니다.

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame.ScrollingEnabled = false
```

## Methods

### MoveToSlot

지정한 슬롯 인덱스 위치에 해당하는 UI 요소가 ScrollingFrame의 표시 영역 안으로 들어오도록 스크롤을 이동시키는 메서드입니다.

slotIndex는 계층 순서가 아닌 실제 화면에서의 정렬(표시) 순서를 기준으로 판단합니다.

#### Parameters

| `unumber32` SlotIndex | 스크롤 이동의 기준이 될 슬롯의 표시(정렬) 순서를 나타내는 인덱스 값입니다. |
| --------------------- | ------------------------------------------- |

#### Return

| `void` |   |
| ------ | - |

#### Code Samples

```lua
local ScreenGui = script.Parent
local ScrollingFrame = ScreenGui:WaitForChild("ScrollingFrame")

ScrollingFrame:MoveToSlot(3)
```

## Events

## See also

{% content-ref url="../../../manual/studio-manual/gui" %}
[gui](https://docs.overdare.com/korean/manual/studio-manual/gui)
{% endcontent-ref %}