unity3d UI 버튼이 갑자기 클릭이 안된다!? Canvas Group의 Blocks Raycasts 때문일수도!?

유니티3d의 UI작업중 코드수정을 한게 아닌데 버튼의 클릭이 동작을 하지 않아서 난감했었다. 문제해결 및 원인을 찾았기에 정리한다.

 

어느 평일 퇴근시간 1~2시간 전 일이었다.

내가 맡은 업무중에 내 생각으로 한 80%정도를 차지하는 ui의 기본동작과 실제데이터 연동은 마무리가 됐었다. 그리고 이제 남은작업은 유니티 animation으로 작업된 애니메이션 연출을 적용하기만 하면 됐다.

이 작업은 다행히 다른팀에서 선작업해서 넘겨주는 것이었기 때문에 몇가지 설명만 듣고 상황에 맞게 play만 해주면 될것이라 예상했다. 그러니 후딱 해버리고 칼퇴를 하기로 계획했다.........

 

 

But. 신이 인간을 볼때 제일 재밌다고 귀엽다고 느낄때가 이때라고 한다. 

오호라? 한치앞도 모르는 이것들이
계획을 하고 예상을 해?
이것봐라 ㅋㅋ


그렇다! 언제나 그렇듯이(?) 예상은 빗나가기 마련이었다. ㅎㅎ ㅠㅠ

 

하아.. 이제 남은 연출 작업만 연결해주면 해당 업무는 완료되는 모두가 해피한 엔딩이었었는데..! 후딱 해버리고 세상에서 제일 중요한 금. 황금, 지금, 퇴금(?) 을 해버리려고 했는데 말이다!  금만큼 좋은 퇴근 ㅇㅈ?!ㅋㅋ

 

암튼 git 업데이트를 받고 어떻게 돌아가는지 동작부터 미리 한번 보기위해, 유니티 플레이버튼을 눌렀는데! 왜때문에 ui의 클릭이 먹통이 되었다. 왜 동작하지 않는 것인지 알 수 없었다... 엑?? 갑자기 버그가!? ㅠㅠ 꼭 하필 퇴근할라면 퇴근전에 이런일이 생기는 이유는 대체 무어냐...

 

암튼튼.

흥분상태의 마음을 좀 가라앉히고 뭐가 문제인지 gameObject들을 하나씩 찬찬히 뜯어봤고 연출을 위해 들어갔던 컴포넌트중에 내가 몰랐었던 기능이 있어서 그걸 검색해봤다.

 

결국 버튼 클릭을 망쳐버렸던 막고있던건 바로 이놈.

그거슨 바로 CanvasGroup의 BlocksRaycasts 옵션 이었다.

 

block 이 '막다' 라는 뜻이니까 raycast를 막는 옵션이겠거니 예상했다. 그러니 on되어있으면 ui에 클릭이 안되게 하는거겠구나 하면서 이해했었고 옵션이 off된채로 되어있어서 넘어갔었는데 찾아보니 내가 알고있던 그 의미가 아니었다!

변수명이 진짜 진짜 중요한거다! 오해의 소지가 있게 만들지 말라능! ㅋㅋ

 

그래서 문제해결을 위해 CanvasGroup과 Blocks Raycasts 옵션을 검색해서 공부했고 나도 포스팅으로 다시 정리하면서 다시 이해해서 위의 문제상황도 해결했다! ㅎㅎ 다만, 칼퇴는 못했다.. ㅠ

 

 

 

 

CanvasGroup 에 Blocks Raycasts 의  on/off 상태 정리.

 

Raycast는 카메라에서 화면을 향해 쏘는 광선으로 이해하면 된다. Blocks Raycasts옵션이 켜있다면 그 광선을 ui가 맞고 뒤로 보낼것인지 안보낼 것인지의 옵션으로 이해하자.

on일 경우에 해당 자식들에만 클릭이벤트를 주고 뒷판으로 통과시켜주지 않는다! 블로킹! off일 경우 통과시킨다.

채치수의 공을  Raycasts 라고 생각하자.

채치수의 공을 RayCasts라 생각하고 강백호의 블로킹을 CanvasGroup의 Blocks Raycasts 옵션이 on 인 상태라고 보면 된다. on 된상태에서 강백호 뒷편으로 공을 보낼수는 없겠지?ㅎ

 

 

간단한 예시와 함께 3줄 요약 정리.

Check On 

• 자식들 UI의 클릭도 on  
• UI까지만 충돌체크 되고 뒷판으로 충돌체크를 이벤트를 주진 않는다.
• ex ) 디아블로의 인벤토리

 

Check Off 

• 자식들 UI의 클릭 off  
• UI는 충돌체크 안되고 , ui 뒷편에 충돌체크는 가능
• ex) 디아블로 미니맵 

 

ui 버튼의 클릭이벤트가 동작하지 않는다면 혹시 canvas group이 추가 되어 blocksRaycasts 옵션이 꺼져있지는 않은지 확인하자.

Canvas Group에는 자식들의 interactable 과 alpha를 한방에 설정해주는 기능이 있기때문에 자주 사용되는것 같다! 

게다가 유니티3d는 컴포넌트를 많이 이용해서 작업되기도 하고, 그로인해 코드로 파악되지 않는 부분도 있기 때문에 컴포넌트도 꼭 확인 해보자!! 

 

 

 

아래 블로거 분의 설명에는 글과 on/off 시의 상태를 gif 로 설명되어 있으니 이해하기 더 편할것이다. 페이지링크는 요기--> https://wergia.tistory.com/177

[Unity3D] UI 비법서 (2) - 하나의 그룹 Canvas Group