추가 기능

저희가 제공하는 방법 안내서에서 고급 설정에 대해 자세히 알아보세요.

데모에서 계정 연결 시도 방법

상이한 플랫폼 상의 플레이어 계정을 주 계정에 연결하여 다음 기능을 구현할 수 있습니다:

  • 다른 플랫폼 상의 플레이어 자동 인식
  • 다른 플랫폼 상에서 단일 플랫폼 교차 인벤토리 관리

기설정 게시자 계정 프로젝트에 대한 플랫폼 계정의 기본 계정에 대한 연결을 확인하기 위해 데모 장면을 사용할 수 있습니다.

Note
개별 플랫폼 별로 1개의 계정만을 기본 계정에 연결할 수 있습니다.

데모 프로젝트 계정 연결 시험 방법:

  1. Unity 프로젝트로 이동.
  2. 플랫폼 계정을 통해 애플리케이션에 로그인하도록 데모 장면 설정:
    1. 메인 메뉴에서, Window > Xsolla > Edit Settings로 이동.
    2. 다음 매개변수를 Inspector 창에서 설정:
      1. Publishing platform를 명시. 선택한 값은 반드시 XsollaNone와는 달라야 합니다.
      2. Username from console 변경.

  1. Xsollus 데모 장면을 Assets > Xsolla > DemoCommon > Scene 폴더에서 시작합니다.

  1. 데모 장면에서 User account을 클릭한 다음 Account linking을 클릭합니다. 데모 프로젝트가 기본 창에서 열려서 다른 플랫폼에서 애플리케이션의 시작을 시뮬레이트합니다.

  1. Create an account를 클릭.

  1. 이메일과 비밀번호를 명기하고 Accept and create를 클릭합니다.

  1. 카탈로그에서 아이템을 선택하고 Buy on Xsolla를 클릭합니다. 테스트용 신용카드 중 하나를 사용하여 아이템을 구매합니다. 영수지를 닫습니다.

  1. 메뉴를 열려면 화면 상단의 이메일을 클릭하십시오. Inventory를 클릭. 구매한 항목이 인벤토리에서 사용 가능한지 확인합니다.

  1. Get code를 클릭. 열린 윈도우에서 Request the code를 클릭. 수신한 계정 연결 코드를 기술합니다.

  1. Unity 데모 장면으로 이동합니다.
  2. 수신한 계정 연결 코드를 입력하고(9단계 참조) Confirm을 클릭합니다.

  1. 이제 플랫폼 계정이 기본 계정에 연결되었습니다. 구매한 아이템이 Unity 데모 장면의 인벤토리에서 사용 가능한지 확인하세요.

  1. 이 계정은 이미 기본 계정에 연결되어 있으므로 이로부터 계정 연결 코드를 얻을 수 있습니다. Get account link를 클릭합니다. 수신한 코드를 입력합니다.

  1. 다른 플랫폼 계정을 통해 애플리케이션에 로그인하도록 데모 장면 설정(2단계 참조). Publishing platform2단계 에서 선택한 것과는 달라야 합니다.
  2. Xsollus 데모 장면을 Assets > Xsolla > DemoCommon > Scene 폴더에서 시작합니다.

  1. 플레이어의 인벤토리가 비어 있는지 확인하세요.
  2. Account linking를 클릭. Unity 데모 장면에 머뭅니다.

  1. 수신한 계정 연결 코드를 입력하고(13단계 참조)Confirm을 클릭합니다.

  1. 이제 새 플랫폼의 계정도 기본 계정에 연결됩니다. 구매한 아이템이 Unity 데모 장면의 인벤토리에서 사용 가능한지 확인하세요.

레시피를 따라 여러분 프로젝트에 대한 계정 연결 구성.

이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
숨기기

애플리케이션에서 배틀 패스 구현 방법

Notice
Game Commerce 자산으로만 작업 시 이 방법 안내서를 사용합니다.

배틀 패스는 배틀 패스 기간에 퀘스트 완료용 보상을 발급하거나 활발하게 플레이하는 것으로 플레이어의 참여를 높일 수 있게 해 줍니다.

