[유니티] 미니맵 아이콘

회전하는 미니맵에서 아이콘이 플레이어의 방향에 따라 함께 회전을 해야 자연스러운 연출이 가능합니다. 그렇지 못한 경우에는 매우 어색한 연출로 보일 수 있습니다.

 

💬 차이점 예시

• SynchronousRotation이 포함되어있지 않은 경우에 플레이어가 회전을 하여 미니맵이 회전할때, 아이콘들은 함께 회전하지 않아 방향이 이상하게 보이는 것을 볼 수 있습니다.
• 이를 개선하기위해 SynchronousRotation를 사용하면 플레이어의 회전에 상관없이 항상 올바른 방향으로 보이는 것을 볼 수 있습니다.

 

왼쪽 이미지와 오른쪽 이미지의 차이점을 보면 깃발의 방향이 다르다.

 

✅ 구현(스크립트 작성)

· SynchronousRotation

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

public class SynchronousRotation : MonoBehaviour
{
    [Header("동기화 할 대상의 트랜스폼")]
    [SerializeField] private Transform mSynchronizeTarget;

    [Header("동기화시 각도의 오프셋")]
    [SerializeField] private Vector3 mEulerAnglesOffset;

    [Header("로컬 회전값으로 적용하는가?")]
    [SerializeField] private bool mIsLocalRotation = false;

    [Header("동기화 할 축")]
    [SerializeField] bool mSyncX;
    [SerializeField] bool mSyncY;
    [SerializeField] bool mSyncZ;
    
    private Vector3 GetRotation()
    {
        return new Vector3(
            mSyncX ? mSynchronizeTarget.eulerAngles.x : 0f + mEulerAnglesOffset.x, 
            mSyncY ? mSynchronizeTarget.eulerAngles.y : 0f + mEulerAnglesOffset.y, 
            mSyncZ ? mSynchronizeTarget.eulerAngles.z : 0f + mEulerAnglesOffset.z);
    }

    private void Update()
    {
        if(mIsLocalRotation)
            transform.localEulerAngles = GetRotation();
        else
            transform.eulerAngles = GetRotation();
    }
}

 

[Header("동기화 할 대상의 트랜스폼")]
[SerializeField] private Transform mSynchronizeTarget;

• 대상의 트랜스폼에서 회전값을 가져옵니다.
• 대상의 회전값과 이 컴포넌트가 추가된 자신의 회전값이 일치하게 됩니다.

 

[Header("동기화시 각도의 오프셋")]
[SerializeField] private Vector3 mEulerAnglesOffset;

• 필요한 경우에 회전값에서 일정한 값을 추가하여 계산할 필요가 있습니다.
• 이런 경우에 오프셋을 사용하여 추가 각도를 더해줍니다.

 

[Header("로컬 회전값으로 적용하는가?")]
[SerializeField] private bool mIsLocalRotation = false;

• 자기 자신의 회전값을 로컬 회전값으로 설정할지, 월드기준 회전값으로 설정할지 정합니다.

 

[Header("동기화 할 축")]
[SerializeField] bool mSyncX;
[SerializeField] bool mSyncY;
[SerializeField] bool mSyncZ;

• 모든 축을 동기화하는것이 아닌 지정한 축만 동기화할 수 있도록 설정합니다.

 

private Vector3 GetRotation()

• 회전 값을 가져옵니다.
• 동기화할 축 설정에 따라 가져오는 값이 다릅니다.

 

private void Update()

• 해당 오브젝트가 활성화 되어있으면 매 프레임마다 대상 트랜스폼의 각도와 동기화하게 됩니다.

 

✅ 사용 예시

• 네비게이션에서 사용할 도착지 아이콘(깃발)을 설정하도록 하겠습니다.

 

• 미니맵에 사용할 아이콘을 적당한 크기와 위치로 설정합니다.

 

• 깃발 이미지의 아이콘에 SynchronousRotation 컴포넌트를 추가하고 설정을 해줍니다.
• 이미지의 특성상 X값 회전 오프셋을 90으로 설정하였습니다.
• Y축만 회전을 시킬 것이기에 Y축만 활성화하였습니다.

 

• 깃발 이미지가 플레이어가 회전할 때 함께 회전하는 것을 볼 수 있습니다.