결과물
개요
지난 시간에는 진동센서에서 값을 받아오는 것까지 포스트 했다
오늘은 본격적으로 유니티에서 아두이노 시리얼 통신 하는 법을 포스팅 해보겠다 !!!
필요한 것
1. Ardity 에셋 설치
일단 .. Ardity라는 플러그인을 설치해야한다..
이거 설치하는데만 반나절 걸렸는데 사실 잘 기억이 안난다..
설치하는데 오류가 너무 많이 나서..사실 나 혼자했으면 포기했을텐데
의지짱짱 팀원이 해결책을 알아와줘서 무사히 설치할 수 있었다..
2. 연결할 아두이노 센서
전 포스트에서 말했듯이, 우리 작품은 아두이노와 유니티의 연결이 필요하다,, 따라서 작품에 쓰일 아두이노 센서가 필요하다.
3. 3D 오브젝트, 애니메이션
우리 작품은
- 진동센서를 터치
- 터치를 감지
- 모델링 되어있는 꽃이 피어남
이기 때문에
3D 꽃 오브젝트 + 애니메이션 이 필요하다!
작업 시작
1. 3d 모델 불러오기
울 팀원이 준 디자인 파일..
일단 이 모델을 유니티 씬으로 가져온다
2. Create Empty
우리 작품은 진동센서 5개를 설치하고
1번 진동센서를 터치하면 -> 1번꽃이 핌
2번 진동센서를 터치하면 -> 2번꽃이 핌
이런식으로 진행할 것이기 때문에
이걸 한번에 Control할 Empty 오브젝트를 만들어준다.
사이드에 있는 꽃들을 Control해야한다는 의미에서 SideControl으로 지어줬다.
3. Serial Controller.cs 붙이기
에셋스토어에서 Ardity를 설치하면 Ardity\Scripts\SerialController.cs 파일이 생긴다. 그걸 그대로 빈 오브젝트에 붙인다.
Port Name에는 아두이노 보드 포트 넘버를 입력하고
Rate도 본인의 아두이노 Rate와 맞추면 된다
Message Listener에는 내가 시리얼 통신을 함으로써 움직이게 할 오브젝트를 넣어준다.
내 예시대로 입력하면 COM8로 들어오는 아두이노 값은 sideLily를 움직이게 하고
COM7로 들어오는 아두이노 값은 sideSaffron을 움직이게 한다.
4. Animator Controller 추가
디자이너가 애니메이션만 준다고 끝나는 게 아니다!!!
받은 애니메이션을 어떻게 컨트롤 할 지 로직을 짜야한다.
프로젝트 창에서 Animator Controller를 생성한다
그럼 이렇게 빈 애니메이터 컨트롤러가 생성된다!!!
그럼 여기에 이제 제맛에 맞게 애니메이터 로직을 짜주면 된다
내가 짠 로직은
✅1. 아두이노 센서가 진동 감지
2. isTouched라는 bool값이 true가 됨 (기본값 false)
☑️3. isTouched가 true가 되면 애니메이션 실행
4. 애니메이션이 실행되면 isAnimationPlaying 이라는 bool값이 true가 됨.
5. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└꽃이 피는 애니메이션을 하는 중에 진동이 감지되면 다시 꽃이 오므라드는 현상을 방지
6. 꽃이 피는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.
7. 다시 시리얼 통신을 재개함.
✅8. 사용자가 진동센서를 다시 터치하면 진동 감지
9. isTouched라는 bool값이 false가 됨
☑️10. isTouched라는 bool값이 false가 되면 꽃이 지는 애니메이션 실행
└ 사진에서 New State는 꽃이 지는 애니메이션
11. 애니메이션이 실행되면 isAnimationPlaying이라는 bool값이 true가 됨.
12. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└ 꽃이 지는 애니메이션을 하는 중 진동이 감지되면 다시 꽃이 피는 현상을 방지
13. 꽃이 지는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.
이번 단계에서 해줄 건 ☑️표시가 되어있는 애들이다.
(✅표시는 저번 포스팅에서 한 것)
이것의 무한 반복이다..
그래서 파라미터에 isTouched와 isAnimationPlaying를 추가해주고,
옆 공간에 꽃이 피는 애니메이션, 지는 애니메이션도 넣어주고,
그 사이에 Make Transition을 만들어서
isTouched가 true면 꽃 피는 애니메이션으로 Transition,
isTouched가 false면 꽃 지는 애니메이션으로 Transition하게 만들어 준다.
5. Animator 연결
이제 꽃 모델에 아까 열심히 만든 애니메이션 컨트롤러를 넣어줘야
꽃 모델이 내가 짠 대로 움직이게 된다.
애니메이션을 연결할 모델을 누르고 Add Component -> Animator 해준다.
그리고 Controller에 아까 열심히 만든 파일을 넣어준다!!!
6. 애니메이션에 Event 추가
✅1. 아두이노 센서가 진동 감지
2. isTouched라는 bool값이 true가 됨 (기본값 false)
✅3. isTouched가 true가 되면 애니메이션 실행
☑️4. 애니메이션이 실행되면 isAnimationPlaying 이라는 bool값이 true가 됨.
5. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└꽃이 피는 애니메이션을 하는 중에 진동이 감지되면 다시 꽃이 오므라드는 현상을 방지
☑️6. 꽃이 피는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.
7. 다시 시리얼 통신을 재개함.
✅8. 사용자가 진동센서를 다시 터치하면 진동 감지
9. isTouched라는 bool값이 false가 됨
✅10. isTouched라는 bool값이 false가 되면 꽃이 지는 애니메이션 실행
└ 사진에서 New State는 꽃이 지는 애니메이션
☑️11. 애니메이션이 실행되면 isAnimationPlaying이라는 bool값이 true가 됨.
12. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└ 꽃이 지는 애니메이션을 하는 중 진동이 감지되면 다시 꽃이 피는 현상을 방지
☑️13. 꽃이 지는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.이제 이번 단계에서는 ☑️을 하기 위해 애니메이션에 이벤트를 추가해야한다. (✅은 앞에서 완료한 것)
애니메이터 컨트롤러에서 꽃 피는 애니메이션을 2번 누르면 오른쪽에 저런 창이 뜰 것이다.
밑으로 죽죽 내려가면 이렇게 Event 창이 있는데
여기서
애니메이션이 시작될 때 AnimationStart
애니메이션이 끝날 때 AnimaionEnd이벤트를 넣어준다.
옆에 저 북마크 버튼을 누르면 이벤트 추가 가능!!!
7. 애니메이터 컨트롤러 파라미터를 조절할 스크립트 만들기
✅1. 아두이노 센서가 진동 감지
☑️2. isTouched라는 bool값이 true가 됨 (기본값 false)
✅3. isTouched가 true가 되면 애니메이션 실행
☑️4. 애니메이션이 실행되면 isAnimationPlaying 이라는 bool값이 true가 됨.
☑️5. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└꽃이 피는 애니메이션을 하는 중에 진동이 감지되면 다시 꽃이 오므라드는 현상을 방지
☑️6. 꽃이 피는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.
☑️7. 다시 시리얼 통신을 재개함.
✅8. 사용자가 진동센서를 다시 터치하면 진동 감지
☑️9. isTouched라는 bool값이 false가 됨
✅10. isTouched라는 bool값이 false가 되면 꽃이 지는 애니메이션 실행
└ 사진에서 New State는 꽃이 지는 애니메이션
☑️11. 애니메이션이 실행되면 isAnimationPlaying이라는 bool값이 true가 됨.
☑️12. isAnimationPlaying이 true인 동안은 시리얼 통신 중단
└ 꽃이 지는 애니메이션을 하는 중 진동이 감지되면 다시 꽃이 피는 현상을 방지
☑️13. 꽃이 지는 애니메이션이 끝나면 isAnimationPlaying이 false가 됨.이제 정말 하이라이트다.
☑️표시 되어 있는 걸 이번 단계에서 모두 완료할 수 있다.
일단 C# 스크립트를 생성하고,
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class AnimationController : MonoBehaviour
{
private Animator animator;
void Start()
{
animator = GetComponent<Animator>();
}
public void OnMessageArrived(string msg)
{
// 애니메이션이 재생 중이 아닐 때만 메시지 처리
if (animator.GetBool("isAnimationPlaying") == false)
{
Debug.Log("Message Arrived: " + msg);
// isTouched의 현재 값을 반전시켜 애니메이션 상태 변경
bool isTouched = animator.GetBool("isTouched");
animator.SetBool("isTouched", !isTouched);
}
}
public void AnimationStart()
{
Debug.Log("Animation has started.");
animator.SetBool("isAnimationPlaying", true);
}
public void AnimationEnd()
{
Debug.Log("Animation has ended.");
animator.SetBool("isAnimationPlaying", false);
}
}
start되면 animator를 불러오고,
진동이 감지돼서 시리얼 메세지를 받으면
public void OnMessageArrived(string msg)
{
// 애니메이션이 재생 중이 아닐 때만 메시지 처리
if (animator.GetBool("isAnimationPlaying") == false)
{
Debug.Log("Message Arrived: " + msg);
// isTouched의 현재 값을 반전시켜 애니메이션 상태 변경
bool isTouched = animator.GetBool("isTouched");
animator.SetBool("isTouched", !isTouched);
}
}이 부분이 실행되는 것이다.
1. 애니메이션이 실행중이면 값을 안 받는다.
if (animator.GetBool("isAnimationPlaying") == false)2. isTouched 상태 반전
// isTouched의 현재 값을 반전시켜 애니메이션 상태 변경
bool isTouched = animator.GetBool("isTouched");
animator.SetBool("isTouched", !isTouched);3. 애니메이션 이벤트와 연결
public void AnimationStart()
{
Debug.Log("Animation has started.");
animator.SetBool("isAnimationPlaying", true);
}
public void AnimationEnd()
{
Debug.Log("Animation has ended.");
animator.SetBool("isAnimationPlaying", false);
}AnimationStart이벤트가 실행되면"isAnimationPlaying"가true돼서 그 동안은 시리얼 통신 안 받게 설정AnimationEnd이벤트가 실행되면"isAnimationPlaying"이false가 돼서 그 다시 시리얼 받게 설정
8. 컴포넌트 추가
이제 위의 코드를 모델에 붙여주면 끝 !!!!
모델 누르고 위의 코드 스크립트를 붙여주면 결과물 완성 !!!
결과
앞으로 해야할 것
이제 남은건...
1. 심박수에 따라 꽃이 랜덤으로 나오게 하기
2. 심박수 -> 서보 모터 연결하기 다들 잘 지켜봐주세요 !!! ⋆♡̩͙⋆( ᵔ ᗢ ᵔ )
