AnyPortrait > 메뉴얼 > 애니메이션 이벤트와 스크립트 연동

애니메이션 이벤트와 스크립트 연동


1.3.4

게임에 따라서는 애니메이션의 특정 시점에서 어떤 상호 작용을 해야할 필요가 있습니다.
달리는 캐릭터가 점프를 할 때 흙먼지가 날릴 수도 있고, 휘두르는 검에 몬스터가 맞을 수도 있어야 합니다.
이 페이지에서는 애니메이션 이벤트 기능을 이용해서 스크립트와 연동하는 방법을 알아봅니다.
(C# 스크립트가 포함되어 있습니다.)




애니메이션 속성 UI에서 Animation Events 버튼을 눌러 애니메이션 이벤트를 등록하는 다이얼로그를 호출할 수 있습니다.




애니메이션 이벤트 추가하고 스크립트와 연동하기




(1) Add Event 버튼을 눌러서 이벤트를 새로 추가합니다.
(2) 이벤트의 이름을 지정하고, 호출될 프레임을 입력합니다.
이벤트의 이름으로 스크립트와 연동이 되므로, 이때의 이름을 기억해둡니다.
여기서는 SampleAnimEvent 이라는 이름으로 만들었습니다.




애니메이션 이벤트가 추가되면 타임라인 GUI에 해당 위치에 이벤트 마커가 추가된 것을 볼 수 있습니다.




Bake를 하고 씬으로 나갑니다.
이벤트와 연동될 스크립트를 만듭니다.
(1) 스크립트가 포함될 GameObject를 만듭니다. (꼭 새로 만들 필요는 없으며, 스크립트가 포함되는 GameObject면 아무거나 됩니다.)
(2) MonoBehaviour 스크립트를 생성하여 추가합니다.


다음의 코드를 작성합니다.
위에서 작성한 애니메이션 이벤트의 이름이 SampleAnimEvent인 점을 기억합시다.



위 코드에서 알 수 있듯이, 작성된 애니메이션 이벤트와 동일한 이름의 함수를 호출하는 방식입니다.
따라서 애니메이션 이벤트와 스크립트는 동일한 이름, 동일한 인자를 가지고 있어야 합니다.




캐릭터를 선택하면 apPortrait 속성이 Inspector에 표시됩니다.
여기서 Event Listener 항목에 방금 만든 스크립트가 포함된 GameObject를 넣어서 이벤트를 받을 수 있게 합니다.




게임을 실행하면 이벤트가 발생하고, 스크립트에서 이를 받아서 로그를 출력하는 것을 콘솔창에서 확인할 수 있습니다.




애니메이션 이벤트에 파라미터 추가하기




애니메이션 이벤트에 파라미터를 추가하여 스크립트와 연동할 수 있습니다.
이때 파라미터는 함수의 매개변수로 입력이 됩니다.
(1) Add Parameter 버튼을 눌러서 파라미터를 추가합니다.
(2) 파라미터의 변수 타입을 선택하고 (3) 전달될 값을 입력합니다.
(파라미터로 전달할 수 있는 타입은 Bool, Int, Float, Vector2, String 입니다.)



파라미터를 받을 수 있도록 함수를 수정합니다.
변수 타입에 맞게 매개 변수를 만들어줍니다.




게임을 실행하면 파라미터의 값이 전달되는 것을 확인할 수 있습니다.




여러 프레임에서 지속적으로 발생하는 애니메이션 이벤트 만들기




프레임 1개에서 이벤트를 발생시키는 것이 아닌, 일정 프레임동안 지속적으로 이벤트를 발생시켜야 하는 경우도 있습니다.
(1) Call Method를 Once에서 Continuous로 바꿉니다.
(2) Start FrameEnd Frame을 각각 지정해줍니다.
(3) 파라미터의 값 2개를 지정할 수 있습니다.
각각 Start Frame과 End Frame에서 호출되는 값이며, 그 사이에서는 선형으로 보간된 값을 스크립트로 전달합니다.
(String 타입의 파라미터는 보간이 되지 않으므로 이 기능이 지원되지 않습니다.)




Continuous 타입의 애니메이션 이벤트는 다른 색상의 마커로 표시됩니다. 시작점은 파란색, 끝점은 녹색입니다.




Bake 후 게임을 실행하면 매 프레임마다 보간되는 값이 호출되는 것을 확인할 수 있습니다.




2개 이상의 파라미터를 가지는 애니메이션 이벤트 만들기




여러 개의 파라미터를 가지는 애니메이션 이벤트를 만들 수도 있습니다.
파라미터마다 다른 타입을 가질 수도 있습니다.
위 화면은 3개의 파라미터를 각각 Integer, Float, Vector2 타입으로 만든 화면입니다.
(구별하기 위해 애니메이션 이벤트를 새로 생성하고 이름을 MultipleParamAnimEvent로 하였습니다.)



함수 매개 변수로 3개의 변수가 아닌 object 배열 타입의 1개의 매개 변수만 사용됩니다.
이 배열에는 에디터에서 정의했던 순서대로 파라미터가 포함되어 있습니다.
변수를 형변환을 통해 참조할 수 있습니다.




게임을 실행하면 3개의 파라미터가 스크립트로 전달되는 것을 확인할 수 있습니다.




개선된 인스펙터에서의 애니메이션 이벤트


1.3.4

AnyPortrait v1.3.4에서 업데이트된 인스펙터(관련 페이지)를 통해서, 애니메이션 이벤트들을 빠르게 확인할 수 있습니다.
또한 애니메이션 이벤트를 스크립트로 복사하거나, 호출 방식을 바꾸는 것이 가능합니다.




애니메이션 이벤트를 가진 캐릭터를 유니티 씬에서 선택하면, 위와 같은 화면이 인스펙터에 나타납니다.
(1) 애니메이션 호출 방식을 Send MessageCallback 중에서 선택할 수 있습니다. 기존의 방식은 Send Message 입니다.
(2) 애니메이션 이벤트를 받아서 처리할 리스너 객체입니다. (기존의 Inspector 상단에 존재했던 항목의 위치가 바뀌었습니다.)
(3) 애니메이션 이벤트들 입니다. 이벤트의 이름과 파라미터들을 확인할 수 있습니다.
(4) 애니메이션 이벤트를 클립보드로 복사합니다. 복사된 양식은 C# 스크립트로 붙여넣을 수 있게 가공됩니다.
(5) 모든 애니메이션 이벤트들을 클립보드로 복사합니다.


여기서 추가된 기능인 "클립보드로 애니메이션 이벤트 복사하기" 기능을 사용해봅시다.
먼저 (4) 또는 (5)의 복사 버튼을 누릅니다.




스크립트 에디터를 열어서 붙여넣기를 하면 위와 같이 애니메이션 이벤트들의 이름, 형식에 맞는 코드가 추가됩니다.
이제 애니메이션 이벤트를 외웠다가 작성하는 불필요한 수고를 덜 수 있을 것입니다.




v1.3.4에서 추가된 또다른 기능은 Callback 방식입니다.
기존의 Send MessageUnity Send Message를 이용한 것이라면, 이것은 함수를 직접 지정하는 Unity Event와 유사한 방식입니다.
성능의 향상은 물론이고, 이벤트를 받을 함수의 이름을 동일하게 설정하지 않아도 되는 장점이 있습니다.
(실제로 Unity Event를 사용하지는 않았지만, 저희는 사용자들이 Unity Event처럼 사용할 수 있도록 거의 유사하게 개발하였습니다.)
(1) Event MethodCallback으로 변경해봅시다.




기존의 Event Listener가 없어지고, 이벤트 각각의 호출 대상을 지정하는 것으로 UI가 변경됩니다.




(1) + 버튼을 누릅니다.
(2) 이벤트 리스너와 콜백 함수를 설정할 수 있는 항목이 추가됩니다.




(1) 씬에서 이벤트를 받을 Monobehaviour 객체를 할당합니다.
(2) 우측의 빈칸을 클릭하면 이벤트를 받을 수 있는 함수 목록이 나타납니다. 적절한 함수를 선택합니다.
만약 하나의 GameObject에 두개 이상의 Monobehaviour 컴포넌트가 추가되어 있다면, 함수 목록을 통해서 리스너를 교체할 수 있습니다.




(1) 같은 방식으로 하나의 이벤트를 동시에 여러개의 리스너 또는 여러개의 함수에서 받을 수 있도록 설정할 수 있습니다.
(2) 항목을 삭제하고자 한다면 - 버튼을 누르세요.




콜백 함수를 지정할 때, 이벤트 형식(파라미터의 개수, 종류, 순서)에 맞는 함수가 없다면 위와 같이 리스트에 아무것도 나오지 않습니다.


어떤 방식을 사용하든 애니메이션 이벤트를 받아서 스크립트의 내용을 실행시킬 수 있는 것은 동일합니다.
자신에게 맞는 방식을 사용해보세요!