제한적 보상이 있는 무료 배틀 패스는 모든 플레이어가 사용할 수 있습니다. 최종 보상 역시 무료 패스에 포함되어 있지 않습니다.

또한, 플레이어는 최종 보상을 포함하여 모든 보상이 있는 프리미엄 패스를 구매할 수 있습니다.

배틀 패스 진행률은 레벨로 나누어집니다. 새 레벨을 잠금 해제하고 배틀 패스 만료 전에 최종 보상을 열 시간이 있으려면 플레이어는 필요한 경험을 얻거나 레벨을 구매해야 합니다.

데모 프로젝트는 엑솔라 제품을 사용하여 배틀 패스를 구현하는 예시를 제공합니다. 배틀 패스 시도 방법:

  1. Xsollus 데모 장면을 시작합니다.
  2. 데모 사용자로 로그인하거나 새 사용자를 생성합니다.
  3. 사이드 메뉴에서 Battle pass를 클릭합니다.

프로젝트용 배틀 패스 적응 방법:

  1. 배틀 패스 논리를 프로젝트에 추가합니다.
  2. 보상 쿠폰 세트를 생성합니다.
  3. 배틀 패스 구성을 생성합니다.
  4. 배틀 패스 아이템을 생성합니다.
  5. 레벨업 아이템을 생성합니다.

프로젝트에 배틀 패스 논리 추가

배틀 패스용 모든 논리는 BattlepassPage 프리패브에 포함되어 있으며 다음 블록으로 나뉘어 있습니다.

  • ScriptHolders — 배틀 패스 구성, 아이템, 플레이어 정보 작업용 스크립트
  • UIScriptHolders — 플레이어 상호 작용용 스크립트

배틀 패스 논리 추가 방법:

  1. 프로젝트에서 BattlepassPage 프리패브를 인스턴트화합니다.
  2. 인터페이스를 변경합니다(선택 사항).
  3. 정보 논리 저장을 수정합니다.

보상 쿠폰 세트 생성

보상은 가상 아이템과 인게임 재화 패키지일 수 있습니다.

현재 솔루션에서 보상은 쿠폰 상황을 통해 플레이어에게 수여됩니다. 쿠폰 세트 생성 방법:

  1. 게시자 계정의 프로젝트로 이동합니다.
  2. 플레이어 보상용 가상 아이템인게임 재화 팩을 생성합니다.
  3. 각 보상에 대해 다음 권장 사항을 사용하여 쿠폰이 있는 캠페인을 설정합니다.

    • 사용자당 상환 수를 배틀 패스의 계획된 쿠폰 상환 개수로 지정합니다. 하나의 쿠폰은 배틀 패스 일부로서 여러 번 상환될 수 있습니다(예: 다른 배틀 패스 레벨에서, 프리미엄 및 무료 버전에서).
    • 캠페인의 유효 기간은 배틀 패스 유효 기간과 같아야 합니다.

배틀 패스를 만들려면 사전에 보상 목록을 만드는 것이 좋으며 각 보상은 다음과 같습니다.

  • 쿠폰 코드
  • 가상 아이템 또는 인게임 재화 패키지 SKU
  • 배틀 패스의 특정 레벨에 보상이 속하는 경우
  • 무료 또는 프리미엄 버전에 보상이 속하는 경우

Note
이전 보상이 만료되기 전에 새 배틀 패스용 보상을 구성할 수 있습니다. 애플리케이션 논리를 중단하지 않으려면 새 배틀 패스 시작 전에 쿠폰 프로모션을 활성화하지 않아야 합니다.

배틀 패스 구성 생성

배틀 패스 구성은 JSON 파일이며 다음을 포함합니다.

  • 배틀 패스 이름
  • 배틀 패스 만료 날짜
  • 무료 및 프리미엄 버전용 보상을 표시하는 레벨 구조

Note
프리미엄 배틀 패스 버전의 가장 높은 레벨용 보상은 자동으로 최종 배틀 패스 보상입니다. 이 보상의 표시는 레벨 완료용 보상 표시와 다릅니다.

