[탑다운] 대화창 UI, 데이터 전달, 상태 전환, UI 애니메이션

이 글은 골드메탈님 수업을 듣고 작성하였습니다. 복습겸~

 

* 대화창 UI *

 

UI 를 사용할 때, 캔버스 안에 Pixel Perfect 를 체크해준다. 

* 주의 : 이미지가 깨질 때, Image Type -> Sliced 로 변경

* Slided 사용 전! Sprite Edit 해줘야함. 

(주의 : Sprite Edit 가 해당 이미지에 없을 경우 그 이미지를 포함하는 Sprite 에서 변경해줘야 한다. )

 

// Sprite  변하지 않을 부분을 위해 모서리를 잡을 Border값을 입력합니다. 

//그 후 Apply 후 Sliced 를 해줍니다. 

그 후 여백을 줘서 대화창의 위치를 보기 좋게 맞춰주면 된다. 

 

* 대화 텍스트는 이미지 안에 만들어야 한다. 

그 후 폰트를 넣어서 (걍 드래그) 이것 역시 잘 맞춰주면 된다. 

 

* 데이터 전달 *

: Debug.Log() 출력 결과를 UI 대화창에 집어넣는 방법  

 

★★★★★GameManager★★★★★ 

게임 매니저[이름 상관 없다. ]를 만든다. 

게임 오브젝트를 만든 후, 게임 매니저 스크립트를 만든다. 

#게임 매니저 스크립트 작성 

//UI 잊지말기 

using UnityEngine.UI;  

 

public class GameManager : MonoBehaviour
{
    //변수 2개 생성
    //대화 변수
    public Text talkText;
    //스캔한 오브젝트 변수 
    public GameObject scanObject; 
    //매개변수로 scanObj을 받는 함수 생성
    public void Action(GameObject scanObj)
    {
        scanObject = scanObj;
        //텍스트 넣기  
        talkText.text = "이것의 이름은" + scanObject.name + "입니다."; 
    }
}

 

이렇게 작성 후 Player 스크립트에 매니저함수를 호출 해야 한다. 

public GameManager manager; // 선언하여 주고 

//원래 이렇게 작성하였던 코드를

 if (Input.GetButtonDown("Jump") && scanObject != null)
            Debug.Log("이것은" + scanObject.name + "입니다.");  

 

//이렇게 변경하여 준다. 

if (Input.GetButtonDown("Jump") && scanObject != null)
            manager.Action(scanObject);  

 

*주의 : 게임매니저 인스펙터 창에서 public 변수를 잊지말고 채워야 한다. 

-> 생성한 변수 Talk Text 에 Text UI 를 채워놓는다. 

 

* 상태 전환 * 

//액션을 취할 때만 대화창 띄우기 

//액션을 취할 때만 사용하기 위해 변수 생성
public GameObject talkPanel; 

 

public void Action(GameObject scanObj)
    {
        //SetActive() : 숨기기와 보여주기를 구현해주는 함수 
        talkPanel.SetActive(true); 
        scanObject = scanObj;
        //텍스트 넣기  
        talkText.text = "이것의 이름은" + scanObject.name + "입니다."; 
    }

이후, 상태 저장용 변수를 추가해야 한다. 

대화창을 띄었는지 아닌지 확인해주는 bool 변수를 추가한다. 

//변수 생성

public bool  isAction ; 

//코드 재작성. 

 

public void Action(GameObject scanObj)
    {
        if (isAction)
        {
            isAction = false;
                     
        }
        else
        {
            isAction = true;
            scanObject = scanObj;
            //텍스트 넣기  
            talkText.text = "이것의 이름은" + scanObject.name + "입니다.";
        }

        //SetActive() : 숨기기와 보여주기를 구현해주는 함수    
        talkPanel.SetActive(isAction); 
    } 

//작성 후 image 를 숨긴후, GameManager 에 TalkPanel 을 넣으면 작동된다. 

//대화할 때, 플레이어가 움직여서 이탈할 우려가 있기 때문에 이도 해결을 해야한다. 

* 해결방법 :  player의 이동을 제한하여 isAction 을 취하고 있을 때 움직임을 막는다(0) 으로 

 

h = manager.isAction ? 0 : Input.GetAxisRaw("Horizontal");
        v = manager.isAction ? 0 : Input.GetAxisRaw("Vertical");

        //버튼 다운,업 확인하기 
        bool hDown = manager.isAction ? false : Input.GetButtonDown("Horizontal");
        bool vDown = manager.isAction ? false : Input.GetButtonDown("Vertical");
        bool hUp = manager.isAction ? false : Input.GetButtonUp("Horizontal");
        bool vUp = manager.isAction ? false : Input.GetButtonUp("Vertical");

 

이렇게 하면 끝. 

// 주의 : 콜라이더 영역을 줄이면 대화창이 오브젝트에 안 닿아서 안 뜰수도 있다. 

 

* UI 애니메이션 적용하기 * 

//Set Native Size : 원본 크기대로 이미지 사이즈를 맞춘다. 

1. UI 에 Animator 컴포넌트 추가한다. 

2. 그 후 프로젝트창에 Animator Controller 를 만든다. 

3. 그 후 오브젝트 Animator 에 컨트롤러에 삽입한다. 

4. 그 후 프로젝트창에 Animation 을 만든다. 

5. 그 후 Animator 창에 새로운 상태를 하나 만든다. [name =move]

6. 새로운 상태에 아까 만든 Animation 을 Motion 에 넣어준다. 

7. 그 후 Animation 창을 열어 Add Property 를 클릭해 Anchored Position 을 선택한다. [y값만 움직여야 한다. ] 

8. 그 후 키프레임 중에서 가운데에서 Y값만 변경한다. 30 -> 40 -> 30 

9. 애니메이션 완성.  

 

//속도 조절 Animator 의 Speed 를 조정한다. 

 

Q. 애니메이션이 멈춰있다. 

A. 반복성 애니메이션은 파일을 클릭해서  Loop Time 을 체크한다. 

 

진짜 끝.