콘텐츠로 이동

계정 관리 화면

로그인한 사용자가 계정 정보와 연동한 로그인 수단을 확인하고, 연동을 추가하거나 해제하고, 로그아웃하는 화면입니다.

화면 예시

세로 화면과 가로 화면은 화면 리소스 하나가 함께 처리합니다.

계정 관리 화면의 세로 예시입니다. 화면 위쪽에 계정 제목과 닫기 버튼이 있고, 그 아래에 닉네임, 서버, CS Code가 한 줄에 하나씩 표시됩니다. CS Code 오른쪽에는 값을 복사하는 버튼이 있습니다. 계정 연동 목록에는 Google, Apple, Play Games, Steam, X, Username이 한 줄에 하나씩 세로로 놓여 있으며, 이미 연동한 Google은 파란색으로 강조되고 오른쪽에 체크 표시가, 아직 연동하지 않은 나머지 항목은 오른쪽에 더하기 표시가 붙어 있습니다. 화면 맨 아래에는 계정 삭제 버튼과 로그아웃 버튼이 나란히 있습니다.

계정 관리 화면의 가로 예시입니다. 닉네임, 서버, CS Code가 한 줄에 나란히 놓이고, 그 아래 계정 연동 목록이 두 열로 나뉘어 표시됩니다. 예시에는 연동한 Google과 아직 연동하지 않은 Apple이 첫 줄에 보입니다. 화면 맨 아래에는 계정 삭제 버튼과 로그아웃 버튼이, 오른쪽 위에는 닫기 버튼이 있습니다.

사용 상황

로그인을 마친 사용자가 계정에 연동한 로그인 수단을 확인하거나 바꾸고, 로그아웃할 때 이 화면을 엽니다. 연동과 연동 해제, 로그아웃은 모두 로그인한 상태에서만 할 수 있으므로 이 화면은 로그인한 사용자에게만 노출하세요.

화면은 계정 정보 영역, 계정 연동 목록, 로그아웃 버튼과 계정 삭제 버튼, 닫기 버튼으로 구성되어 있습니다.

계정 정보 영역

화면 위쪽의 계정 정보 영역에는 앱이 전달한 값을 그대로 표시합니다. 예시 화면의 닉네임, 서버, CS Code는 앱이 채워 넣을 수 있는 항목의 예시입니다. 화면 리소스는 이 값을 직접 조회하지 않으므로, 앱에서 보여 줄 항목으로 바꿔 사용하세요.

계정 연동 목록은 각 로그인 수단의 연동 여부를 구분해 표시합니다. 목록에 넣을 로그인 수단과 각 항목의 연동 여부는 앱이 판단해 화면에 전달합니다. 사용자가 항목을 선택하면 화면은 다시 묻지 않고 바로 OnProviderSelected를 호출해 선택한 로그인 수단을 앱에 알립니다.

이미 연동한 항목을 선택했을 때 연동 해제로 처리할지, 상세 화면을 보여 줄지, 해제하기 전에 확인을 받을지는 앱이 정합니다. 해제한 뒤에도 게스트를 제외한 로그인 수단이 하나 이상 남아야 하므로, 어떤 항목을 해제할 수 있는지는 계정 연동 해제의 해제 정책에 맞춰 정하세요.

로그아웃 버튼

로그아웃 버튼을 선택하면 화면이 확인 팝업을 먼저 띄우고, 사용자가 확인 버튼을 선택했을 때 OnLogout을 호출합니다. 앱이 팝업을 직접 띄울 필요는 없습니다. 팝업의 안내 문구는 LogoutConfirmMessage, 취소 버튼 문구는 LogoutCancelLabel, 확인 버튼 문구는 LogoutConfirmLabel 옵션으로 전달하세요.

확인 팝업이 열려 있을 때 취소 버튼을 선택하거나 Esc를 누르면 팝업만 닫히고 계정 관리 화면으로 돌아갑니다.

계정 삭제 버튼

계정 삭제 버튼을 선택하면 화면은 확인 팝업 없이 바로 OnDeleteAccount를 호출합니다. 화면 리소스는 계정을 직접 삭제하지 않으므로, OnDeleteAccount에서 계정 삭제를 처리하세요. 처리 방법은 계정 삭제를 참조하세요.

