--- title: 로컬 플레이어 의상 갈아입기 slug: world-sdk-guide-kr/i4A8Ndv2fn52voHQ-QaKe docTags: createdAt: 2024-09-02T08:34:13.135Z --- 로컬 플레이어의 의상을 소유한 의상으로 변경할 수 있습니다. ZEPETO.Character.Controller 1.11.3 이상 버전을 설치해야 합니다. ## SetCostume API 사용하기 ### 메서드 | **API** | **설명** | | --------------------------------------------------------------- | ------------------------------------------------------------------------ | | SetCostume($itemCode: string, $complete?: System.Action)\:void; | 로컬 플레이어의 의상을 변경하기 위해 아이템 코드(아이템 ID)를 인수 값으로 입력합니다. 의상 변경이 완료되면 콜백을 받습니다. | ## 로컬 플레이어 의상 변경 예제 로컬 플레이어의 의상을 `SetCostume()`. 장면이 시작될 때 로컬 플레이어를 생성하고, 로컬 플레이어가 생성될 때 특정 아이템 코드로 의상을 변경하는 예제 코드입니다. 1\) ZEPETO > Typescript를 추가하고 스크립트 이름을 ChangeLocalPlayerCostume으로 설정합니다. 아래와 같이 샘플 스크립트를 작성합니다. :::CodeblockTabs ChangeLocalPlayerCostume.ts ```typescript import { SpawnInfo, ZepetoPlayers } from 'ZEPETO.Character.Controller'; import { ZepetoScriptBehaviour } from 'ZEPETO.Script'; import { WorldService } from 'ZEPETO.World'; export default class ChangeLocalPlayerCostume extends ZepetoScriptBehaviour { public itemCode: string; // 장면이 시작될 때, 제공된 사용자 ID로 플레이어를 생성하고 의상을 변경합니다. Start() { // 지정된 사용자 ID로 새 플레이어를 생성합니다. ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, new SpawnInfo(), true); // 로컬 플레이어가 추가될 때 트리거되는 OnAddedLocalPlayer 이벤트에 리스너를 추가합니다. ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => { // 제공된 아이템 코드로 ChangeCostume 메서드를 호출하여 의상을 변경합니다. this.ChangeCostume(this.itemCode); }); } // 제공된 아이템 코드를 사용하여 로컬 플레이어의 의상을 변경하는 메서드입니다. ChangeCostume(itemCode: string) { // LocalPlayer 속성을 사용하여 로컬 플레이어 인스턴스에 접근하고 제공된 아이템 코드로 의상을 설정합니다. ZepetoPlayers.instance.LocalPlayer.SetCostume(itemCode, () => { // 의상 변경이 완료되면 성공적인 변경을 나타내는 메시지를 로그에 기록합니다. console.log(`의상 설정 완료 : ${itemCode}`); }); } } ``` ::: ### 스크립트 설명 - 이 스크립트는 주어진 아이템 코드에 따라 로컬 플레이어의 의상을 변경합니다. - 장면이 시작되면, 지정된 사용자 ID로 플레이어를 생성하고 `CreatePlayerWithUserId()` 함수를 사용합니다. - 로컬 플레이어가 추가될 때 해당 이벤트가 트리거되도록 OnAddedLocalPlayer 이벤트 리스너가 추가되며, `ChangeCostume()` 메서드가 호출되어 의상이 변경됩니다. - LocalPlayer 속성을 통해 로컬 플레이어 인스턴스에 접근하고 제공된 아이템 코드를 사용하여 의상을 변경합니다. 의상 변경이 완료되면, `Set Costume Complete` 메시지가 기록되어 성공적인 변경을 나타냅니다. :::hint{type="info"} **📘 **아이템 ID를 확인하는 방법에 대한 마네킹 가이드를 참조하십시오. \[[ZEPETO 마네킹](docId\:v62GK-Uu8IiScyHFO_J85)] ::: 2\) \[▶︎(재생)] 버튼을 눌러 실행하면 입력한 아이템 코드에 따라 의상이 변경된 로컬 플레이어가 생성되는 것을 볼 수 있습니다. ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-9ot0wNN2ut4K4pljvcSHI-20240904-102422.png) 의상 변경 전(왼쪽), 의상 변경 후(오른쪽) :::hint{type="danger"} - 아이템이 정기 상품인 경우, 만료 여부를 확인한 후 착용됩니다. 만료된 아이템에 대해서는 다음과 같은 오류 로그가 호출됩니다: `만료된 아이템`이 호출됩니다. - 아이템이 Zem 유료 상품인 경우, 로컬 플레이어가 소유하고 있는지 확인한 후 착용됩니다. 소유하지 않은 아이템에 대해서는 다음과 같은 오류 로그가 호출됩니다: `아이템 코드 없음`이 호출됩니다. ::: ### 아이템 목록 로딩 및 의상 변경 예시. 사용자가 소유한 아이템에 대한 정보를 제공하는 `GetMyItemListAsync()`, 를 활용하여 의상 아이템 목록을 가져올 수 있습니다. 다음 예시는 로컬 플레이어가 소유한 의상을 화면에 표시하고 선택하여 의상을 변경할 수 있도록 하는 방법을 보여줍니다. ### 1단계. 의상 목록 UI 생성 먼저, 의상 목록의 썸네일과 이름이 표시될 UI 목록 리소스를 생성합니다. 제작해야 할 리소스는 다음과 같습니다: ### 1단계-1. 아이템 프리팹 생성 로컬 플레이어가 소유한 의상 목록을 로딩한 후, UI에서 아이템 목록을 생성합니다. 아이템 프리팹은 생성되는 각 아이템 목록의 소스 역할을 합니다. 아이템 프리팹이 생성되면, 썸네일과 아이템 이름이 UI에 표시됩니다. 아이템 프리팹은 다음 요소를 포함합니다. 1. Button\_thumbnail 객체: 이 객체는 아이템의 썸네일 이미지를 표시하기 위해 Raw Image 구성 요소와 Button 구성 요소가 등록된 객체입니다. 2. Text\_name 객체: 아이템 이름이 표시될 Text 구성 요소 객체입니다. ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-Qm6kn6yLAAWhZNwsPWpok-20240904-102422.png) ### 1-2단계. 캔버스 설정 캔버스는 아이템 프리팹이 생성될 때 표시되는 UI 화면입니다. 많은 아이템 목록을 가져올 수 있도록 이 캔버스 안에 스크롤 뷰를 만드는 것이 좋습니다. 캔버스 안의 스크롤 뷰 객체는 다음과 같이 설정됩니다. - 스크롤 뷰 객체는 수직 스크롤만 허용하도록 설정됩니다. - 콘텐츠 객체는 다음 구성 요소를 설정합니다: - 그리드 레이아웃 그룹: - 셀 크기 : x: 150, Y: 150 - 제약 조건 : 고정 열 수 - 제약 수 : 5 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-wLg_pemNWFYxohPdYWt-N-20240904-102422.png) ### 2단계. 아이템 목록을 로드하고 의상을 변경하는 스크립트 ### 단계 2-1. 스크립트 작성하기 - ZEPETO 추가 > Typescript로 스크립트 이름을 MyItemList로 변경합니다. - 아래와 같이 샘플 스크립트를 작성합니다. :::CodeblockTabs MyItemList.ts ```typescript import { ZepetoScriptBehaviour } from 'ZEPETO.Script'; import { ShopService, ItemKeyword } from 'ZEPETO.Module.Shop'; import { ZepetoPropertyFlag } from 'Zepeto'; import { GameObject, Object, RectTransform, Texture2D, Transform, WaitUntil } from 'UnityEngine'; import { Button, LayoutRebuilder, RawImage, Text } from 'UnityEngine.UI'; import { SpawnInfo, ZepetoPlayers } from 'ZEPETO.Character.Controller'; import { WorldService } from 'ZEPETO.World'; import { Item } from 'ZEPETO.Module.Content'; export default class CheckMyItemList extends ZepetoScriptBehaviour { public itemPrefab: GameObject; public itemCanvas: Transform; // 장면이 시작될 때, 제공된 사용자 ID로 플레이어를 생성하고 아이템을 가져와서 표시합니다. Start() { // 지정된 사용자 ID로 새 플레이어를 생성합니다. ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, new SpawnInfo(), true); // 로컬 플레이어가 추가될 때 트리거되는 OnAddedLocalPlayer 이벤트에 리스너를 추가합니다. ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => { // 아이템을 가져오고 표시하기 위해 CoGetMyItem 코루틴을 시작합니다. this.StartCoroutine(this.CoGetMyItem()); }); } // 아이템을 가져오고 표시하는 코루틴입니다. *CoGetMyItem() { // "all" 키워드와 필터 없이 아이템 목록을 요청합니다. var requestItemList = ShopService.GetMyContentItemListAsync(ItemKeyword.all, null); // 요청이 완료될 때까지 기다립니다. yield new WaitUntil(() => requestItemList.keepWaiting == false); if (requestItemList.responseData.isSuccess) { let contentItems: Item[] = requestItemList.responseData.items; console.log(contentItems.length); for (let i = 0; i < contentItems.length; ++i) { const property: ZepetoPropertyFlag = contentItems[i].property; // 아이템의 썸네일 텍스처를 요청합니다. var textureReq = contentItems[i].GetThumbnailAsync(); yield new WaitUntil(() => textureReq.keepWaiting == false); let thumbnailTexture: Texture2D = textureReq.responseData.texture; // 아이템 프리팹을 인스턴스화하고 속성을 설정합니다. const item = Object.Instantiate(this.itemPrefab, this.itemCanvas) as GameObject; item.GetComponentInChildren().texture = thumbnailTexture; item.GetComponentInChildren().text = contentItems[i].id; // 클릭 시 의상을 변경하는 아이템 버튼에 클릭 리스너를 추가합니다. item.GetComponentInChildren