# 도프시트 뷰

도프시트 뷰에서는 애니메이션 [키](/spine-keys)의 타이밍을 표시하고 편집합니다.

도프시트에서는 키의 값이 아닌 키의 타이밍만 표시하지만 한 번에 여러 속성에 대한 키를 표시할 수 있습니다. 이에 비해 [그래프](/spine-graph)에서는 키의 타이밍과 값을 모두 표시하지만 많은 키가 지정된 속성이 표시되면 사용하기 어려울 수 있습니다.

![](/img/spine-user-guide/dopesheet/dopesheet.png)

도프시트를 효율적으로 사용하는 다양한 방법은 도프시트 [팁](/spine-tips#Dopesheet)을 참조하십시오.

# 행

[타임라인](/spine-keys#타임라인) 아래에는 키가 지정된 각 속성에 대한 행이 표시되며 뼈별로 그룹화됩니다. 각 행에는 키를 나타내는 컬러 직사각형이 있습니다. 각 유형의 키에 고유한 색상이 사용됩니다. 흰색 키는 동일한 프레임에 있는 여러 유형의 키를 나타냅니다.

![](/img/spine-user-guide/dopesheet/rows.png)

도프시트 행 위로 마우스 휠을 스크롤하면 행이 위 또는 아래로 스크롤됩니다. 뷰포트와 마찬가지로, 마우스 오른쪽 버튼으로 드래그하여 도프시트 행을 위아래 또는 좌우로 이동합니다.

## 개요 행

도프시트의 첫 번째 행은 "개요 행"입니다. 개요 행에는 애니메이션 이름과 그 아래의 모든 행에 대한 키가 표시됩니다. 이 옵션은 애니메이션의 모든 키 또는 현재 도프시트에 표시되는 모든 키를 수정해야 할 때 유용합니다.

<callout>다른 애니메이션을 선택해야 할 때 애니메이션 이름을 클릭하면 유용할 수 있지만, [애니메이션 뷰](/spine-animations-view)가 훨씬 더 빠릅니다.</callout>

프로젝트에 여러 스켈레톤이 있는 경우 각 스켈레톤의 행 위에 개요 행이 나타납니다. 트리에서 스켈레톤을 숨기면 도프시트에서도 숨겨집니다.

트리에서 애니메이션 이름을 클릭하여 애니메이션을 선택합니다.

## 뼈 행

![](/img/spine-user-guide/dopesheet/rows-bone.png)

키가 지정된 속성과 가장 관련 있는 뼈별로 키가 그룹화됩니다.

행 왼쪽에 있는 접기(`-`) 또는 펼치기(`+`) 아이콘을 클릭하거나 뼈 이름을 마우스 오른쪽 버튼으로 클릭하여 뼈 행을 접거나 펼칠 수 있습니다. 펼치면 뼈 행 아래에 있는 여러 속성에 동일한 프레임의 키가 있는 경우에만 뼈 행에 키가 표시됩니다. 접으면 뼈 행 아래에 있는 속성에 대한 모든 키가 뼈 행에 표시됩니다.

<callout>뼈를 선택할 경우 도프시트 행이 변경되지 않으므로 도프시트가 [잠금](#잠금) 상태일 때 뼈 이름을 클릭하면 더 유용합니다.</callout>

뼈 이름을 클릭하여 뷰포트에서 뼈를 선택합니다. `ctrl`(Mac의 경우 `cmd`) 키를 길게 눌러 선택을 전환하거나 여러 뼈를 선택합니다.

도프시트에서 뼈 행을 위아래로 드래그하여 [순서](#행-순서)를 변경할 수 있습니다.

## 속성 행

![](/img/spine-user-guide/dopesheet/rows-property.png)

뼈 행 아래에는 키가 지정된 각 속성에 대한 속성 행이 있습니다. 속성 행에는 해당 속성의 모든 키가 표시됩니다. 키 사이의 선은 키 사이의 보간 유형을 나타냅니다.

<callout>[뼈 변형](/spine-tools#뼈-변형) 속성의 이름을 클릭하면 해당 [변형 툴](/spine-tools#변형-툴)도 선택되어 새 키를 더 빠르게 설정할 수 있습니다.</callout>

속성 이름을 클릭하여 뷰포트 또는 트리에서 항목을 선택합니다. `ctrl`(Mac의 경우 `cmd`) 키를 길게 눌러 선택을 전환하거나 여러 항목을 선택합니다.

### 보간

키 사이의 직선은 키 사이의 선형 보간을 나타냅니다. 약간 구부러진 선은 베지어 보간을 나타내고 점선은 계단형 전환을 나타냅니다. 키 사이의 보간에 대한 자세한 내용은 [그래프](/spine-graph#보간)를 참조하십시오.

키 사이에 선이 표시되지 않으면 키 사이에 보간이 없음을 나타냅니다. 이는 두 키의 값이 같거나 [슬롯 어태치먼트](/spine-keys# 슬롯-어태치먼트)  또는 [이벤트 키](/spine-keys#이벤트)와 같은 키 유형에 전환이 없음을 의미합니다. 개요 및 뼈 행에는 키 사이에 선이 표시되지 않습니다.

## 기타 행

[드로우 오더](/spine-keys#드로우-오더) 및 [이벤트](/spine-keys#이벤트) 행은 뼈와 관련이 없으므로 행에 키가 있을 때 도프시트 하단에 행이 표시됩니다. 이러한 행은 [도프시트 필터](#필터)를 사용하여 숨길 수 있습니다.

# 내용

도프시트에는 표시되는 뼈 행을 제어하는 두 가지 모드(잠금 해제 및 잠금)가 있습니다.

## 잠금 해제

<callout>모든 뼈 행을 보려면 `spacebar`, `escape`를 누르거나 뷰포트에서 아무 곳이나 두 번 클릭하여 [선택을 취소](/spine-tools#선택-취소)합니다.</callout>

도프시트는 기본적으로 잠금 해제되어 있습니다. 잠금이 해제되면 표시되는 뼈 행은 뷰포트 또는 트리 선택에 따라 달라집니다. 뼈(또는 뼈 아래의 항목)를 선택하면 해당 뼈의 뼈 행만 표시됩니다. 뼈를 선택하지 않으면 모든 뼈 행이 표시됩니다.

잠금 해제된 도프시트를 사용하면 한 번에 하나의 뼈에 대한 키만 봐야 할 때 유용합니다. 여러 뼈에서 작업할 때 도프시트 내용을 잠그면 더 편리할 수 있습니다.

## 잠금

<callout>[동기화](#동기화)가 활성화되면 잠금 버튼이 숨겨집니다.</callout>

![](/img/spine-user-guide/dopesheet/lock.png)

잠금 버튼을 클릭하여 도프시트를 잠그고 표시되는 뼈 행을 유지합니다. 잠겨 있는 동안 뷰포트 또는 트리 선택을 변경해도 표시되는 뼈대 행에는 영향을 미치지 않습니다.

도프시트를 잠그면 여러 뼈 또는 특정 뼈 세트에서 작업할 때 유용하며 다른 뼈를 선택하는 동안 여러 뼈 행을 볼 수 있습니다.

#### 새로 고침

![](/img/spine-user-guide/dopesheet/lock-refresh.png)

새로 고침 버튼을 누르면 도프시트가 업데이트되어 현재 선택 항목에 대한 뼈 행이 표시됩니다. 이는 도프시트를 잠금 해제한 후 다시 잠그는 것과 같습니다.

#### 선택

![](/img/spine-user-guide/dopesheet/lock-select.png)

선택 버튼을 누르면 현재 표시된 모든 뼈 행에 대한 뷰포트의 뼈가 선택됩니다. 뼈를 선택하고, 선택 항목을 수정한 다음 새로 고침을 클릭하여 도프시트에 표시된 뼈 행을 변경하는 것이 유용할 수 있습니다.

## 순서

뼈가 선택된 순서에 따라 뼈 행이 도프시트에 나타납니다. 뼈 행은 위 또는 아래로 드래그하여 다시 정렬할 수 있습니다.

# 필터

<callout>[동기화](#동기화)가 활성화되면 필터 버튼이 숨겨집니다.</callout>

도프시트를 필터링하여 선택한 속성의 유형만 표시할 수 있습니다. 필터 버튼을 클릭하여 표시할 속성 유형을 선택합니다. 필터가 활성화되면 필터 버튼은 빨간색이 됩니다.

![](/img/spine-user-guide/dopesheet/filter-dopesheet.png)

`ctrl`(Mac의 경우 `cmd`) 또는 `shift` 키를 길게 눌러 여러 필터를 선택합니다. `Reset` 버튼을 누르면 모든 필터가 선택됩니다.

`Current tool`이 활성화되면 현재 [변형 툴](/spine-tools#변형-툴)에 해당하는 [뼈 변형](/spine-tools#뼈-변형) 속성만 표시됩니다.

필터 버튼을 마우스 오른쪽 버튼으로 클릭하여 필터를 설정하거나 해제합니다. 

# 타임라인 위치

현재 타임라인 위치는 `Current` 버튼 옆에 표시됩니다.

![](/img/spine-user-guide/dopesheet/current.png)

프레임 번호를 입력한 다음 `enter` 또는 `tab` 키로 현재 타임라인 위치를 설정할 수 있습니다. 분수를 입력하여 프레임 사이의 타임라인 위치를 설정할 수 있습니다.

[프레임으로 이동](/spine-settings#프레임-으로-이동)이 활성화된 경우 빈 공간을 클릭하여 타임라인 위치를 해당 프레임으로 설정합니다.

`Current` 버튼이 활성화되면 도프시트가 재생 중에 수평으로 자동 스크롤됩니다. 이 옵션은 도프시트에서 키가 수평으로 맞지 않는 긴 애니메이션에 유용할 수 있습니다.

## 루프

시작 또는 끝 프레임을 설정하려면 타임라인 위치를 설정한 다음 `Loop Start` 또는 `End` 버튼을 클릭합니다. 또는 각 상자에 프레임 번호를 입력합니다. 둘 다 설정된 후 [반복](/spine-keys#반복)이 활성화되면 지정된 시작 프레임과 끝 프레임 사이에서 재생이 제한됩니다. 이 옵션은 재생이 반복되는 방법만 제어하며 애니메이션별로 저장되지 않습니다.

시작 및 끝 프레임을 지우려면 `Loop Start` 또는 `End`를 두 번 클릭하거나 텍스트 상자의 숫자를 삭제합니다.

![](/img/spine-user-guide/dopesheet/looping.png)

# 선택

클릭하여 키를 선택합니다. 이렇게 하면 [키로 이동](/spine-settings#키-로-이동)이 활성화된 경우 타임라인 위치도 선택한 키로 설정됩니다. `ctrl`(Mac의 경우 `cmd`) 키를 길게 눌러 선택을 전환하거나 여러 키를 선택합니다. 개요 또는 뼈 행에서 키를 선택하면 행 아래에 있는 키가 선택됩니다.

키를 클릭 시 도프시트가 [잠금](#잠금) 상태이면 키에 대한 항목이 뷰포트 또는 트리에서 선택됩니다. 이렇게 하면 선택한 키를 더 쉽게 수정할 수 있습니다.

키가 선택되면 `ctrl+A`(Mac의 경우 `cmd+A`)를 눌러 동일한 도프시트 행에 있는 모든 키를 선택합니다. 도프시트에 표시된 모든 키를 선택하려면 `ctrl+A`(Mac의 경우 `cmd+A`)를 다시 누릅니다.

도프시트에서 키가 선택되면 그래프에서도 동일한 키가 선택됩니다. 마찬가지로 그래프에서 키가 선택되면 도프시트에서도 동일한 키가 선택됩니다.

## 상자 선택

빈 공간에서 상자 선택으로 드래그합니다. 드래그하기 전에 `ctrl`(Mac의 경우 `cmd`) 키를 길게 눌러 키 위에서 시작하는 상자 선택을 만듭니다.

![](/img/spine-user-guide/dopesheet/box-select-gif.gif)

상자 선택을 뒤에 남겨두지 않고 상자 선택을 드래그하려면 마우스 버튼을 빠르게 끌어서 놓습니다. 상자 선택을 유지하려면 마우스 버튼을 놓기 전에 드래그한 다음 잠시 멈춥니다. `ctrl`(Mac의 경우 `cmd`) 키를 길게 눌러 이러한 방식으로 여러 상자 선택을 만들 수 있습니다.

![](/img/spine-user-guide/dopesheet/box-select-nobox-gif.gif)

상자 선택의 왼쪽 또는 오른쪽 가장자리를 끌어 선택한 키의 크기를 조정할 수 있습니다. 키의 크기를 조정하면 선택한 키 사이의 타이밍이 늘어나거나 줄어듭니다. 개요 행에서 사용하는 경우 크기를 조정하면 전체 애니메이션의 지속 시간을 늘리거나 줄일 수 있습니다.

![](/img/spine-user-guide/dopesheet/scale-gif.gif)

크기 조정을 사용하여 왼쪽 에지가 오른쪽 에지를 지나치도록 이동하거나, 오른쪽 에지가 왼쪽 에지를 지나치도록 이동하여 키의 순서를 뒤바꿀 수 있습니다.

상자 선택을 만들거나 크기를 조정할 때 `shift` 키를 길게 눌러 [프레임 스내핑](/spine-keys#프레임-스내핑)를 비활성화합니다.

# 키 조작

선택한 키를 왼쪽이나 오른쪽으로 드래그하여 키가 적용되는 프레임을 변경할 수 있습니다. 드래그를 시작할 때 `ctrl+shift`(Mac의 경우 `cmd+shift`) 키를 길게 눌러 선택한 키를 복제합니다. 드래그하면서 `shift` 키를 길게 눌러 [프레임 스내핑](/spine-keys#프레임-스내핑)을 비활성화합니다.

두 번 클릭하여 키를 삭제합니다.

## 클립보드 버튼

![](/img/spine-user-guide/key-frames/key-shown.png)

[클립보드 버튼](/spine-keys#클립보드-버튼)을 참조하십시오.

## 이동

![](/img/spine-user-guide/dopesheet/key-shift.png)

[이동](/spine-keys#이동)를 참조하십시오.

## 오프셋

![](/img/spine-user-guide/dopesheet/key-offset.png)

[오프셋](/spine-keys#오프셋)을 참조하십시오.

## 조정

<callout>대개 [그래프](/spine-graph)를 사용하여 한 번에 여러 키의 값을 수정하는 것이 더 쉽습니다.</callout>

![](/img/spine-user-guide/dopesheet/key-adjust.png)

`Adjust`를 사용하면 여러 키를 한 번에 편집할 수 있습니다. `Adjust`를 활성화한 다음 `Rotate`, `Translate`, `Scale` 또는 `Pose` 툴을 사용하여 뷰포트에서 뼈를 조작하면 선택한 모든 키가 상대적으로 동일한 양만큼 조정됩니다.

예를 들어 뼈에는 0, 50 및 85도의 세 가지 회전 키가 있습니다. 도프시트에서 이러한 키를 선택하고 `Adjust`를 활성화한 다음 `Rotate` 툴을 사용하여 뼈를 15도 회전시킵니다. 선택한 키는 각 값에 15도를 추가하여 수정되므로 키는 15, 65 및 100도가 됩니다.

한 애니메이션에 여러 키로 정의된 움직임이 있는 경우 `Adjust`를 사용하여 각 키를 개별적으로 편집할 필요 없이 전체 움직임을 조정할 수 있습니다.

## 키 표시

![](/img/spine-user-guide/key-frames/key-shown.png)

[키 표시](/spine-keys#키-표시)를 참조하십시오.

# 동기화

<callout>그래프에서는 동일한 버튼의 툴바를 많이 제공하기 때문에, `Sync` 사용 시 [툴바 숨기기](#툴바-숨기기)는 공간을 확보하는 데 유용할 수 있습니다.</callout>

활성화되면 [그래프](/spine-graph)에 표시되는 곡선의 행이 도프시트에 표시됩니다. 그래프에서는 표시되는 도프시트 행을 제어하므로 잠금 및 필터 버튼이 숨겨집니다.

도프시트 뷰가 그래프 뷰 바로 위 또는 아래에 있고 `Sync`가 활성화된 경우, 두 뷰의 타임라인에 대한 확대/축소 수준이 동기화되어 두 뷰의 키가 수평으로 정렬됩니다. 이 경우 그래프를 사용하여 키 값을 조정하는 동시에 도프시트를 사용하여 타이밍을 조정하고 한 번에 많은 키를 볼 수도 있습니다.

# 설정 보기

![](/img/spine-user-guide/dopesheet/view-options.png)

#### 툴바 숨기기

선택하면 도프시트 툴바가 숨겨집니다. 이 옵션은 수직 공간을 확보할 수 있으며 [동기화](#동기화)와 함께 자주 사용됩니다.

# 동영상

[youtube:kDv2hBnenGs&list=PLwGl7Ikd_6GRFo7d0uRu_fN2RIlvkxW7b?modestbranding=1&rel=0]

[다음: 고스팅 뷰](/spine-ghosting)
[이전: 오디오 뷰](/spine-audio-view)
[Spine 사용자 가이드: 목차]