[유니티 활용] 마우스 클릭한 곳으로 부드럽게 바라보며 캐릭터 이동시키기

이번 글에서는 디아블로와 같은 게임처럼 화면상에 마우스 클릭한 곳을 부드럽게 바라보며 캐릭터를 이동시키는 방법에 대해 알아보도록 하겠습니다. 

 

실습에 사용할 캐릭터는 다음의 링크에서 무료 캐릭터를 받아 사용해 주세요.

 

RPG Tiny Hero Duo PBR Polyart | 3D 휴머노이드 | Unity Asset Store

 

에셋을 다운로드 받고 import 하셨으면 다음 화면과 같이 객체를 생성해 줍니다.

 

캐릭터와 바닥 만들기

 

• 캐릭터는 경로 [Assets > RPG Tiny Hero Duo > Prefab] 에 있는 prefab 들 중 "MaleCharacterPBR" 을 Hierarchy 창에 드래그 하여 생성합니다. 이름은 Player 로 수정해 주세요.
• 바닥은 Hierarchy 창에서 큐브를 만들고 transform 을 다음과 같이 설정해 주세요.

• Player 객체를 선택하고 Inspector 창에서 Animator 컴포넌트를 비활성화 시킵니다. 비활성화 시키는 이유는 실행 시 모든 캐릭터 애니메이션이 순차적으로 플레이 되기 때문입니다. 
• 이제 Player 객체에 새로운 스크립트를 추가합니다. 스크립트의 이름은 똑같이 Player 로 하겠습니다.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Player : MonoBehaviour
{
   Vector3 destPos;
   Vector3 dir;
   Quaternion lookTarget;

   bool move = false;

   private void Start()
   {
 
   }

   private void Update()
   {
      // 왼쪽 마우스 버튼을 눌렀을 때
      if (Input.GetMouseButtonDown(0))
      {
         RaycastHit hit;
         // 메인 카메라를 통해 마우스 클릭한 곳의 ray 정보를 가져옴
         var ray = Camera.main.ScreenPointToRay(Input.mousePosition);
         
         // ray와 닿은 물체가 있는지 검사
         if (Physics.Raycast(ray, out hit, 100f))
         {
            print(hit.transform.name);
            
            // hit.point 는 마우스 클릭한 곳의 월드 좌표.
            // 이 예제에서 캐릭터의 y 값(높이) 은 변하지 않기 때문에 
            // 아래와 같이 목표위치를 재설정합니다.
            destPos = new Vector3(hit.point.x, transform.position.y, hit.point.z);
            
            // 현재 위치와 목표 위치의 방향 벡터
            dir = destPos - transform.position;
            
            // 바라 보아야 할 곳의 Quaternion
            lookTarget = Quaternion.LookRotation(dir);
            move = true;
         }
      }

      Move();
   }

   void Move()
   {
      if (move)
      {
         // 이동할 방향으로 Time.deltaTime * 2f 의 속도로 움직임.
         transform.position += dir.normalized * Time.deltaTime * 2f;
         // 현재 방향에서 움직여야할 방향으로 부드럽게 회전
         transform.rotation = Quaternion.Lerp(transform.rotation, lookTarget, 0.25f);
         
         // 캐릭터의 위치와 목표 위치의 거리가 0.05f 보다 큰 동안만 이동
         move = (transform.position - destPos).magnitude > 0.05f;
      }
   }   
}

 

• Quaternion.Lerp 함수는 첫 번째 인자로 받은 transform.rotation (캐릭터가 현재 바라보는 방향) 에서 lookTarget (목표 방향) 의 각도 중 0.25 (25%) 에 위치한 값을 반환합니다.
• 예를 들어 현재 바라보는 방향의 각도가 0˚ 이고 바라 보아야할 최종 각도가 90˚ 라고 하면 이 코드는 90˚ * 0.25 = 22.5˚ 를 반환합니다. 그 다음 프레임에서는 22.5˚ 부터 90˚ 사이의 25% 에 해당하는 값을 반환하기 때문에 캐릭터가 부드럽게 회전하는 효과를 연출할 수 있습니다.
• 회전 속도를 조절하려면 0.25f 의 값을 조절하면 됩니다.
• 캐릭터의 이동 속도는 2f 값을 조절하면 됩니다.

 

실행하면 다음과 같이 마우스를 클릭한 곳으로 캐릭터가 움직이게 됩니다. 다음 글에서는 캐릭터가 이동할 때 걷기 애니메이션을 적용하는 방법에 대해 알아보도록 하겠습니다.