애니메이션(Animations)

소개

Godot의 애니메이션 시스템은 매우 강력하고 유연합니다.

시작하기 위해, 우리는 지난 튜토리얼의 씬을 사용할 것입니다 (스플래시 화면). 목표는 "희미해지는" 애니메이션을 스플래시 이미지에 추가하는 것입니다. 혹시나 해서 여기 복사본이 있습니다: robisplash.zip.

애니메이션 플레이어 추가하기

먼저, AnimationPlayer 노드를 "background" (루트 노드) 의 자식으로 추가합니다:

../../_images/robisplash_anim_inspector.png

이 타입의 노드가 선택될 때, 애니메이션 에디터 패널이 나타날 것입니다:

../../_images/robisplash_anim_editor.png

애니메이션 에디터 패널은 수동으로 숨기지 않는 이상 표시됩니다.

애니메이션 만들기

새 애니메이션을 만들 시간입니다! 새로운 애니메이션 버튼을 누르고 대화 상자가 뜨면 애니메이션 이름을 "intro" 라고 적습니다.

../../_images/robisplash_anim_new.png

이제 애니메이션이 있으므로 속성 에디터는 "애니메이션 편집" 모드로 들어갑니다. 이 모드에서, 속성 에디터의 모든 속성에 키 아이콘이 나타납니다. Godot에서는 대상의 어떤 속성도 애니메이트 할 수 있습니다:

../../_images/robisplash_anim_property_keys.png

애니메이션 편집하기

로고는 화면의 위에서 나타날 것입니다.

애니메이션 패널을 열고, "logo" 노드를 선택하고 "Rect / Position" 속성을 (118, -400) 으로 설정합니다, 그리고 속성 옆의 키 버튼을 클릭합니다:

../../_images/robisplash_anim_logo_inspector_key.png

대화 상자가 나타나면, 새 트랙을 만들겠다고 확인합니다.

키프레임이 애니메이션 플레이어 에디터에 나타날 것입니다:

../../_images/robisplash_anim_editor_keyframe.png

여기를 클릭해서 에디터 커서를 끝으로 움직입니다:

../../_images/robisplash_anim_editor_track_cursor.png

로고 위치를 (118, 0) 으로 바꾸고 다시 키프레임을 추가합니다. 두 키프레임으로, 애니메이션이 발생합니다.

../../_images/robisplash_anim_editor_keyframe_2.png

애니메이션 패널에서 "선택된 애니메이션을 처음부터 재생. (Shift+D)" 를 누르면 로고가 내려갈 것입니다.

../../_images/robisplash_anim_editor_play_start.png

"로드 시 자동 플레이" 버튼을 눌러 씬이 시작할 때 애니메이션이 자동으로 시작하도록 설정합니다.

../../_images/robisplash_anim_editor_autoplay.png

그리고 마침내, 씬을 실행시키면, 애니메이션은 이렇게 보여야 할 것입니다:

../../_images/out.gif