project2 개발일지 - 3 [Lobby UI 기능연결]

Lobby UI 기능연결 목표

이전에 만든 UI를 기반으로 기능을 연결한다.
당장 연결하지 못한다고 해도 사용할 함수 인터페이스만 뚫어준다.

 

인프런에서 공부한 프레임워크를 기반으로 만들기 때문에,

처음 코드를 본 사람들은 사용하지 못한다.

 

1. Json과 텍스트 연결

우선 각 버튼에 쓰일 내용과 이름을 json에 구조로 만들어준다.

 

인프런에서 학습한 코드를 기반으로 name을 key로, text를 value로 갖는 Dict를 만들어준다.
이는 싱글톤으로 제작된 dataManager에서 관리되며,

필요에 따라 컨텐츠 코드에서 사용할 예정이다.

 

데이터 매니저를 통해 정보를 가져와서 텍스트를 바꿔주면된다.

해당 코드에서 GetTMP는 인프런을 통해 학습한 코드 기반이다.

 

test라는 텍스트에서 원하는 텍스트로 잘 바뀐것을 확인했다.

 

2. 버튼 이미지 Sprite Swap

이미지 자체는 다음과 같이 간단하게 설정해줬다.

다만 문제가 하나 발생했다.

기획자가 원하는 것은 텍스트의 뒷 배경이 투명이길 원했다.
따라서 alpha값을 0으로 설정하니 바뀐 스프라이트도 alpha값이 0인 문제가 발생했다.

즉 마우스가 버튼 위에 있다면 alpha값이 1, 밖에 있다면 alpha 값이 0으로 바뀌어야 한다는 것이다.

 

3. alpha값 문제 해결 및 버튼 이벤트 연결

문제를 해결하기 위해 다음과 같은 인터페이스를 기존 코드에 추가해주었다.

이제 마우스 포인터가 객체에 들어가고 나가는 이벤트를 바인드해줄수 있다.

이제 필요한 함수를 만들어주고, 이벤트를 바인드해주면 완성된다.

 

이제 각 버튼을 눌렀을때 호출될 함수를 바인드해준다.

 

마무리

기본적으로 기획자가 넘겨준 자료를 바탕으로 LobbyUi를 작성했다.
이번 개발일지에서는 포인터 이벤트 핸들러 인터페이스를 활용해 기능을 추가할수 있었다.

다음으로는 Setting UI를 만들 예정이다.