5. 유니티_메인화면 만들기

어제 배웠던 거 그대로 화면 만듦. 공부만 하면 프로젝트 완성까지 걸리는 시간이 너무 오래 걸릴 것 같아서, 이제 만들면서 진행하려고 한다.
어제는 잡코리아 이력서를 작성하다가 포트폴리오랑 자격증을 제외하면 나름.. 그렇게 나쁜 스펙은 아닌 것 같다는 생각을 했다. 자격증.. 자격증은 이번 프로젝트의 베타 버전이 완성될 때까지는 생각하지 않으려고 한다. 일단 포폴 확실하게 만들자
 
<UGUI 기초2 – 메인화면 만들기>
 
UI : User Interface
CUI : Character UI. 문자를 입력해서 상호작용 (ex. 머드게임)
GUI : Graphic UI. 이미지와 문자의 혼합된 형태. 마우스를 이용해서 상호작용 가능
UGUI : Unity Graphic UI
 
캔버스의 해상도 = 게임 해상도
 
키보드 2 : 2D뷰 전환
마우스 좌클릭으로 이동, 휠로 크기 조절가능
 
[배경 화면 만들기]
Canvas 이름을 ‘Main Menu Canvas’로 바꾸고, 안에 있는 이미지 이름을 ‘Background’로 바꾼다.
이미지 크기는 캔버스의 해상도에 맞춰서 키운다. (ex. 1920x1080)
텍스트(게임제목)를 추가해준 뒤 적당히 배치.
 
[이미지 추가] (추가할 게 없으면 생략)
이미지를 프로젝트 창에 추가, Sprite로 바꿔준다.
Hierarchy창에서 이미지 파일을 만들고 프로젝트 창의 내 에셋에서 드래그&드롭.
Set Native Size 버튼을 눌러서 원본 크기로 만든다.
 
[버튼 추가]
버튼을 생성, 텍스트 변경. 복붙으로 버튼을 여러 개 만들어준다.
기본 버튼 : ‘새 게임’, ‘불러오기’, ‘옵션’, ‘종료’
Hierarchy창에서 버튼 이름도 적절히 바꿔준다. (버튼 1 2 3이면 나중에 헷갈리니까)
<버튼을 누를 시 실행되는 함수 만들기>
스크립트를 새로 만든다. 아래와 같은 함수를 스크립트에 추가.
 

public void OnClickStart(){
}

public void OnClickLoad(){
}

public void OnClickOption(){
}

