[Unity] Text에 타이핑 모션 넣기

개발 중인 게임을 만들던 중

튜토리얼을 만들 때가 됐다..!

(귀찮..)

자고로 말풍선은 타이핑 효과가 들어가 있어야지 보는 맛이 있는 법..!

그래서 타이핑 모션 효과를 넣는 방법을 작성하려고 한다.

 

- 22.12.27 추가

더 쉬운 방법을 포스팅했다.

[Unity] Text에 타이핑 모션 넣기(DoTween)

 

 

1. 한 문장 타이핑 모션 넣기

 

[준비]

일단 준비를 한다!

글씨체 준비 완료. 대사 준비 완료!

스크립트 준비 완료!

 

 

[타이핑 효과 코드 작성]

 

그럼 이제 타이핑 효과가 들어간 코드를 작성해 준다!

 

 

처음에 문자열을 꼭 null로 세팅해준다.

안그러면 텍스트박스에 있던 글자 뒤에 입력됨.. 해봐서 알아요 네..

 

글자 길이만큼 반복되게 설정해 주면 된다.

마음 급한 한국인이라서 한 글자당 0.05초로 설정했지만,

본인이 원하는 시간을 넣으면 된다.

 

 

짠 이렇게 타이핑 효과가 들어간 대사가 출력된다.

이렇게 대사가 애매한 곳에서 다음 줄로 넘어가는 게 신경쓰인다면

Replace를 이용해 바꿔주면 된다.

 

 

[문자 대체 사용하기]

Typing에 저 한 문장만 추가하면 된다.

Replace는 앞에 문자열을 뒤에 문자열로 바꿔준다.

나는 띄어쓰기 두번을 줄바꿈으로 교체하도록 설정했다.

 

그리고 줄바꿈을 하고 싶은 곳에 띄어쓰기 두 번을 넣어준다.

아까 오즈가 끊겼기 때문에 오즈 앞에 띄어쓰기 두 개를 넣어준다.

그리고 실행하면!

 

 

[실행결과]

깔끔하게 줄바꿈이 실행된 걸 알 수 있다!

굿~.~

 

 

 

 

 

 2. 여러 문장에 타이핑 효과 넣기

튜토리얼이 한 문장으로 끝나면 좋겠지만, 

말 많은 친구들도 있기 때문에 여러 문장에 타이핑 효과를 넣어보겠습니다.

이때는 배열을 이용해서 여러 문장을 순차적으로 출력하면 된다.

 

[문자열 배열 생성]

일단 이렇게 문자열 배열을 추가해준다.

 

dialogues는 매개변수를 저장하는 문자열 배열로 사용할 예정이다.

 

 

[매개변수를 이용한 함수 작성]

그리고 문자 배열을 매개변수로 받아서 대사를 출력할 수 있도록 코드를 작성한다.

 

 

[함수 추가]

아까 작성한 Typing에 이렇게 두 줄을 추가한다.

 

그리고 Start에서 아까 작성한 코드들을 주석처리하거나 지워주고,

StartTalk을 호출한다.

여기서 끝이 아니다!! 이제 대사를 작성하러 가보자!

 

 

[대사 작성]

이렇게 인스펙터 창에서 대사들을 작성해준다.

물론 코드로 작성해도 되지만 나는 비주얼 스튜디오 오래 보고 싶지 않기 때문에 인스펙터 창에서 작성했다.

인스펙터 창에서는 \n이 적용되지 않는다.

그래서 아까 Replace를 이용해 줄바꿈으로 대체했다.

 

 

[실행 결과]

이제 실행해보자!

잘 실행되는 걸 볼 수 있다. 끝!