안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

지난 어몽어스 영상에 이어서 투표와 추방 기능을 계속 만들어 봅시다!

사용 엔진 버전 : 2019.3

타임라인

0:00 인트로

0:10 투표 기능 만들기

3:36 투표 스킵 기능 만들기

6:30 투표 시간 제한 만들기

10:41 아웃트로

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

이번 영상에서는 지난 강좌의 내용에 이어서 투표와 추방 기능을 계속 만들어 보겠습니다.

투표 기능 만들기

이번에는 투표하는 기능을 만들어보겠습니다.

먼저 IngameCharacterMover 스크립트로 이동해서 이 플레이어가 투표했는지를 의미하는 bool 타입의 isVote 변수와 이 플레이어가 몇 표를 받았는지를 의미하는 int 타입의 vote 변수를 선언하고 두 변수에 SyncVar 어트리뷰트를 붙여줍니다.

그리고 CmdVoteEjectPlayer 함수를 만들고 Command 어트리뷰트를 붙여줍니다.

이 함수에서는 투표한 플레이어의 isVote 값과 표를 받은 플레이어를 찾아서 Vote 값을 바꿔줍니다.

그 다음에는 GameSystem 스크립트로 이동해서 다른 모든 플레이어들에게 투표 내용을 알리기 위해서 RpcSignVoteEject 함수를 만들고 ClientRpc 어트리뷰트를 붙여줍니다.

그리고 IngameCharacterMover의 CmdVoteEjectPlayer 함수에서 RpcSignVoteEject 함수를 호출해줍니다.

잠시 MeetingUI로 이동해서 UpdateVote 함수를 만들어 줍니다.

그리고 이 함수에서는 MeetingPlayerPanel들에 몇 가지 작업을 해줘야 합니다.

이리저리 스크립트를 많이 이동해서 어지러울 수 있는데 이건 애초에 설계를 제대로 안하고 내키는대로 작업한 부작용입니다.

MeetingPlayerPanel 스크립트로 이동합니다.

그리고 GameObject 타입으로 이 플레이어가 투표했음을 알리는 voteSign 변수와 이 플레이어에게 어떤 플레이어가 투표했는지 알리는데 사용될 voterPrefab 변수, voterPrefab으로 만들어진 오브젝트들을 정렬하는데 사용될 Transform 타입의 voterParentTransform 변수를 선언해줍니다.

그 다음에는 UpdatePanel 함수를 만들어서 투표한 플레이어 캐릭터를 만들고 배치하도록 코드를 작성합니다.

그리고 UpdateVoteSign 함수를 만들고 voteSign 오브젝트를 활성화 시키게 코드를 작성합니다.

그 다음에는 MeetingUI의 UpdateVote 함수로 돌아가서 투표받은 플레이어의 UpdatePanel 함수를 호출해주고 투표한 플레이어는 UpdateVoteSign 함수를 호출해줍니다.

그리고 그 다음에는 GameSystem의 RpcSignVoteEject 함수로 가서 MeetingUI의 UpdateVote 함수를 호출해줍니다.

이어서 패널을 선택했을 때 뜨는 투표 버튼의 기능을 마저 만들어 보겠습니다.

MeetingPlayerPanel 스크립트로 이동해서 Select 함수를 만들고 CmdVoteEject 함수로 이 플레이어가 어떤 플레이어에게 투표했는지 알리고 투표 버튼을 비활성화하도록 코드를 작성합니다.

마지막으로 OnClickPlayerPanel 함수에서 이미 투표한 플레이어는 투표를 하지 못하도록 코드를 수정해줍니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 이동합니다.

에디터로 돌아온 다음에는 PlayerPanel 프리팹을 찾아서 열고 프로퍼티에 플레이어가 투표했음을 알리는 표시와 투표한 플레이어 프리팹, 그리고 투표한 플레이어 오브젝트가 정렬될 트랜스폼을 할당해줍니다.

그리고 Select Button의 On Click 이벤트에 PlayerPanel의 Select 함수를 등록해줍니다.

작업이 끝나면 게임을 빌드합니다.

빌드가 완료된 이후에 게임을 실행해서 테스트해보면 투표하고자 하는 플레이어의 패널을 선택하고 체크 버튼을 누르면 그 캐릭터의 패널에 투표한 플레이어의 아이콘이 뜨는 모습을 볼 수 있습니다.

투표 스킵 기능 만들기

그 다음으로는 누구를 임포스터로 지목할 지 결정하지 못한 플레이어를 위한 투표 스킵 기능을 만들 차례입니다.

MeetingUI 스크립트로 이동합니다.