public void OnClickQuit(){
#if UNITY_EDITOR // 에디터에서 실행할 시 이 방법으로 종료
       UnityEditor.EditorApplication.isPlaying = false;
#else
       Application.Quit(); // 에디터에서는 동작하지 않는 함수. 그래서 전처리기 써서 위 실행.
#endif
}

 
불러올 수 있도록 앞에 꼭 public 붙여주기
전처리는 컴파일 전에 소스 파일을 정리하여, 정의된 부분만 컴파일 하는 것이다. #으로 시작함.
(https://coderzero.tistory.com/entry/%EC%9C%A0%EB%8B%88%ED%8B%B0-C-%EA%B0%95%EC%A2%8C-16-%EC%A0%84%EC%B2%98%EB%A6%AC%EA%B8%B0-%EC%A7%80%EC%8B%9C%EC%96%B4Preprocessor-Directive 참고)
‘Main Menu Canvas’에 스크립트를 추가한다.(드래그&드롭)
버튼 컴포넌트를 누르면 Inspector 하단 쪽에 On Click()이 있는데 + 버튼을 눌러서
비어있는 곳(None(Object))에 ‘Main Menu Canvas’를 드래그&드롭 한다.
이러면 ‘Main Menu Canvas’에 들어간 스크립트 속 함수를 버튼에 입힐 수 있는 것이다.
 
플레이 버튼을 눌러서 실행해본다.
 
참고한 유튜브 강좌 : https://youtu.be/LooUj77MVSU?si=PII-JJJvz5l5m2z5
 
 
<강좌 보고 메인 화면 만들기>
유니티를 굉장히 오랜만에 켰다. 근데 캔버스 크기 조절부터 막혀서 검색해보니 canvas -> 렌더링 모드를 월드 공간으로 바꾸니까 되었음.

 
근데 월드 공간을 쓰는 이유가 2D + 3D 오브젝트 사용 시 쓰는 거래서.. 이게 아니었음.
그러다 문득 든 생각. 아. 나 유니티 교과서 있지.
펼치자마자 문제 해결~ (스마트폰용 크기로 설정하고 싶었는데 파일->빌드 설정 에서 플랫폼 변경하면 되는 거였음)

플랫폼 중에 안드로이드 설치 안 되어있어서 일단 설치해줌.

 
그리고 유지보수 좀 귀찮아보여서 WebGL로 웹게임을 만들어볼까 생각도 해봤는데 이건 javascript로 개발 가능한 거라 패스. 근데 챗지피티한테 다시 물어보니까 ' 유니티는 C#을 기본 언어로 지원하며, WebGL 빌드를 생성할 때 C# 스크립트를 자동으로 JavaScript로 변환하여 웹에서 실행할 수 있게 해줍니다.' 라고 한다. 아? 일단 참고.
 
그리고 원래 모바일용으로 개발하려고 했는데 윈도우용으로 만들어야겠다. 스팀 출시 후 플레이스토어에 올리는 식으로 해야겠음. 그냥 기본적으로 가로모드가 되도록 해야겠다.
운이 좋을 경우 스트리머들이 하면 홍보가 되기 때문에.. 이를 생각해서 윈도우로 플랫폼 결정. (누가 해준데?라고 하면 할 말은 없음.ㅋ)
 
일단 배경 꽉 차게 하는 법 알았음. 앵커 Alt+Shift로 모서리에 박아넣은 다음 ‘오른쪽’이랑 ‘하단’의 숫자를 0으로 바꿔준다. (그냥 드래그로 크기 조절 해보면 무슨 말인지 알거다.)

근데 텍스트 넣으려고 보니까 textmashpro라고 뜬다.
그래서 아래 링크 따라해봄
https://coderzero.tistory.com/entry/%EC%9C%A0%EB%8B%88%ED%8B%B0-%EB%A7%A4%EB%89%B4%EC%96%BC-TextMesh-Pro

Windows -> Fonts 에 전에 다운받아둔 Pretendard를 사용했다. 일단은?

오 잘 되는데
근데 텍스트 입력할 때 에러가 개많이 뜸.

뭐가 문제일까 생각해봤는데 이게 글자는 있는데 자음 모음이 없어서 아마
ㄱ 이런 식으로 자음만 입력한 상태에서는 폰트가 없으니까 에러메시지가 뜨는 것 같다. 폰트 에셋 만든거 그냥 지우고, Custom Character List에 자음 모음을 추가해서 다시 만들었다.

 
ㄱㄴㄷㄹㅁㅂㅅㅇㅈㅊㅋㅌㅍㅎㅏㅑㅓㅕㅗㅛㅜㅠㅡㅣㅢㅐㅔㅒㅖㅚㅟㅙㅞㅆㄲㄸㅉㅃ
이렇게 넣어줬다. 그랬더니 해결.
 
근데 텍스트 UI 하나 만들 때마다 폰트를 바꿔줘야 함. 귀찮음.
아예 폰트 기본으로 설정해놓을 수 있는 방법을 찾아보겠다.
 
근데 뺣이랑 훓 이런 글자들이 안 먹히길래 뭐야? 하면서 모든 글자가 다 있는 걸 찾아보았으나.. 안 보이기도 하고 (찾으면 보일 것 같긴 함) 생각해보니 굳이 내가 저런 단어들을 쓸일은 없을 것 같다..는 생각이 들었다. 만약에 쓸 일이 있으면 추가하면 되고..
 
아니 근데 이게 문제가 아니라 게임뷰가 이상함. 왜 이렇게 확대가 되어있지? 음.. 그냥 스케일을 줄이면 되나보다. 나중에 해상도에 따라 UI가 맞춰지는 코드도 추가해야겠다. 아직은 기능 먼저 구현해야한다.

 
오 그리고 text 한 번에 바꾸는 방법을 찾았다.
Text 컴포넌트의 폰트를 일괄로 바꾸고 싶을 시 -> Hierarchy창의 검색창에다 Text를 입력하면 Text 컴포넌트가 사용된 게임 오브젝트만 쫙 뜨니까 전부 선택해서 인스펙터창에서 폰트 바꾸면 된다. (https://gall.dcinside.com/mgallery/board/view/?id=game_dev&no=19220 출처)
(아 근데 text명이 바뀌면 Text1, Text2 이런 게 아니게 되어서 안 뜸. 그니까 text명 바꿀거면 Text_Title 이런 식으로 바꾸자)
 
암튼 스트립트로 버튼에 기능 구현하는 것까지.. 완료
코드 그대로 넣어보았다.