[유니티]Unity에서 DOTween 사용하기: 초보자를 위한 가이드

 Unity에서 애니메이션을 구현할 때, DOTween은 간단하면서도 강력한 툴입니다. 이 글에서는 DOTween의 설치부터 기본 사용법, 그리고 실제 프로젝트에서 자주 사용되는 기능까지 차근차근 설명드리겠습니다.

---

1. DOTween이란?

DOTween은 Demigiant에서 개발한 Unity용 트위닝(tweening) 라이브러리입니다. 트위닝이란 오브젝트의 위치, 크기, 색상 등을 부드럽게 변화시키는 작업을 의미합니다.
Unity에서 애니메이션을 구현할 때 코드 몇 줄로 간단하게 애니메이션 효과를 줄 수 있어 매우 유용합니다.

---

2. DOTween 설치하기

DOTween은 Unity Asset Store에서 무료로 다운로드할 수 있습니다.

1. Unity Editor의 상단 메뉴에서 Window > Asset Store로 이동합니다.
2. 검색창에 "DOTween"을 입력하고 DOTween를 찾습니다.
3. 프로젝트에 Import합니다.
4. DOTween Utility Panel을 열기 위해 상단 메뉴에서 Tools > Demigiant > DOTween Utility Panel을 클릭합니다.
5. Setup DOTween 버튼을 클릭하여 초기 설정을 완료합니다.

---

3. DOTween 기본 사용법

DOTween의 기본 사용법은 특정 속성을 애니메이션화(tweening) 하는 것입니다. DOTween은 객체의 위치, 크기, 회전, 색상, 투명도 등 다양한 속성을 제어할 수 있습니다.

3.1 오브젝트 이동하기

using DG.Tweening; // DOTween 네임스페이스를 반드시 추가

void Start()
{
    // GameObject의 transform을 3초 동안 (3, 3, 3) 위치로 이동
    transform.DOMove(new Vector3(3, 3, 3), 3f);
}

3.2 크기 조정하기

void Start()
{
    // GameObject의 크기를 5초 동안 2배로 증가
    transform.DOScale(new Vector3(2, 2, 2), 5f);
}

3.3 색상 변경하기 (UI 사용 예시)

using UnityEngine.UI;

public Image image;

void Start()
{
    // Image 컴포넌트의 색상을 빨간색으로 2초 동안 변경
    image.DOColor(Color.red, 2f);
}

---

4. DOTween의 다양한 설정

4.1 Ease (애니메이션 가속 및 감속)

애니메이션의 속도를 자연스럽게 만들기 위해 DOTween은 다양한 Ease 옵션을 제공합니다.

void Start()
{
    // Ease.InOutBounce로 위치 이동
    transform.DOMove(new Vector3(3, 3, 3), 3f).SetEase(Ease.InOutBounce);
}

주요 Ease 옵션

• Ease.Linear: 일정한 속도로 애니메이션
• Ease.InQuad: 천천히 시작해서 빠르게 가속
• Ease.OutQuad: 빠르게 시작해서 천천히 멈춤
• Ease.InOutBounce: 튕기는 듯한 효과

---

4.2 Loop (애니메이션 반복)

애니메이션을 반복하거나 왕복하도록 설정할 수 있습니다.

void Start()
{
    // 위치를 2번 반복
    transform.DOMove(new Vector3(3, 3, 3), 3f).SetLoops(2);

    // 왕복 애니메이션 (PingPong 효과)
    transform.DOMove(new Vector3(3, 3, 3), 3f).SetLoops(-1, LoopType.Yoyo);
}

---

4.3 Delay (지연 시간)

애니메이션을 시작하기 전에 대기 시간을 추가할 수 있습니다.

void Start()
{
    // 2초 대기 후 애니메이션 시작
    transform.DOMove(new Vector3(3, 3, 3), 3f).SetDelay(2f);
}

---

5. Sequence로 복잡한 애니메이션 구현하기

DOTween의 Sequence를 사용하면 여러 애니메이션을 순서대로 실행하거나 동시에 실행할 수 있습니다.

5.1 순차적으로 실행

void Start()
{
    Sequence sequence = DOTween.Sequence();
    sequence.Append(transform.DOMove(new Vector3(3, 3, 3), 2f)); // 첫 번째 애니메이션
    sequence.Append(transform.DOScale(new Vector3(2, 2, 2), 1f)); // 두 번째 애니메이션
    sequence.Append(transform.DORotate(new Vector3(0, 180, 0), 2f)); // 세 번째 애니메이션
}

5.2 동시에 실행

void Start()
{
    Sequence sequence = DOTween.Sequence();
    sequence.Join(transform.DOMove(new Vector3(3, 3, 3), 2f)); // 이동
    sequence.Join(transform.DOScale(new Vector3(2, 2, 2), 2f)); // 크기 변경
}

---

6. DOTween으로 UI 효과 만들기

DOTween은 UnityEngine.UI를 지원하여 버튼, 텍스트, 슬라이더 등의 UI 요소에 애니메이션을 쉽게 추가할 수 있습니다.

6.1 버튼 클릭 시 크기 변경

using UnityEngine.UI;

public Button myButton;

void Start()
{
    myButton.onClick.AddListener(() =>
    {
        myButton.transform.DOScale(new Vector3(1.2f, 1.2f, 1.2f), 0.2f).SetLoops(2, LoopType.Yoyo);
    });
}

6.2 텍스트 페이드 효과

using UnityEngine.UI;

public Text myText;

void Start()
{
    // 텍스트의 투명도를 2초 동안 0으로 변경 (페이드 아웃)
    myText.DOFade(0, 2f);
}

---

7. DOTween의 고급 기능

7.1 콜백 사용

애니메이션 완료 후 특정 동작을 실행하고 싶을 때는 OnComplete 콜백을 사용합니다.

void Start()
{
    transform.DOMove(new Vector3(3, 3, 3), 3f).OnComplete(() =>
    {
        Debug.Log("애니메이션 완료!");
    });
}

7.2 Kill로 애니메이션 중단

현재 실행 중인 애니메이션을 중단하려면 Kill 메서드를 사용합니다.

void Start()
{
    var tween = transform.DOMove(new Vector3(3, 3, 3), 3f);
    
    // 1초 후에 애니메이션 중단
    Invoke("StopTween", 1f);

    void StopTween()
    {
        tween.Kill();
    }
}

---

8. 마무리

DOTween은 간단한 설치와 직관적인 사용법으로 Unity에서 애니메이션을 구현하는 데 매우 유용한 도구입니다. 이 가이드는 DOTween의 기초부터 다양한 기능까지 다루었으며, 프로젝트에서 더욱 복잡한 애니메이션을 만들 때도 큰 도움이 될 것입니다.
DOTween 공식 문서도 함께 참고하면 더욱 다양한 활용이 가능합니다: DOTween 공식 문서

---

요약

• DOTween 설치: Asset Store에서 다운로드 후 설정.
• 기본 조작: DOMove, DOScale, DOColor 등 다양한 메서드 제공.
• 복잡한 애니메이션: Sequence로 다단계 애니메이션 구현 가능.
• UI 효과: 버튼 클릭, 텍스트 페이드 등 다양한 UI 애니메이션 지원.