그리고 GameObject 타입으로 voterPrefab 변수와 skipVoteButton 변수 그리고 skipVotePlayers 변수를 선언하고, Transform 타입의 skipVoteParentTransform 변수를 선언합니다.

그리고 UpdateSkipVotePlayer 함수를 만들고 매개변수로 받은 플레이어의 투표함 표시를 활성화 한다음 투표 스킵 표시를 추가하는 코드를 작성합니다.

이어서 투표 스킵 버튼을 비활성화하고 투표를 스킵한 플레이어의 표시가 보이도록 코드를 작성합니다.

그 다음에는 GameSystem 스크립트로 이동해서 투표를 스킵한 플레이어 수를 카운트할 int 타입의 skipVotePlayerCount 변수를 선언하고 SyncVar 어트리뷰트를 붙여줍니다.

그리고 투표를 스킵한 플레이어를 클라이언트의 MeetingUI에 알려주고 업데이트 하기 위한 RpcSignSkipVote 함수를 만들고 ClientRpc 어트리뷰트를 붙여줍니다.

이 함수에서는 MeetingUI의 UpdateSkipVotePlayer를 호출해주면 됩니다.

그 다음으로는 IngameCharacterMover 스크립트로 이동해서 CmdSkipVote 함수를 만들고 Command 어트리뷰트를 붙여준 뒤 GameSystem의 skipVotePlayerCount의 값을 증가시키고 RpcSignSkipVote 함수를 호출해줍니다.

그리고 다시 MeetingUI 스크립트로 돌아와서 스킵 버튼을 눌렀을 때 동작할 OnClickSkipVoteButton 함수를 만들고 내 캐릭터의 CmdSkipVote 함수를 호출하도록 코드를 구현합니다.

물론 이 함수 역시 플레이어가 이미 투표한 경우라면 누르지 못하도록 코드를 작성해줍니다.

코드를 모두 작성한 다음에는 코드를 저장하고 에디터로 돌아갑니다.

에디터로 돌아온 다음에는 Meeting UI 오브젝트를 선택하고 각 프로퍼티에 필요한 것들을 찾아서 할당해줍니다.

Voter Prefab에는 Voter Img 프리팹을 할당하고, Skip Vote Button 프로퍼티에는 Skip Vote Button 오브젝트를 할당해줍니다.

그리고 Skip Vote Players 프로퍼티에는 Skipped Voting 오브젝트를, Skip Vote Parent Transform 프로퍼티에는 Skipped Voter 오브젝트를 할당해줍니다.

마지막으로 Skip Vote Button의 On Click 이벤트에 Meeting UI의 OnClickSkipVoteButton 함수를 등록해줍니다.

작업을 모두 마친 뒤에는 게임을 빌드합니다.

그리고 게임을 실행해서 테스트해보면 투표 스킵이 잘 작동하는 모습을 볼 수 있습니다.

물론 지금은 한 플레이어가 스킵하면 모든 플레이어에게서 스킵버튼이 바로 사라지고 스킵한 플레이어가 보이게 되면서 한 명만 스킵이 가능하지만 이 부분은 모든 플레이어가 투표한 뒤에 그 결과가 보이도록 만들면서 수정할 예정입니다.

시간 제한

그 다음으로는 투표를 하지 않는 플레이어를 자동으로 스킵처리하기 위해서 투표 시간 제한을 추가해보겠습니다.

먼저 회의와 관련된 시간 변수를 찾아보기 위해서 GameRuleStore 스크립트를 열어보겠습니다.

게임 규칙과 관련된 GameRuleData 구조체를 살펴보면 회의 시간인 meetingsTime과 투표 시간인 voteTime 변수를 볼 수 있습니다.

이 두 값을 이용해서 회의 시간과 투표 시간을 제한해보겠습니다.

GameSystem 스크립트로 이동해서 float 타입으로 남은 회의 시간과 투표 시간을 나타내는 데 사용될 remainTime 변수를 만들고 SyncVar 어트리뷰트를 붙여줍니다.

그리고 이 제한 시간을 계산할 코루틴 함수를 MeetingProcess_Coroutine이라는 이름으로 만들어 줍니다.

MeetingProcess_Coroutine 함수에서는 룸 매니저에서 가져온 게임 규칙 데이터의 meetingsTime과 voteTime 값을 이용해서 remainTime을 계산하도록 만들어줍니다.

그리고 회의가 시작된 직후에 회의 시간동안에는 투표를 하지 못하게 막기 위해서 플레이어들의 isVote를 true로 만들어줍니다.

