애니메이션 곡선 편집기
애니메이션 곡선은 시간에 따라 값이 어떻게 변하는지를 나타내는 하나 이상의 곡선을 포함하는 자산입니다. 이 곡선은 선형 보간(linear interpolation), 부드러운 보간(smooth interpolation), 또는 베지어 보간(bezier interpolation)을 사용하여 곡선의 서로 다른 지점 간의 값을 연결합니다. 수직 축에 설정한 값은 기본적으로 -1과 1 사이의 어떤 값이 될 수 있으며, 수평 축의 지속 시간은 항상 0에서 1로 정규화되어 있어 게임 코드에서 곱셈기를 사용하여 다양한 시간 범위를 쉽게 타겟팅하거나 시퀀스 편집기에서 트랙에 맞게 늘릴 수 있습니다.
애니메이션 곡선은 "채널"로 구성되어 있으며, 각 채널은 고유한 곡선 설정을 가질 수 있습니다. 예를 들어, x/y 위치를 설명하기 위해 두 개의 채널을 사용하거나 색상 형식을 나타내기 위해 4개의 채널을 사용하여 색상 그라디언트를 표현할 수 있습니다. 애니메이션 곡선 자산은 시퀀스 작업 시 사용될 수 있으며, 코드로도 접근할 수 있어 게임 제작 시 강력한 도구가 됩니다.
애니메이션 곡선 자산 생성
애니메이션 곡선 자산을 처음 생성하면 편집기 창이 열리고 다음과 같은 섹션이 표시됩니다.
곡선 이름
여기에서 애니메이션 곡선에 고유한 이름을 부여할 수 있습니다(영숫자 및 "_" 기호만 사용 가능). 이 이름은 코드나 시퀀스에서 곡선과 모든 채널을 참조하는 데 사용됩니다.
곡선 라이브러리
버튼을 클릭하면 애니메이션 곡선 라이브러리 창이 열리며, 애니메이션 곡선의 곡선 유형을 변경하고 선택한 채널에 프리셋을 적용할 수 있습니다. 곡선 유형 및 프리셋에 대한 정보는 곡선 라이브러리 섹션을 참조하세요. 버튼을 통해 창을 열면 기본적으로 "덮어쓰기" 적용 모드가 선택됩니다.
채널 목록
채널 목록은 애니메이션 곡선 자산을 구성할 다양한 채널을 추가하고 이름을 지정하는 곳입니다. 기본적으로 애니메이션 곡선을 처음 생성하면 채널이 하나 추가되며, 곡선 이름 왼쪽의 버튼을 클릭하여 추가 채널을 추가할 수 있습니다. 각 채널은 고유한 이름을 가져야 하며(영숫자 및 "_" 기호만 사용 가능), 왼쪽의 색상 샘플을 더블 클릭하여 색상을 설정할 수 있습니다. 채널 이름을 바꾸려면 느리게 더블 클릭하여 이름을 변경할 수 있으며, 오른쪽 마우스 버튼을 클릭하여 이름 변경, 색상 변경 또는 채널 삭제 메뉴를 열 수 있습니다.
채널은 이름 옆의 화살표를 클릭하여 확장할 수 있으며, 이때 채널 곡선의 각 포인트를 표시합니다. 이러한 포인트는 현재 값을 클릭하고 새 값을 입력하여 수동으로 편집할 수 있습니다. "눈" 아이콘을 클릭하여 채널 가시성을 전환하거나 "휴지통" 아이콘을 클릭하여 채널을 삭제할 수 있습니다.
채널 범위
채널 범위 버튼은 채널 편집기의 시각적 수직 범위를 설정하는 데 사용됩니다. 기본적으로 -1에서 1로 설정되지만, 이 버튼을 클릭하면 다음과 같은 창이 열립니다. 이 값을 변경하면 채널 편집기 섹션에서 데이터가 표현되는 방식이 변경되어 채널 곡선에서 -1과 1보다 높은/낮은 값을 가질 수 있습니다. 이는 순전히 시각적이며 채널의 값을 제한하지 않습니다.
채널 편집기
채널 편집기는 애니메이션 곡선에서 사용되는 다양한 채널의 시각적 표현을 보여줍니다. 기본적으로 모든 채널이 여기에서 표시되지만, 채널 목록에서 현재 선택된 채널만 편집할 수 있으며, 이 채널은 편집기에서 강조 표시됩니다. 채널 곡선의 포인트 위치를 변경하려면 포인트를 클릭하고 드래그하면 됩니다. 단, 첫 번째 및 마지막 포인트는 수직 축을 따라만 변경할 수 있으며, 수평 값은 각각 0과 1로 고정되어 있습니다.
포인트를 직접 추가하려면 마우스를 주요 채널 선 근처로 이동한 후 커서가 "포인트 추가" 도구로 변경되면 클릭합니다. 이후 이 포인트들을 클릭하고 드래그하거나 채널 목록의 확장된 채널 옵션에서 값을 변경하여 편집할 수 있습니다. 여러 포인트를 동시에 편집하려면 편집기 내에서 클릭하고 드래그하여 편집할 포인트를 선택하거나 + 키를 사용하여 개별적으로 선택할 수 있습니다. 마우스 버튼을 놓은 후 선택된 포인트 중 하나를 클릭하고 드래그하면 모든 포인트가 함께 이동합니다.
채널 편집기 내에서 오른쪽 클릭하면 애니메이션 곡선 라이브러리 창이 열립니다(선택된 곡선 유형이 베지어일 때만). 이 방법으로 프리셋을 적용하면 전체 채널에 영향을 미칩니다. 채널의 일부만 수정하려면 개별 선을 오른쪽 클릭하여 프리셋을 적용하거나, 여러 선을 선택한 후 오른쪽 클릭하여 선택된 선에 프리셋을 적용할 수 있습니다. 채널 편집기를 통해 애니메이션 곡선 라이브러리 창을 열면 기본적으로 "사이" 적용 모드가 선택됩니다.
확대/축소 제어
확대/축소 제어는 채널 편집기에서 채널 곡선의 수직 스케일을 확장하거나 축소할 수 있게 해줍니다. "중앙 맞춤" 버튼을 클릭하면 채널 편집기 뷰가 모든 포인트를 편집기 내에서 중앙에 맞춰 조정됩니다.
활용 예제
// 애니메이션 곡선 생성
var myCurve = animation_curve_create("MyCurve");
// 채널 추가
animation_curve_add_channel(myCurve, "PositionX");
animation_curve_add_channel(myCurve, "PositionY");
// 값 설정
animation_curve_set_value(myCurve, "PositionX", 0, 0);
animation_curve_set_value(myCurve, "PositionX", 1, 1);
animation_curve_set_value(myCurve, "PositionY", 0, 0);
animation_curve_set_value(myCurve, "PositionY", 1, 1);
// 애니메이션 곡선 사용
var currentValueX = animation_curve_get_value(myCurve, "PositionX", currentTime);
var currentValueY = animation_curve_get_value(myCurve, "PositionY", currentTime);
// 채널 색상 변경
animation_curve_set_channel_color(myCurve, "PositionX", c_red);
animation_curve_set_channel_color(myCurve, "PositionY", c_blue);
// 애니메이션 곡선 라이브러리에서 프리셋 적용
animation_curve_apply_preset(myCurve, "EaseInOut");
// 애니메이션 곡선의 모든 채널을 반복
for (var i = 0; i < animation_curve_channel_count(myCurve); i++) {
var channelName = animation_curve_get_channel_name(myCurve, i);
// 채널에 대한 작업 수행
}