JSON 파일 구조:

파라미터유형설명
이름
string배틀 패스 이름. 배틀 패스 아이템 이름과 일치해야 합니다.
ExpiryDate
string배틀 패스 만료 날짜.
레벨
array배틀 패스 레벨 구조.
Levels.Tier
integer레벨 번호.
Levels.Experience
integer다음 레벨에 도달하기 위한 경험의 양.
Levels.FreeItem
object배틀 패스 무료 버전의 보상 정보. null일 수 있습니다.
Levels.FreeItem.Sku
string가상 아이템 또는 인게임 재화 패키지 SKU. 사용자에게 보상 이미지와 정보를 표시하는 데에 사용되었습니다.
Note
인게임 재화 패키지용으로 패키지 SKU 및 인게임 재화 SKU 둘 다 사용될 수 있습니다.
Levels.FreeItem.Quantity
integer보상의 수.
Levels.FreeItem.Promocode
string보상용 쿠폰 코드.
Levels.PremiumItem
object배틀 패스 프리미엄 버전의 보상 정보. null일 수 있습니다.
Levels.PremiumItem.Sku
string가상 아이템 또는 인게임 재화 패키지 SKU. 사용자에게 보상 이미지와 정보를 표시하는 데에 사용되었습니다.
Note
인게임 재화 패키지용으로 패키지 SKU 및 인게임 재화 SKU 둘 다 사용될 수 있습니다.
Levels.PremiumItem.Quantity
integer보상의 수.
Levels.PremiumItem.Promocode
string보상용 쿠폰 코드.

배틀 패스 구성 예시:

Copy
Full screen
Small screen
{
  "Name": "BP2021JAN",
  "ExpiryDate": "29-03-2021",
  "Levels": [
    {
      "Tier": 1,
      "Experience": 1000,
      "FreeItem": {
        "Sku": "Sku",
        "Quantity": 10,
        "Promocode": "HELLO_WORLD"
      },
      "PremiumItem": {
        "Sku": "Sku2",
        "Promocode": "HELLO_WORLD2"
      }
    },
    {
      "Tier": 2,
      "Experience": 1000
    },
    {
      "Tier": 3,
      "Experience": 1000
    }
  ]
}

배틀 패스 아이템 생성

배틀 패스 아이템은 배틀 패스 구성용 컨테이너이며 플레이어의 프리미엄 상태(플레이어의 프리미엄 버전 구매 여부) 결정에 사용됩니다.

배틀 패스 아이템 생성 방법:

  1. 게시자 계정의 프로젝트로 이동합니다.
  2. 이름이 #BATTLEPASS#가상 아이템 그룹을 생성합니다.

Note
#BATTLEPASS# 그룹은 유틸리티 그룹이며 인게임 스토어 및 인벤토리에 표시되지 않습니다.

  1. 가상 아이템을 다음 매개 변수를 이용해 생성합니다.
    • 아이템 이름 — 구성에서 지정된 배틀 패스의 이름.
    • SKU — 배틀 패스 ID. 구성에서 지정된 배틀 패스의 이름을 사용하는 것이 좋습니다.
    • 아이템 속성 — 소모성 또는 비소모성 아이템.

Note
애플리케이션 디버깅 중에는 소모성 아이템을 생성하는 것이 좋습니다. 배틀 패스 아이템 여부에 대한 시스템의 반응을 테스트할 수 있게 합니다.

    • 가격 — 배틀 패스 프리미엄 버전 가격. 인게임 재화 또는 실질 화폐로 설정되어 있습니다.

Note
가상 아이템이 실질 화폐 및 인게임 재화로 가격이 매겨졌다면 애플리케이션은 실질 화폐 가격을 표시합니다.

    • 그룹 — #BATTLEPASS#.

