[TIL] DOTween 사용

DOTween 

두트윈, 닷트윈 

간단한 동작을 따로 애니메이션 설정이나 복잡한 코드 없이 움직임을 구현해주는 API로 유니티의 에셋스토어에서 다운로드 할 수 있으며 무료판과 유료판이 있다.

 

원래 만들던 블록깨기 기능은 블록을 깨면 아이템이 자동으로 생성되고 그걸 공이 먹으면 효과가 적용되는 거였지만

공이 아이템을 먹지 않고 패들이 먹는걸로 바뀌게 되면서 아이템이 내려오는 모션이 필요하게 되었다.

 

옛날에 살짝 만져보고 안써본 기능이지만, 이번에 아이템이 떨어지는걸 구현하면서 물리자체는 무거운 기능이니  Rigidbody의 gravity 대신에 DoTween을 사용해 구현해보는게 어떠냐 하셔서 다시 한번 만져보게 되었다.

 

설치방법

유니티 에셋스토어에서 먼저 설치해 준 다음에 프로젝트에 불러와준다.

Import를 해준 다음에 SetUp을 눌러서 기다려 주면 설치가 완료된다.

 

using DG.Tweening;

 

DoTween에는 많은 함수가 있고 스크립트에서 사용하기 위해서는 using문을 선언해 줘야한다.

간단하게 사용하기 좋을 것 같은 함수를 몇가지 정리해 봤다.

움직임 관련 함수

transform.DOMove(Vector3 원하는 위치값, float 도달할 때 까지 걸리는 시간, bool 모든 값을 정수로 맞춤 )

transform.DORotate(Vector3 원하는 위치값 ,float  도달할 때 까지 걸리는 시간,RotateMode  mode)

RotateMode

Fast( 기본값 ): 360도 이상 회전하지 않는다.
FastBeyond360: 회전이 360를 넘어감

WorldAxisAdd: 최종 값이 항상 상대적이다.?
LocalAxisAdd: 지정된 회전을 변환의 로컬 축에 추가한다. 이 모드에서는 최종 값이 항상 상대적이다.

transform.DOScale(float/Vecotr3 원하는 목표값, float 도달할 때 까지 걸리는 시간 )

 

transform.DOMoveX( 원하는 위치값 .X, float 도달할 때 까지 걸리는 시간,  bool 모든 값을 정수로 맞춤 )

transform.DOMoveY( 원하는 위치값 .Y , float 도달할 때 까지 걸리는 시간, bool 모든 값을 정수로 맞춤  )

transform,.DoShakePosition(Vector3 지속시간, float 강도, int  얼마나 진동할지,float 흔들림의 무작위성, bool 모든 값을 정수로 맞춤 )

 

이미지 변환 관련

Image/SpriteRenderer.DOFade(Color 원하는 색깔 , f loat 도달할 때 까지 걸리는 시간 )

Image/SpriteRenderer. DoColor(Color, float 도달할 때 까지 걸리는 시간 )

 

DOText(string 문자열, float 도달할 때 까지 걸리는 시간 , ScrambleMode mode , ...너무많다)

사용시 문장열 하나를 한 글자씩 출력해 준다.

 

곡선 설정

DOTween에서는 .SetEase()를 사용하여 값을 보다 부드럽게 변경할 수 있다.

기존에 선언한 움직임 관련 DOTween 뒤에 붙여서 사용한다.

ex) transform.MoveX(positionX , 1f). SetEase(Ease.InElastic);

 

Loop하는 방법

기본적으로 DoTween은 한번 실행하고 나면은 끝이난다.

그런데 만약 Animaton의 Loop처럼 지속적으로 재생해주고 싶을때  기존에 선언한 DOTween 뒤에 .SetLoops(반복할 수, LoopType )를 붙여준다.

ex)  sprite.DOFade(0f, 0.1f).SetLoops(-1,LoopType.Yoyo);

 

-1을 넣는다면 계속해서 루프하라는 의미이다. (무한 반복)

 

LoopType 

Incremental  : 끝난 위치를 중심으로 모션이 다시 시작된다. 