삭제하기 전에 로그아웃과 같은 모양의 확인 팝업으로 사용자 확인을 받으려면 OnDeleteAccount에서 ShowConfirm()을 호출하세요. ShowConfirm()에는 안내 문구, 취소 버튼 문구, 확인 버튼 문구, 사용자가 확인 버튼을 선택했을 때 실행할 코드를 차례로 넘깁니다. destructive: true를 함께 넘기면 확인 버튼이 빨간 계열로 표시됩니다. 아래 예제는 계정 관리 화면을 열 때 넘기는 옵션 가운데 OnDeleteAccount 부분입니다. 예제의 screen은 Show()가 돌려준 계정 관리 화면입니다.

OnDeleteAccount = () => screen.ShowConfirm(
    "계정을 삭제하면 되돌릴 수 없습니다.",
    "취소",
    "삭제",
    () => { /* 계정 삭제 호출 */ },
    destructive: true),

관련 레시피

목록 항목이나 로그아웃 버튼을 선택한 다음의 처리 가운데 Google, Apple 같은 외부 인증 제공자를 계정에 연동하는 처리와 로그아웃 처리는 레시피가 담당합니다. 사용자 흐름과 구현 절차는 아래 가이드를 참조하세요.

유저네임 연동, 커스텀 계정 연동, 연동 해제에는 레시피가 없습니다. 이 처리는 앱에서 Hive Axyl SDK 메서드를 직접 호출해 구현합니다. 호출 방법은 아래 필요한 SDK 기능을 참조하세요.

필요한 SDK 기능

연동 목록을 채우고, 사용자가 고른 항목을 연동, 연동 해제, 로그아웃으로 처리하려면 아래 Hive Axyl SDK 기능이 필요합니다.

  • 계정 연동 처리 및 조회: 유저네임을 포함한 로그인 수단을 연결하는 방법과 화면의 연동 목록을 채우고 갱신하는 방법
  • 커스텀 계정 연동: 앱 서버가 발급받은 grant key로 커스텀 계정을 연결하는 방법
  • 계정 연동 해제: 연결한 로그인 수단을 끊는 방법과 해제에 적용되는 정책
  • 계정 연동 시 충돌 처리: 연동하려는 계정이 다른 Player ID에 이미 연결되어 있을 때의 처리
  • 로그아웃: 서버에 로그아웃을 요청하는 방법과 결과에 따라 세션과 저장된 토큰을 정리하는 방법

필요한 API

위 기능을 구현할 때 앱에서 호출하는 Hive Axyl SDK 메서드입니다.

Unity 적용 안내

계정에 연동된 로그인 수단 목록을 화면에 전달해 각 항목의 연동 상태를 표시하고, 목록 항목을 선택했을 때는 연동이나 연동 해제가, 로그아웃 확인 팝업에서 확인 버튼을 선택했을 때는 로그아웃이 실행되도록 연결합니다. 연동이나 해제에 성공하면 갱신한 목록을 다시 전달해 화면을 최신 상태로 유지합니다. 이 화면은 요청을 처리하는 동안에도 목록 항목을 잠그지 않습니다. 항목이 여러 번 선택되는 것을 막아야 하면 앱에서 처리하세요. 화면을 닫는 방법은 화면 닫기를 참조하세요.

처리에 실패했을 때 띄울 실패 안내 토스트는 여러 화면이 함께 쓰는 공용 위젯으로, 공용 폴더에 들어 있습니다. 확인 팝업은 계정 관리 화면이 제공합니다. 팝업의 버튼에는 공용 위젯인 액션 버튼을 씁니다. 화면 폴더를 복사할 때는 공용 폴더, 폰트 폴더, UIKit.asmdef 파일도 함께 복사하세요. 복사하는 방법과 복사한 뒤 앱 어셈블리 정의 파일에 추가할 내용은 화면 리소스 가져오기를 참조하세요.

  • Unity GitHub 저장소: 복사할 unity/UI-Kit/Account, unity/UI-Kit/Common, unity/UI-Kit/Fonts 폴더와 unity/UI-Kit/UIKit.asmdef 파일