Note
애플리케이션 디버깅 중에는 추가로 #BATTLEPASS#에 아이템을 배치하기보다는 그룹에 아이템을 배치하는 것이 좋습니다. 이 경우에는 인벤토리에 아이템이 표시됩니다.

  1. 배틀 패스 구성을 생성된 가상 아이템에 추가합니다.
    1. Get virtual item API 호출을 사용하여 JSON 형식의 현재 아이템 설명을 가져옵니다.
    2. 배틀 패스 구성을 문자열로 온라인 서비스 또는 JavaScript의 JSON.stringify() 메소드를 사용하여 변환합니다.
    3. 아이템 설명에서 long_description 매개 변수 en 개체의 결과 문자열을 지정합니다.
    4. Update virtual item API 호출 사용 및 요청 본문의 업데이트한 아이템 설명을 지정하여 아이템을 수정합니다.

배틀 패스 아이템 설명 예시:

Copy
Full screen
Small screen
{
  "sku": "BP2021JAN",
  "name":{
    "en": "BP2021JAN"
  },
  "type": "virtual_good",
  "description":{
    "en": "BP2021JAN"
  },
  "image_url": "https://cdn3.xsolla.com/img/misc/images/7cb1c2b719af329a9bc1df994d58b749.png",
  "long_description": {
    "en": "{
                \"Name\":\"BP2021JAN\",
                \"ExpiryDate\":\"01-07-2021\",
                \"Levels\":
                    [
                        {
                            \"Tier\":1,
                            \"Experience\":100,
                            \"FreeItem\":
                                {
                                    \"Sku\":\"Bullets\",
                                    \"Promocode\":\"B2021S1FL1E100\",
                                    \"Quantity\":50
                                }
                        }
                    ]
            }"
  },
  "attributes":[
  ],
  "is_free": false,
  "order": 1,
  "groups":[
    "Battlepass"
  ],
  "regional_prices":[
  ],
  "prices":[
    {
      "amount": 1,
      "currency": "USD",
      "is_default": true,
      "is_enabled": true
    }
  ],
  "media_list":[
  ],
  "vc_prices":[
  ],
  "is_enabled": true,
  "is_show_in_store": true,
  "regions":[
  ],
  "inventory_options":{
    "consumable": false,
    "expiration_period": null
  }
}

레벨업 아이템 생성

현재 배틀 패스 솔루션은 플레이어가 실질 화폐 또는 인게임 재화로 레벨을 구매할 수 있게 합니다. 레벨 가격은 언제나 같습니다. 현재 레벨 내에서 플레이어가 얻는 경험은 다음 레벨로 전송됩니다.

레벨업 아이템 생성 방법:

  1. 게시자 계정의 프로젝트로 이동합니다.
  2. 가상 아이템을 다음 매개 변수를 이용해 생성합니다.
    • 아이템 이름 — 구성에서 지정된 배틀 패스 이름이 <battlepassname>인 경우 <battlepassname>_levelup_util 형식의 레벨업 아이템 이름.
    • SKU — 구성에서 지정된 배틀 패스 이름을 사용한는 것이 좋습니다.
    • 아이템 속성 — 소모성 또는 비소모성 아이템.
    • 가격 — 레벨 가격. 인게임 재화 또는 실질 화폐로 설정되어 있습니다.

Note
레벨업 아이템이 실질 화폐 및 인게임 재화로 가격이 매겨졌다면 애플리케이션은 실질 화폐 가격을 표시합니다.

    • 그룹 — #BATTLEPASS#.

Note
애플리케이션 디버깅 중에는 추가로 #BATTLEPASS#에 아이템을 배치하기보다는 그룹에 레벨업 아이템을 배치하는 것이 좋습니다. 이 경우에는 인벤토리에 아이템이 표시됩니다.

현재 배틀 패스 솔루션의 세부 사항

배틀 패스 표시 논리

논리에 따라 단 하나의 배틀 패스만 애플리케이션은 표시합니다.

  • 하나 이상의 만료된 배틀 패스가 존재한다면 애플리케이션은 가장 가까운 만료 날짜의 배틀 패스를 표시합니다.
  • 모든 배틀 패스가 만료되었다면 애플리케이션은 마지막으로 만료된 배틀 패스를 표시합니다.

예시 1

현재 날짜: 2021년 3월 4일.