Restart : 처음 위치로 가서 시작된다.

Yoyo : 끝난 위치부터 다시 되돌아간 후 재생된다.

 

시퀀스

기본적으로 앞에서 설명한 DOTweeen은 선언한 대로 순차적으로 실행되는게 아닌. 가장 나중에 입력된 DOTween을 우선시 하는 것 같았다. 

대신 시퀀스를 선언하여 사용하면, 원하는 애니메이션을 순서를 맞춰 실행 할 수도있고 효과를 두개 이상 겹쳐서 동시에 실행 할 수도 있다.

 void Start()
 {
     Sequence itemSequence = DOTween.Sequence();
     
     itemSequence.Append(transform.DOMoveY(endY, aniSpeed));//트윈 추가
     itemSequence.Prepend(float 시작할 시간,image.DOFade(0f, 3f));// 맨 앞에 추가
     itemSequence.Insert(image.DOFade(0f, 3f));//순서와 상관없이 특정 시간에 시작
     itemSequence.Join(image.DOFade(0f, 3f));//앞에 있는 트윈과 함께 재생

 }

.Apeend(Tween) : 시퀀스에 트윈 추가

.Insert(float 시간, Tween): 순서와 관계없이 특정 시간에 트윈 실행

.Join(Tween): 앞에있는 트윈과 함께 실행

.Prepend(Tweem) : 맨 앞에 트윈추가

 

 void Start()
 {
     Sequence itemSequence = DOTween.Sequence()
     .Append(transform.DOMoveY(endY, aniSpeed))//트윈 추가
     .Prepend(float 시작할 시간,image.DOFade(0f, 3f))// 맨 앞에 추가
     .Insert(image.DOFade(0f, 3f))//순서와 상관없이 특정 시간에 시작
     .Join(image.DOFade(0f, 3f));//앞에 있는 트윈과 함께 재생

 }

이런식으로 .앞에 시퀀스 이름을 적어 줄 필요 없이 작성해도 된다.

 

seqence 사용시 주의할 점

미리 앞에서 말한 LoopType 의 무한루프는 Seqence내 에서는 사용하지 못한다.

 

내 작업에 적용하면서 겪은 문제

앞에서 적은 두트윈을 바탕으로 아이템이 내려오는 작업을 작성하였다. 수정이필요 하지만..

간단하게 내려오는 코드로 딱히 오류가 뜨지 않았다.

 Sequence itemSequence;

 void Start()
 {
     itemSequence = DOTween.Sequence()
     .Append(transform.DOMoveY(endY, aniSpeed));
 }
 protected virtual void ItemEffect(GameObject ball)
 {
     Debug.Log("아이템 효과 발동");
 }
 protected void ItemDestroy()
 {
     Destroy(this.gameObject);
 }

 

그러나 패들로 아이템을 먹어서 업앴을 경우 오류로 게임이 멈추지는 않아도 유니티 콘솔창에 문구가 뜨게 되었다.

 

이 문제는 DOTween의 애니메이션이 실행되던 중에 오브젝트가 파괴되는 등의 이유로 찾지 못했을 때 뜨는 창으로

작동 자체에는 큰 문제가 없지만. 너무 많이 뜨기도하고.. 혹시 모르니 원인을 없애주기로 했따.

 

DOTween.Kill() : 실행하고있는 두트윈 실행 삭제

DoTween.KillAll() : 모든 두트윈 실행 삭제 (StopAllCorutine처럼 다 멈춘다)

 Sequence itemSequence;

 void Start()
 {
     itemSequence = DOTween.Sequence()
     .Append(transform.DOMoveY(endY, aniSpeed));
 }
 protected virtual void ItemEffect(GameObject ball)
 {
     Debug.Log("아이템 효과 발동");
 }
 protected void ItemDestroy()
 {
     itemSequence.Kill(this.transform);//추가한 부분
     Destroy(this.gameObject);
 }

오브젝트가 삭제되기 전에 미리 DOTWeen을 멈추면 경고가 뜨지 않는다!