그 다음에 회의 시간이 끝나고 투표 시간이 시작될 때 플레이어들의 isVote를 false로 만들어서 다시 투표가 가능하게 만들어 주고 투표받은 수나 스킵된 투표 수 역시 초기화해 줍니다.

만들어진 MeetingProcess_Coroutine 함수는 StartReportMeeting 함수에서 호출해줍니다.

그리고 중간에 회의 시간이 끝나고 투표 시간이 시작되었음을 알리기 위한 RpcStartVoteTime 함수와 투표 시간이 종료되었음을 알리는 RpcEndVoteTime 함수를 만들고 각각 ClientRpc 어트리뷰트를 붙여줍니다.

함수의 자세한 내용은 작업을 좀 더 진행한 이후에 채우기로 하고 MeetingProcess_Coroutine 함수에서 이 두 함수를 호출하도록 만들어줍니다.

그 다음에는 MeetingUI 스크립트로 넘어가서 상단에 회의 상태를 확인하기 위한 EMeetingState 열거형을 만들어줍니다.

그리고 방금 만든 열거형 타입으로 회의 상태를 표시할 meetingState 변수와 Text 타입으로 시간을 출력하기 위한 meetingTimeText 변수를 선언해줍니다.

그리고 ChangeMeetingState 함수를 만들어서 외부에서 회의 상태를 변경할 수 있게 만들어 준 뒤 Update 함수에서 남은 시간을 표시하도록 만들어 줍니다.

다시 GameSystem 스크립트로 이동해서 StartMeeting_Coroutine 함수에서 MeetingUI의 ChangeMeetingState 함수를 호출해서 회의 상태를 Meeting으로 변경하고 RpcStartVoteTime 함수에서는 Vote로 변경하게 코드를 작성합니다.

그리고 마지막으로 할 작업은 현재 투표를 하면 바로 결과가 보이는 것을 모든 투표가 완료된 이후에만 결과가 공개되도록 수정하는 것입니다.

먼저 MeetingPlayerPanel 스크립트로 이동해서 OpenResult 함수를 만들고 UpdatePanel 함수에 있는 voterParentTransform를 보이게 만들어주는 코드를 방금 만든 함수로 이동시킵니다.

그리고 MeetingUI 스크립트로 이동해서 CompleteVote 함수를 만든 뒤 각 패널의 OpenResult 함수를 호출하고 UpdateSkipVotePlayer 함수에서 스킵한 플레이어들을 보여주는 코드를 이 CompleteVote 함수로 이동시켜줍니다.

마지막으로 GameSystem 스크립트로 이동해서 RpcEndVoteTime 함수에서 MeetingUI의 CompleteVote 함수를 호출하도록 코드를 작성하고 MeetingProcess_Coroutine 함수에서 RpcEndVoteTime 함수가 호출되기 전에 아직 투표하지 않은 플레이어가 있다면 강제로 스킵에 투표하도록 해줍니다.

코드를 모두 작성한 다음에는 코드를 저장하고 에디터로 돌아갑니다.

에디터에서는 Meeting UI 오브젝트 아래에 시간을 표시할 Text를 추가해줍니다.

그리고 추가한 Text 오브젝트는 Meeting UI 컴포넌트의 Meeting Time Text 프로퍼티에 할당해줍니다.

그리고 모든 작업이 끝나면 게임을 빌드합니다.

빌드가 완료되고 실행해서 테스트해보면 회의 시간이 끝나기 전에는 투표가 불가능하며, 투표 시간이 되면 그때부터 투표가 가능해집니다.

그 다음에 투표 시간이 끝날 때 투표 결과가 공개되며 시간이 끝날 때까지 투표를 하지 않은 플레이어는 자동으로 스킵 처리되는 모습을 확인할 수 있습니다.

아웃트로

이번 영상에서는 투표와 추방 기능을 만들기 위해서 다른 플레이어에게 투표하는 기능과 투표 스킵 기능, 그리고 투표 시간 제한을 만들어 보았습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

[투네이션]

[Patreon]

[디스코드 채널]

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

지난 강좌까지 크루원을 죽이는 기능을 만들었으니 이번 영상에서는 크루원의 시체를 발견하면 신고하는 기능을 만들어봅시다.

시체 감지해서 리포트 버튼 활성화 시키기

제일 먼저 해야할 작업은 플레이어가 시체를 감지했을 때 리포트 버튼을 활성화시키는 것입니다.

그러기 위해서는 시체 오브젝트에 감지할 수 있는 콜라이더를 추가해줘야 합니다.

프로젝트 뷰에서 Deadbody 프리팹을 찾아서 선택합니다.