배틀 패스 만료 날짜: 2021년 3월 1일, 2021년 4월 1일, 2021년 5월 1일.

애플리케이션이 표시하는 배틀 패스 만료 날짜는 2021년 4월 1일입니다.

예시 2

현재 날짜: 2021년 3월 4일.

배틀 패스 만료 날짜: 2021년 2월 1일, 2021년 3월 1일.

애플리케이션이 표시하는 배틀 패스 만료 날짜는 2021년 3월 1일입니다.

정보 논리 저장

현재 솔루션에서 배틀 패스의 플레이어 진행률에 대한 모든 정보(레벨, 경험, 받은 보상 등)는 사용자가 편질할 수 있는 특성에 저장되어 있습니다. 데모의 일부로서 이러한 특성의 읽기 및 편집은 Character 페이지에서 할 수 있습니다.

시스템이 필수 특성을 찾지 않는다면, 새 특성이 자동으로 생성됩니다. 시스템이 현재의 배틀 패스용이 아닌 특성을 찾는다면 그러한 특성들은 자동으로 삭제됩니다.

Notice
사용자가 편집할 수 있는 특성은 게임의 클라이언트 측에서 변경할 수 있습니다. 배틀 패스의 플레이어 진행률 데이터를 보호하려면 자체 논리 구현 시 읽기 전용 특성을 사용하는 것이 좋습니다.

플레이어의 프리미엄 상태를 결정하려면 플레이어 인벤토리의 배틀 패스 아이템 현재 상태를 확인하세요.

이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
숨기기

SDK를 사용하여 애플리케이션 UI를 구성하는 방법

SDK는 UI 빌더를 포함합니다. UI 빌더는 애플리케이션 UI 비주얼을 구성할 수 있게 합니다.

색상, 스프라이트, 글꼴 같은 UI 요소의 비주얼 속성을 편집하여 UI를 변경할 수 있습니다. 이러한 속성은 하나의 테마로 그룹화됩니다. Unity 테마 및 비주얼 구성 요소는 데코레이터에 의해 연결됩니다. 비주얼 속성을 변경하면 데코레이터는 Unity 구성 요소의 비주얼을 변경합니다.

UI 요소를 같은 유형의 다른 요소와 교체하려면 위젯을 사용합니다. 이러한 위젯은 독립적이며 prefabs 형태로 쉽게 교체 가능한 부분입니다.

UI는 2개의 독립적인 부분으로 이루어져 있습니다:

테마 작업

테마 편집기

테마 편집기를 열려면 Unity 편집기 메인 메뉴로 이동한 다음 Window > Xsolla > UI Themes Editor를 엽니다.

테마 편집기 UI에 포함된 구성 요소:

  • 테마 선택 및 적용에 사용되는 테마 이름이 있는 버튼.

Note
application 런타임 중, 테마는 오직 SetCurrentThemeByName 정적 메소드로만 변경할 수 있으며 이는 ThemesLibrary 클래스에 있습니다. 테마 이름을 이 메소드에 매개변수로 전달합니다.

  • Refresh 버튼 — 테마 속성을 적용하거나 변경 사항을 application UI에 적용하도록 합니다.
  • Auto Refresh 박스 — 자동으로 테마 속성을 적용하거나 변경 사항을 application UI에 적용하도록 합니다.
  • Themes 섹션 — 기존 테마 목록을 포함합니다.
  • Colors 섹션 — 기존 테마 색상을 포함합니다.
  • Sprites 섹션 — 기존 테마 스프라이트를 포함합니다.
  • Fonts 섹션 — 기존 테마 폰트를 포함합니다.

목록에 수행할 수 있는 작업:

  • 새 요소을 추가하려면 + 아이콘을 목록의 아래쪽에서 클릭합니다.
  • 선택한 요소를 삭제하려면 - 아이콘을 목록의 아래쪽에서 클릭합니다.
  • 순서를 변경하려면 = 아이콘을 길게 클릭한 다음 해당 요소를 목록에서 필요한 위치로 드래그합니다.
  • 요소 이름을 변경하려면 요소 이름이 있는 필드의 텍스트를 변경합니다.

