이름 입력 기능(Input field, TextMeshPro), 캐릭터 선택 기능(캐릭터 선택창)

유승아·2024년 5월 13일

내일배움캠프

목록 보기
42/69

1. 이름 입력 기능

게임 시작 전 유저의 이름을 받는 기능을 구현했다.
Input field를 사용했다.

public class PlayerNameController : MonoBehaviour
{
    private Player _player;

    public InputField inputField;
    public GameObject joinGame;
    public TMP_Text nameTxt;

    private string _inputName;

    public void SavePlayerName()
    {
        _inputName = inputField.text;

        if (_inputName.Length >= 2 && _inputName.Length <= 10)
        {
            _player = new Player(_inputName); // 객체 생성 후 이름 저장
            nameTxt.text = _player._name;     //text에 player 이름 저장
            joinGame.SetActive(false);        //joinGame 끄기
        }
        else
        {
            inputField.text = "";
            inputField.placeholder.GetComponent<Text>().text = "2~10 글자 사이 입력";
        }
    }
}

이름은 2~10 글자 사이로 입력해야 하며,
입력한 내용의 길이가 올바르지 않으면 넘어갈 수 없다.

조건에 맞게 입력했으면 저장하고 다음 화면에서 이름 띄우기~
(Character Limit을 설정하려다 안 했는데 움짤을 보니 설정하는 것이 더 낫겠다. 수정사항!!)

두 글자일 때와 네 글자일 때 각각 텍스트 배경의 길이를 맞춰주고 싶었다.
일반 UI Text로는 못할 것 같아서 다른 방법을 찾아봤다.

그렇게 발견한 것이 TextMeshPro라는 것!
동적으로 길이를 변경할 수 있다고 한다.

첫 번째 움짤과 비교해 보면 텍스트 길이에 맞게 배경이 들어가 있는 것을 볼 수 있다!
구현하고 싶은 기능을 성공적으로 적용시킬 때의 그 기분이 너무 좋다!!🎈

TextMeshPro 사용방법 👉 https://mentum.tistory.com/258

TextMeshPro 주의점

유니티에서 기본적으로 사용하는 LiberationSans 폰트는 한글을 지원하지 않아서 이 폰트로 TextMeshPro를 사용하면...

한글이 네모네모빔을 맞아서 깨지게 된다.

그래서 한글을 지원하는 폰트를 찾고, TextMeshPro에서 폰트를 사용할 수 있게 설정을 해줘야 한다.

한글 폰트 깨짐 with Text Mesh Pro 👉 https://maloveforme.tistory.com/168

위 블로그 내용을 따라 순차적으로 진행하면 위에서 봤던 움짤처럼 한글이 잘 나오게 된다.


2. 캐릭터 선택창

public class CharacterListController : MonoBehaviour
{
    public GameObject CharacterList;

    public void OpenCharacterList()
    {
        if (CharacterList != null) //CharacterList가 null이 아닌지 확인
        {
            if (!CharacterList.activeSelf) //CharacterList가 비활성화 상태인지 확인
            {
                CharacterList.SetActive(true); //비활성화 상태일 때 활성화
            }
            else
            {
                CharacterList.SetActive(false); //활성화 상태일 때 비활성화
            }
        }
    }
}
public class CharacterSelection : MonoBehaviour
{
    public Sprite MainSprite;
    public Sprite YellowBear;
    public Sprite GreenSlime;
    public GameObject CharacterList;
    public Button CharacterSelectButton;
    public Image CharacterToChange;

    public void SelectMainSprite()
    {
        CharacterToChange.sprite = MainSprite;
        CharacterList.SetActive(false);
    }

    public void SelectYellowBear()
    {
        CharacterToChange.sprite = YellowBear;
        CharacterList.SetActive(false);
    }

    public void SelectGreenSlime()
    {
        CharacterToChange.sprite = GreenSlime;
        CharacterList.SetActive(false);
    }
}

각각의 이미지들을 버튼으로 만들고 버튼을 클릭하면 실행되는 메서드들을 작성했다.

아직 캐릭터 선택밖에 구현하지 못했다.
만약 이대로 JOIN을 누른다면 캐릭터 3개가 우르르 몰려다닐 것이다. 😅

색조합 팔레트 👉 https://colorhunt.co/palette/11235a596fb7c6cf9bf6eca9

0개의 댓글