탑다운 2D RPG - 대화창 UI 구축하기

골드메탈님의 유튜브 강의를 보고 배운 걸 정리하였습니다.

 

1. 대화창 UI

- 길이를 변형시켜도 이미지가 깨지지 않게하기 위해서 이미지 타입을 Sliced로 변경

-> Sliced 옵션을 사용하려면 Sprite 설정이 필요 -> Sprite 모서리를 잡기 위해 스프라이트 에디터에서 Border값 입력

 

- Anchor를 사용하여 항상 아래쪽에 붙어있게 설정

  - Shift를 사용하여 중심점까지 내리면 여백 계산이 쉬워짐

 

-판넬 이미지 안에 텍스트 생성

 

2. 데이터 전달

- 데이터 전달을 위한 게임매니저 생성

using UnityEngine;
using UnityEngine.UI;

public class GameManager : MonoBehaviour
{
    public Text talkText;
    public GameObject scanObject;
    public static GameManager instance = null;
    void Awake()
    {
        if (instance == null)
        {
            instance = this;
        }
    }

    public void Action(GameObject scanObj)
    {
        scanObject = scanObj;
        talkText.text = "이것의 이름은 " + scanObject.name + "이라고 한다.";
    }

}

// Scan Object
if(Input.GetButtonDown("Jump") && scanObject != null) 
    //Debug.Log("this is : " + scanObject.name);
    GameManager.instance.Action(scanObject);

- UI 프로그래밍 전에 꼭 먼저 UnityEngine.UI 넣기

- 인스펙터 창에서 public 변수 잊지 말고 채우기

 

3. 상태 전환

- SetActive()함수로 숨기기 & 보여주기를 구현

- 상태 저장용 변수를 추가

- 대화할 때, 플레이어가 움직여서 이탈할 우려가 있음 -> 상태 변수를 사용하여 플레이어 이동을 제한

using TMPro;
using UnityEngine;
using UnityEngine.UI;


public class GameManager : MonoBehaviour
{
    public GameObject talkPanel;
    public TextMeshProUGUI talkText;
    public GameObject scanObject;
    public bool isAction; // 상호작용 중인지 아닌지 판단

    public static GameManager instance = null;
    void Awake()
    {
        if (instance == null)
        {
            instance = this;
        }
    }

    public void Action(GameObject scanObj)
    {
        if (isAction) // Enter Action
        {
            isAction = false;
        }
        else
        {
            isAction = true;
            scanObject = scanObj;
            talkText.text = "이것의 이름은 " + scanObject.name + "이라고 한다.";
        }

        talkPanel.SetActive(isAction);
    }

}

// Check Button Down or Up
bool hDown = GameManager.instance.isAction ? false : Input.GetButtonDown("Horizontal");
bool vDown = GameManager.instance.isAction ? false : Input.GetButtonDown("Vertical");
bool hUp = GameManager.instance.isAction ? false : Input.GetButtonUp("Horizontal");
bool vUp = GameManager.instance.isAction ? false : Input.GetButtonUp("Vertical");

// Scan Object & Action
if (Input.GetButtonDown("Jump") && scanObject != null) 
    //Debug.Log("this is : " + scanObject.name);
    GameManager.instance.Action(scanObject);

 

4. UI 애니메이션

- UI 이미지 안에 UI 이미지 생성

- UI도 애니메이션 적용 가능

- 애니메이션 적용된 오브젝트를 선택하면 애니메이션 편집 가능

  - Add Property에서 Anchored Position 선택 (Anchor가 적용된 UI는 Anchored Position 선택)

  - 3개 키프레임 중에서 가운데만 Y값을 변경

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