속성값이 변경되는 표준 Unity 방식:

  • 색상을 변경하려면 속성 필드를 클릭하고 새 값을 선택합니다.
  • 글꼴 또는 스프라이트를 변경할 방법:
    • 자산을 속성 필드로 드래그합니다.
    • 아이콘을 클릭하고 자산을 선택합니다.

테마 라이브러리

테마 라이브러리는 ScriptableObject 클래스에서 상속되었으며 Resources/UIBuilder/ThemesLibrary 디렉토리에 위치합니다.

Note
테마 라이브러리 디렉터리 변경은 하지 않는 것이 좋습니다. 이는 테마 라이브러리 디렉터리가 확실한 리소스 디렉터리의 요청으로 로드되는 싱글톤 개체이기 때문입니다.

테마에 UI 요소 연결

UI 요소 비주얼을 적용한 테마에 맞게 변경하는 방법:

  1. 데코레이터를 개체에 추가하고 이를 구성합니다.
  2. 속성 공급자 구성 요소를 개체에 추가하고 이를 구성합니다.

데코레이터

데코레이터는 표준 Unity UI 요소 테마 요소(색상, 스프라이트 또는 글꼴)를 적용하여 해당 UI를 변경하는 구성 요소입니다.

데코레이터는 속성값이 아닌 속성 ID와 UI 요소(이미지 또는 텍스트)에 대한 링크를 포함하고 있습니다. 일반적으로 데코레이터는 테마와 UI 요소 사이의 커넥터와 같습니다. 데코레이터는 Inspector 패널에서 구성합니다.

데코레이터 목록:

  • ImageColorDecorator — 이미지 색상을 변경합니다
  • ImageSpriteDecorator — 이미지 스프라이트를 변경합니다
  • TextFontDecorator — 텍스트 색상을 변경합니다
  • TextColorDecorator — 텍스트 글꼴을 변경합니다

데코레이터가 요소 속성을 변경하게 하는 이벤트:

  • 개체가 테마 편집기에서 또는 게임 런타임 중에 활성화되었습니다.
  • 현재 테마가 편집기에서 또는 게임 런타임 중에 변경되었습니다.
  • 개체 속성 및 테마 사이의 연결이 Inspector 패널에서 변경되었습니다.
  • 속성값이 테마 편집기에서 변경되었습니다.
  • 개체 프리패브가 테마 편집기에서 편집을 위해 열렸습니다.

UI 요소와 테마 사이에 연결을 추가하는 방법:

  1. 데코레이터 구성 요소를 개체에 추가합니다.
  2. 테마의 속성 ID를 선택합니다.

데코레이터가 개체에 추가된 후 데코레이터는 필수 UI 요소를 이 개체에서 찾아서 Comp 변수에 할당하려고 합니다.

데코레이터 애플리케이션 예시:

ImageColorDecorator 데코레이터가 이미지 개체에 추가되었습니다. 색상용 Main Button ID는 예시에서 지정되었습니다. 결과적으로Main Button용으로 테마에서 지정된 색상이 이미지용으로 사용됩니다.

데코레이터는 게임이 플레이되는 동안에도 사용자가 커서를 이용해 개체를 가리키기거나 개체를 클릭하면 구성 요소의 비주얼을 변경할 수 있습니다.

UI 요소 비주얼 동적 변경 방법:

  1. 데코레이터 구성 요소를 개체에 추가합니다.
  2. 테마의 속성 ID를 선택합니다.
  3. DecoratorPointerEvents 구성 요소를 개체에 추가합니다. 이 구성 요소는 개체를 클릭하고 커서로 해당 요소를 가리키는 이벤트를 추적합니다.
  4. 데코레이터 구성 요소에서 TransitionMode 변숫값을 Override로 변경합니다.
  5. 추가한 DecoratorPointerEvents 구성 요소를 데코레이터의 PointerEvents 변수에 할당합니다.
  6. 커서를 이용해 가리킬 시 비주얼 변경 방법:
    1. Override on hover 상자를 체크합니다.
    2. 상자 근처 필드에서 테마의 속성 ID를 선택합니다.
  7. 클릭 시 비주얼 변경 방법:
    1. Override on press 상자를 클릭합니다.
    2. 상자 근처 필드에서 테마의 속성 ID를 선택합니다.

