자작 게임도 잘 부탁드려요~

adsense



유니티 2D 슈팅게임 개발일지 - 9일차 (팝업, 토글, 슬라이더, 드롭다운)

팝업창-환경설정창 만들기



팝업창의 기본 - 터치 삼키기(?)

cocos-2dx에서는 보통 swallow라고 하는건데
유니티에서는 일단 터치에 레이캐스트 타겟이 지정되어 있으면 기본적으로 동작하는 듯?

반투명 기본 이미지 bg(none sprite)를 설정하고,

화면 전체에 상하좌우 여백없이 스트래치하도록 설정하고
색상은 검은색, 반투명으로 화면 전체를 가리는 막을 하나 추가합니다.
레이캐스트 타겟이 기본 설정되어 있으므로 아래쪽으로의 클릭을 자연스럽게 차단합니다.

캔버스 설정

팝업창은 전용 캔버스를 붙여 만들고 설정은 위와같이 합니다.
프리팹으로 만들었을때는 카메라까지 할당할 수 없으니까,
팝업창을 생성한 후 동적으로 카메라를 할당해야 합니다.

  1. this.transform.Find("Canvas").GetComponent<Canvas>().worldCamera = Camera.main;
카메라 거리는 배경 맵보다 하나 가깝게
캔버스 스케일러 설정도 그림과 같이 해 줍니다.

그리고 종횡비 대응 처리를 한 스크립트를 붙입니다.

  1. Camera maincamera = GameObject.Find("Main Camera").GetComponent<Camera>();
  2. maincamera.orthographicSize = Screen.height / 2;
  3.  
  4. float fixedAspectRatio = 1080f / 1920f;
  5. float currentAspectRatio = (float)Screen.width / (float)Screen.height;
  6. if (currentAspectRatio > fixedAspectRatio)
  7. thisCanvas.GetComponent<CanvasScaler>().matchWidthOrHeight = 1;
  8. else
  9. thisCanvas.GetComponent<CanvasScaler>().matchWidthOrHeight = 0;
  10. }

9:16 화면의 경우
2208x1768 비율



토글과 슬라이더 연동

음악과 사운드(효과음)은 각각 온오프 토글과 슬라이더를 병용합니다.
musicToggle : 토글 객체
music : 슬라이더 객체

토글의 OnValueChanged 이벤트가 들어왔을 경우

  1. if (!musicToggle.isOn)
  2. {
  3. musicVol = music.value;
  4. music.value = 0;
  5. }
  6. else
  7. music.value = musicVol;
musicVol은 토글을 끄기 전에 기억해뒀던 값이기 때문에 토글을 켜면 1이 되는 것이 아니라 끄기 전의 값으로 복귀합니다.

슬라이더 OnValueChanged 이벤트가 들어왔을 경우

  1. bool isOn = musicToggle.isOn;
  2. if (music.value == 0 && isOn)
  3. {
  4. music.value = musicVol;
  5. musicToggle.isOn = false;
  6. }
슬라이더가 0 값이 들어오면 그 자체로 음악이 off되는 것인데,
이때 토글을 같이 꺼주기 위한 처리를 하고 있습니다.

그런데, 토글을 끄면 토글에서 OnValueChanged 이벤트가 또 발생합니다.

때문에 토글의 OnValueChanged이벤트에서 musicVol이 0이 되지 않도록 추가 처리를 하느라 구조가 묘하게 복잡합니다.

언어 선택 - 드롭다운
(현재는 실제로 언어가 바뀌지는 않고 환경설정값만 변경합니다)

Content 아래의 Item이 각 하나씩의 선택지로 여기에 크기, 위치 등 기본 규격을 잡아주고

드롭다운에서 Options를 설정하면

Template 영역에 해당 옵션이 드롭다운 리스트로 나옵니다.


만일 Template 영역에 리스트가 모두 표시되지 않으면 알아서 스크롤바가 활성화됩니다.
모양을 이쁘게 꾸미는게 쉽지 않네요.


할때마다 헷갈려서 이전 기록을 뒤져보곤 하지만, 그래도 이런 UI 종류는 그림만 있으면 쓱쓱 만들수 있어 좋네요..




덧글

댓글 입력 영역


Books

Geek라이프

기초부터 시작하는 모형 전자공작
박성윤 저

사이토 나오키의 일러스트 첨삭 레슨 Before & After
사이토 나오키 저/박수현 역

MSX&재믹스 퍼펙트 카탈로그
마에다 히로유키 저/조기현 역

핵심강좌! Cocos2d-x
이재환 저
예스24 | 애드온2
일본서적 전문사이트 NEPIC