그리고 캐릭터를 감지할 CircleCollider2D 컴포넌트를 부착해준 뒤 is Trigger 프로퍼티를 체크해줍니다.

그리고 캐릭터가 감지하게 될 거리로 반지름을 6으로 설정해줍니다.

그 다음에는 인스펙터 뷰 상단의 레이어에서 Add Layer를 선택하고 Deadbody 레이어를 추가해줍니다.

레이어를 추가한 다음에는 프리팹을 다시 선택하고 프리팹의 레이어를 Deadbody로 설정해줍니다.

그 다음에는 Deadbody 레이어의 콜라이더가 Player 레이어의 콜라이더와 만났을 때만 반응하게 만들어 주기 위해서 상단 메뉴 바에서 [Edit > Project Settings] 항목을 선택해서 프로젝트 세팅 창을 열어줍니다.

그리고 Physics 2D 카테고리의 제일 아래에서 Deadbody 레이어는 Player 레이어에만 반응하도록 만들어줍니다.

콜라이더 세팅이 끝난 다음에는 Deadbody 스크립트를 열어줍니다.

Deadbody 클래스에서는 OnTriggerEnter2D 콜백 함수와 OnTriggerExit2D 콜백 함수를 만들어줍니다.

그리고 감지된 플레이어가 들어오거나 나갈 때마다, 자기 자신이고 유령이 아닌 상태라면 리포트 버튼을 활성화시키거나 비활성화시켜 줘야합니다.

우선 코드를 저장하고 에디터로 돌아갑니다.

그리고 ReportButtonUI라는 이름으로 C# 스크립트를 생성하고 스크립트 에디터를 다시 열어줍니다.

스크립트 에디터가 열리고 나면 스크립트의 상단에 UnityEngine.UI 네임스페이스를 using 선언해줍니다.

그리고 멤버 변수로 Button 타입의 reportButton을 선언해주고 SetInteractable 함수를 만들어서 매개변수인 isInteractable 값에 따라서 버튼을 활성화시키거나 비활성화시키도록 코드를 작성해줍니다.

그 다음에는 IngameUIManager 클래스로 이동해서 ReportButtonUI를 캐싱해서 쉽게 접근할 수 있도록 해줍니다.

캐싱 작업이 끝나면 Deadbody 클래스로 이동해서 OnTriggerEnter2D 콜백 함수에서는 SetInteractable 함수로 리포트 버튼을 활성화 시키게 만들어주고 OnTriggerExit2D 콜백 함수에서는 SetInteractable 함수로 리포트 버튼을 비활성화시키게 만들어줍니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 돌아갑니다.

에디터로 돌아온 다음에는 Report Button을 찾아서 ReportButtonUI 컴포넌트를 붙여주고 프로퍼티를 할당합니다.

그리고 캔버스에 붙어있는 IngameUIManager에 방금 붙여준 ReportButtonUI를 프로퍼티에 할당해줍니다.

그리고 메인 카메라와 All See Camera에서 레이어가 Deadbody인 시체를 보이게 만들기 위해서 두 카메라를 선택하고 Culling Mask에 Deadbody 레이어를 추가합니다.

작업이 끝나면 게임을 빌드합니다.

빌드가 완료되고 게임을 실행해서 테스트해보면 시체가 시야에 잡히기 시작하면 리포트 버튼이 활성화되고 멀어지면 비활성화되는 모습을 볼 수 있습니다.

리포트 UI 배치

그 다음 작업은 신고 버튼을 누른 뒤에 시체 리포트 UI를 띄우는 것입니다.

먼저 영상 하단의 링크에서 작업에서 사용될 리소스 패키지를 다운로드 받아서 임포트합니다.

리소스 임포트가 끝나면 Canvas 아래에 Report UI라는 이름으로 Image 게임오브젝트를 만들고 화면 영역 전체를 덮도록 만들어 줍니다.

그리고 이미지의 알파 값을 0으로 내려서 투명하게 만들어 줍니다.

그 다음에는 그 아래에 이미지 오브젝트를 생성하고 임포트한 스프라이트들을 넣어서 게임의 리포트 UI와 비슷하게 만들어줍니다.

리포트 UI 기능 구현

이미지를 모두 배치한 다음에는 ReportUI라는 이름으로 C# 스크립트를 생성하고 스크립트 에디터를 엽니다.

스크립트 에디터가 열리고 나면 스크립트의 상단에 UnityEngine.UI 네임스페이스를 using 선언해줍니다.

그리고 멤버 변수로 Image 타입의 deadbodyImg와 Material 타입의 material을 선언해줍니다.