비주얼 동적 변경용 데코레이터 애플리케이션 예시:

ImageColorDecorator 데코레이터가 이미지 개체에 추가되었습니다. 색상용 Main Button ID 및 커서를 가리킬 때의 색상용 Main Button Hover ID는 예시에서 지정되었습니다. 결과적으로 Main Button용으로 테마에서 지정된 색상은 이미지용으로 사용됩니다. 커서를 가리길 때 색상은 Main Button Hover용으로 테마에서 지정된 색상으로 변경됩니다.

속성 공급자

테마 속성용 컨테이너 양식의 속성 공급자 클래스. 사용자 코드와 테마 사이의 더 편리한 연결을 위해 사용됩니다.

속성 공급자 목록:

  • ColorProvider — 색상 속성 링크를 포함합니다.
  • SpriteProvider — 스프라이트 속성 링크를 포함합니다.
  • FontProvider — 글꼴 속성 링크를 포함합니다.

모든 속성 공급자는 Inspector 패널을 통한 더 편리한 구성을 위한 PropertyDrawer를 보유합니다.

속성 공급자를 구성하고 코드에서 속성값을 가져오는 방법:

  1. 개체에 속성 공급자 구성 요소를 추가합니다.
  2. 테마에서 속성 ID를 선택합니다.

속성 공급자 구성 예시:

  1. 스트립트에서 변수를 선언하고 속성 공급자 구성 요소를 변수에 할당합니다.
  2. 색상 값을 가져오려면 GetValue 메서드를 호출합니다.

스크립트 예시:

Copy
Full screen
Small screen
public class ProviderExample : MonoBehaviour
{

  [SerializeField] private ColorPrivider ColorPrivider;

  private void Start()
  {
      Color color = ColorProvuder.GetValue();
  }

}

위젯 작업

위젯 편집기

위젯 편집기를 열려면 Unity 편집기 메인 메뉴로 이동한 다음 Window > Xsolla > UI Widgets Editor를 엽니다.

위젯 편집기 UI가 포함하는 구성 요소:

  • Refresh 버튼 — 프리패브에서 위젯 변경 사항을 적용할 수 있게 합니다.
  • Auto Refresh 상자 — 프리패브에서 자동으로 위젯 변경 사항을 적용할 수 있게 합니다.
  • Widgets 섹션 — 위젯 목록을 포함합니다.

위젯 목록에 수행할 수 있는 작업:

  • 새 위젯을 추가하려면 + 아이콘을 목록의 아래쪽에서 클릭합니다.
  • 선택한 위젯을 삭제하려면 - 아이콘을 목록의 아래쪽에서 클릭합니다.
  • 순서를 변경하려면 = 아이콘을 길게 클릭한 다음 해당 요소를 목록에서 필요한 위치로 드래그합니다.
  • 위젯 이름을 변경하려면 요소 이름이 있는 필드의 텍스트를 변경합니다.
  • 글꼴 또는 스프라이트를 변경하는 방법:

    • 위젯이 있는 필드로 프리패브를 드래그합니다.
    • 아이콘을 클릭하고 프리패브를 선택합니다.

위젯 라이브러리

위젯 라이브러리는 ScriptableObject 클래스에서 상속되었으며 Resources/UIBuilder/WidgetsLibrary 디렉터리에 위치합니다.

Note
위젯 라이브러리 디렉터리 변경은 하지 않는 것이 좋습니다. 이는 테마 라이브러리 디렉터리가 확실한 리소스 디렉터리의 요청으로 로드되는 싱글톤 개체이기 때문입니다.

위젯에 UI 요소 연결

