2D 타워디펜스 - 3. 몬스터 애니메이션, 스프라이트시트 사용하기

몬스터가 움직일 때 애니메이션을 구현해봤다.

이미지 소스는 여기서 다운로드 받음 → http://untamed.wild-refuge.net/rmxpresources.php?characters

스프라이트시트 사용하기

여기서 받은 소스들은 스프라이트 시트로 되어있는데 이걸 여러개의 스프라이트로 나눠쓰려면

아래와 같이 이미지를 누르고 Sprite Mode를 Multiple로 변경한다.

그리고 Sprite Editor를 눌러 Editor가 나오면 위에서 Slice 버튼을 누르고 Automatic으로 Slice 하면된다.

그렇게 하면 스프라이트 시트에서 스프라이트가 자동으로 쪼개져 아래와 같이 나오게된다.

이제 나눈 스프라이트로 애니메이션을 만들어보자.

애니메이션을 만들 여러개의 스프라이트를 동시에 선택한 후 Hierarchy뷰로 드래그하면 애니메이션 생성창이 뜬다.

그렇게 방향마다 애니메이션을 전부 생성한다.

이후 애니메이션과 함께 생성된 컨트롤러 파일을 더블클릭하면 애니메이터창이 뜨고

기본으로는 Entry에서 실행될 애니메이션이 하나만 연결되 있을것이다.

그 화면에서 위와 같이 나머지 애니메이션들도 전부 드래그하여 넣어 준 후에

Any State에서 오른쪽 마우스를 눌러 Make Transition을 눌러서 전부 연결해주면 된다.

이렇게하면 시작할 때는 sbDown이 불리게되고 이후 어느상태라도 다른 상태의 애니메이션으로 전환할수 있게 된다.

다음은 옆의 창에서 Parameters 탭에서 +를 눌러 Trigger를 추가해준다.

그리고 Any State에서 애니메이션으로 연결되는 화살표를 누른 후 Inspector에서 Conditons에 +를 눌러

방금 만든 트리거를 추가해준다.

이 작업은 Down 트리거가 세팅되면 이 화살표를 실행하겠다는 것이다. 즉 sbDown 애니메이션을 실행하겠다는 것.

이렇게 4개의 화살표 전부 각자 맞는 트리거를 세팅해준다.

그리고 Settings의 Transition Duration을 0으로.

이 수치는 애니메이션이 전환될때 어느정도의 시간이후에 전환될 것인지를 설정하는건데 

0으로 맞추게되면 애니메이션이 확확 바로 바뀌게된다.

우리는 맵이 꺾이면 바로바로 애니메이션이 바뀌길 원하므로 0으로 설정해준다.

몬스터 이동 스크립트에서는 1초마다 다음경로를 찾을때 현재 방향을 확인하여 그에 맞게 트리거를 세팅해주면

회전할때 애니메이션이 자동으로 변경된다.

nowPos = new Vector3(movePath[nowCount].x, movePath[nowCount].y, 0);
targetPos = new Vector3(movePath[nowCount + 1].x, movePath[nowCount + 1].y, 0);
dir = (targetPos - nowPos).normalized;
                
// 이전방향이랑 다를때만 회전해줌
if (preDir != dir)
{
    if (dir == Vector3.up)
    {
        var ani = GetComponent<Animator>();
        ani.SetTrigger("Up");
    }
    else if (dir == Vector3.down)
    {
        var ani = GetComponent<Animator>();
        ani.SetTrigger("Down");
    }
    else if (dir == Vector3.left)
    {
        var ani = GetComponent<Animator>();
        ani.SetTrigger("Left");
    }
    else if (dir == Vector3.right)
    {
        var ani = GetComponent<Animator>();
        ani.SetTrigger("Right");
    }
}
preDir = dir;

실행화면

td_animation.mp4