그 다음에는 Open 함수를 만들어서 캐릭터가 움직이지 못하게 만든 다음 머티리얼을 인스턴싱해주고 매개변수로 받은 deadbodyColor로 deadbodyImg의 색을 변경하도록 만들어줍니다.

그 다음에는 Close 함수를 만들어서 이 ReportUI를 닫는 기능도 만들어줍니다.

이 다음 단계로는 IngameUIManager 클래스로 이동해서 reportUI에 접근하기 쉽도록 캐싱하는 코드를 작성합니다.

이렇게 ReportUI 클래스의 작업이 끝난 다음에는 버튼을 눌렀을 때 모든 플레이어의 화면에서 리포트 UI가 뜨게 만들어야 합니다.

리포트 UI를 뜨게 만들기 전에 모든 유저에게 알려주기 위해서 발견한 시체의 색을 전달할 필요가 있습니다.

IngameCharacterMover 클래스로 이동해서 EPlayerColor 타입으로 foundDeadbodyColor 변수를 추가해줍니다.

그리고 Deadbody 클래스로 이동해서 OnTriggerEnter2D 콜백 함수에서 발견한 시체의 색을 발견자의 캐릭터에 전달해줘야 합니다.

그전에 아직 Deadbody 클래스에 죽은 플레이어 색이 저장되어 있지 않기 때문에 EPlayerColor 멤버 변수를 추가하고 RpcSetColor 함수에서 매개변수로 받은 값을 저장해줍니다.

그리고 OnTriggerEnter2D 콜백 함수에서 자신의 캐릭터에 발견한 시체의 색을 저장해줍니다.

그 다음에는 다시 IngameCharacterMover 클래스로 돌아가서 Report 함수와 CmdReport 함수를 만들어줍니다.

Report 함수에서는 매개변수로 발견한 죽은 크루원의 색상을 넣어서 CmdReport 함수를 호출하게 코드를 작성합니다.

그리고 CmdReport 함수에는 Command 어트리뷰트를 붙여줍니다.

이렇게 CmdReport 함수를 통해서 서버로 전달된 리포트 신호를 다른 플레이어들에게 전달해주면 됩니다.

GameSystem 클래스로 이동해서 StartReportMeeting 함수를 만들어 줍니다.

이 함수를 통해서 리포트 미팅이 시작됩니다.

지금은 간단하게 다른 플레이어들에게 시체 발견 신호를 보내는 역할만을 하게 될 겁니다.

RpcSendReportSign 함수를 만들고 ClientRpc 어트리뷰트를 붙여준 뒤 StartReportMeeting 함수에서 호출하도록 만들어 줍니다.

그리고 RpcSendReportSign 함수에서는 ReportUI의 Open 함수를 호출하게 만들어줍니다.

그 다음에는 ReportButtonUI 클래스로 이동합니다.

여기서는 버튼을 눌렀을 때 호출될 OnClickButton 함수를 만들고 내 캐릭터의 Report 함수를 호출하게 만들어 줍니다.

다시 IngameCharacterMover의 CmdReport 함수로 돌아가서 GameSystem의 StartReportMeeting 함수를 호출해줍니다.

코드를 모두 작성한 다음에는 코드를 저장하고 에디터로 돌아갑니다.

에디터로 돌아온 다음에는 Report UI 오브젝트에 방금 작성한 ReportUI 컴포넌트를 붙여주고 시체 이미지와 크루원 머티리얼을 프로퍼티에 할당해줍니다.

그리고 Report Button을 선택하고 On Click 이벤트에 Report Button UI의 OnClickButton 함수를 등록해줍니다.

그 다음에는 Canvas를 선택해서 IngameUIManager 컴포넌트의 ReportUI 프로퍼티에 Report UI 오브젝트를 할당해줍니다.

작업을 마친 다음에는 게임을 빌드합니다.

빌드가 완료된 다음 게임을 실행해서 테스트해보면 리포트 버튼을 누른 뒤에 모든 플레이어의 화면에 리포트 UI가 뜨는 모습을 볼 수 있습니다.

아웃트로

이번 영상에서는 시체를 발견했을 때 리포트 버튼이 활성화되고 버튼을 누르면 모든 플레이어의 화면에 리포트 UI가 뜨는 기능을 만들어 보았습니다.

다음 영상에서는 여기에 이어서 회의를 하는 기능을 만들어 보도록 하겠습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

타임라인

0:00 인트로

0:12 시체를 감지해서 리포트 버튼 활성화 시키기

3:08 리포트 UI 배치

3:52 리포트 UI 기능 구현

7:30 아웃트로

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

[투네이션]

[Patreon]

[디스코드 채널]