UI 요소를 다른 것으로 쉽게 교체하려면, UI 구축 시 위젯을 직접 사용하는 대신에 위젯 컨테이너를 사용해야 합니다. 그렇게 하면, 같은 유형의 UI 요소를 변경하기 위해 컨테이너가 생성한 위젯을 구성하기만 하면 됩니다. 표준 접근 방식에서는 모든 위젯을 수동으로 교체해야 합니다.

컨테이너는 위젯 오브젝트를 자식 오브젝트로 생성하고 이를 위해 RectTransform 클래스 속성을 구성하여 위젯이 컨테이너 공간을 모두 채우도록 합니다.

컨테이너 구성 요소를 UI 요소 개체에 추가할 때 이 개체는 위젯 생성용 상위 개체로 사용됩니다.

컨테이너가 위젯 속성을 변경하게 하는 이벤트:

  • 개체 속성과 위젯 사이의 연결이 Inspector 패널에서 변경되었습니다.
  • 위젯 프리배프가 위젯 편집기에서 변경되었습니다.

UI 요소 및 위젯 연결 방법:

  1. WidgetContainer 구성 요소를 개체에 추가합니다.
  2. 위젯 ID를 선택합니다.

Note

위젯 컨테이너 오브젝트가 프리팹인 경우, 컨테이너 설정은 프리팹 편집 모드에서만 가능합니다. 이는, 이 모드에서만 Unity 프리팹 내부 자식 객체 계층을 변경할 수 있기 때문입니다.

위젯 교체 시, 현재 위젯은 삭제되고 새 위젯이 생성됩니다. 오브젝트 작동 로직 및 연결 설계 시 이를 유념하시기 바랍니다.

위젯 컨테이너 사용 예시:

WidgetA 개체용으로는 Red Button ID가 있는 위젯이 예시에서 지정되었습니다. 결과적으로 WidgetA 개체가 편집기에서 Red Button 위젯용으로 지정된 프리패브를 사용하여 생성됩니다.

UI 빌더 구조

작동 시 UI 빌더가 사용하는 구성 요소:

  • UIProperty — 다음 데이터가 있는 개체:
    • 속성 ID
    • 속성 이름
    • 비주얼 데이터(색상, 스프라이트, 글꼴 등)

  • Theme — 테마 구성 요소. 테마를 이용하여 UI 비주얼을 변경하고 다른 그룹의 속성 컬렉션(색상, 스프라이트, 글꼴)을 표현할 수 있습니다. 모든 테마는 이름과 고유 식별자를 가지고 있습니다. 속성 ID를 사용하여 테마 속성에 액세스할 수 있습니다.
  • ThemesLibrary — 프로젝트에 존재하는 모든 테마의 라이브러리. 현재 테마의 값을 포함하고 있으며 이 값을 변경할 방법 또한 제공합니다.
  • ThemeDecorator — 테마 속성을 나타내고 표준 Unity UI 구성 요소에 이러한 속성의 값을 적용하는 MonoBehaviour 클래스 구성 요소. 예를 들어 ImageColorDecorator 데코레이터는 이미지 색상을 변경합니다.
  • UIPropertyProvider — 테마 속성에 액세스 권한을 주는 클래스. 이러한 구성 요소를 사용하여 간편하게 사용자 코드를 테마의 데이터와 연결할 수 있습니다. 예를 들어 ColorProvider 클래스는 색상에 대한 데이터를 제공합니다.
  • WidgetContainerMonoBehaviour 클래스 구성 요소는 전체 위젯을 변경할 수 있게 합니다.
  • WidgetsLibrary — 프로젝트에 존재하는 위젯 컬렉션. 본 구성 요소는 모든 위젯의 목록을 포함하고 있으며 위젯의 ID로 위젯을 가져오는 방법을 제공합니다.

이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
숨기기
마지막 업데이트: 2021년 7월 20일

오자 또는 기타 텍스트 오류를 찾으셨나요? 텍스트를 선택하고 컨트롤+엔터를 누릅니다.

문제 보고
콘텐츠를 항상 검토합니다. 여러분의 피드백은 콘텐츠를 개선에 도움이 됩니다.
후속 조치를 위해 이메일을 제공해 주세요
의견을 보내 주셔서 감사드립니다!