CREATE YOUR WORLD
Players & Characters: Advanced

Change local player costume

16min
you can change a local player’s outfit to the ones that you own zepeto character controller 1 11 3 or higher version must be installed using the setcostume api method api description setcostume($itemcode string, $complete? system action)\ void; enter the item code (item id) as the argument value to change the local player’s outfit receive a callback once the outfit change is complete local player costume change example you can change the local player's costume using setcostume() here is an example code that creates a local player when the scene starts, and changes the outfit with a specific item code when the local player is created 1\) add zepeto > typescript and name the script changelocalplayercostume write a sample script as below changelocalplayercostume ts 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; // when the scene starts, create a player with the provided user id and change their costume start() { // create a new player with the specified user id zepetoplayers instance createplayerwithuserid(worldservice userid, new spawninfo(), true); // add a listener to the onaddedlocalplayer event, which triggers when the local player is added zepetoplayers instance onaddedlocalplayer addlistener(() => { // call the changecostume method with the provided item code to change the costume this changecostume(this itemcode); }); } // method to change the costume of the local player using the provided item code changecostume(itemcode string) { // use the localplayer property to access the local player instance and set their costume using the provided item code zepetoplayers instance localplayer setcostume(itemcode, () => { // once the costume change is complete, log a message indicating the successful change console log(`set costume complete ${itemcode}`); }); } } script description this script changes the outfit of the local player according to the given item code when the scene starts, create a player with the specified user id and use the createplayerwithuserid() function an onaddedlocalplayer event listener is added so that when a local player is added, that event is triggered, and the changecostume() method is called to change the costume access the local player instance through the localplayer property and change the costumes using the provided item code once the costume change is complete, a set costume complete message will be logged, indicating a successful change 📘 please refer to the mannequin guide on how to check the item id \[ zepeto mannequin docid\ gyqluyr123q418u dgrio ] 2\) if you press the \[▶︎(play)] button to run it, you can see that the local player is created and changed with the costume based on entered item code before the costume change (left), after the costume change (right) if the item is a fixed term product, it will be worn after checking whether it has expired for items that have expired, an error log called expired item is called if the item is a zem paid product, it will be worn after checking whether it is owned by a local player for items not owned, an error log called has not itemcode is called example of loading an item list and changing clothes you can retrieve the list of clothing items by utilizing getmyitemlistasync() , which provides information about the items owned by the user the following example demonstrates how to display the outfits owned by a local player on the screen and enable them to select and change outfits step 1 create a clothing list ui first, create a ui list resource where the thumbnail and name of the clothing list will be displayed resources that need to be crafted include step 1 1 create item prefab after loading the list of clothes the local player has, we create a list of items in the ui the item prefab serves as a source for each item list being created as the item prefab is created, the thumbnail and item name are displayed in the ui the item prefab contains the following elements button thumbnail object this is an object where the raw image component and button component are registered to display the thumbnail image of the item text name object a text component object in which the item name will be displayed step 1 2 setting up canvas canvas is the ui screen displayed when item prefab is created it is recommended to create a scroll view inside this canvas so that a large list of items can be retrieved the scroll view object inside the canvas is set as follows the scroll view object is set to allow only vertical scrolling the content object sets up the following components grid layout group cellsize x 150, y 150 constraint fixed column count constrait count 5 step 2 script to load item list and change outfit step 2 1 write a script add zepeto > typescript and rename the script to myitemlist write a sample script as below myitemlist ts 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; // when the scene starts, create a player with the provided user id and begin fetching and displaying the items start() { // create a new player with the specified user id zepetoplayers instance createplayerwithuserid(worldservice userid, new spawninfo(), true); // add a listener to the onaddedlocalplayer event, which triggers when the local player is added zepetoplayers instance onaddedlocalplayer addlistener(() => { // start the cogetmyitem coroutine to fetch and display the items this startcoroutine(this cogetmyitem()); }); } // coroutine to fetch and display the items cogetmyitem() { // request the item list with the "all" keyword and no filters var requestitemlist = shopservice getmycontentitemlistasync(itemkeyword all, null); // wait until the request is complete 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; // request the thumbnail texture for the item var texturereq = contentitems\[i] getthumbnailasync(); yield new waituntil(() => texturereq keepwaiting == false); let thumbnailtexture texture2d = texturereq responsedata texture; // instantiate an item prefab and set its properties const item = object instantiate(this itemprefab, this itemcanvas) as gameobject; item getcomponentinchildren\<rawimage>() texture = thumbnailtexture; item getcomponentinchildren\<text>() text = contentitems\[i] id; // add a click listener to the item button to change the costume when clicked item getcomponentinchildren\<button>() onclick addlistener(() => { this setitembutton(contentitems\[i] id); }); } } // force layout rebuild to ensure proper ui element positioning const rect = this itemcanvas gameobject getcomponent\<recttransform>(); layoutrebuilder forcerebuildlayoutimmediate(rect); } // method to change the local player's costume based on the provided item code setitembutton(itemcode string) { // use the zepetoplayers instance localplayer property to access the local player instance and change their costume zepetoplayers instance localplayer setcostume(itemcode, () => { // once the costume change is complete, log a message indicating the successful change console log(`set costume complete ${itemcode}`); }); } } script description in the start method, a new player is created using zepetoplayers instance createplayerwithuserid() and the cogetmyitem() coroutine is executed when the local player is added the cogetmyitem() coroutine uses shopservice getmycontentitemlistasync() to retrieve the list of items owned by the player request a list of all items in all categories via itemkeyword all wait until the request is complete using yield new waituntil(() => requestitemlist keepwaiting == false) if the request is successful requestitemlist responsedata issuccess , iterates through the list of contentitems and retrieves each item's thumbnail image using getthumbnailasync() create a ui element for each item using the provided itemprefab, and set the thumbnail image and id a button for each item is created, and set to call setitembutton() with the id of the item as an argument the setitembutton() method is called when the button associated with an item is clicked apply the selected item as the player's character costume using zepetoplayers instance localplayer setcostume() when the costume is successfully changed, a log message saying set costume complete is displayed along with the item code 📘 tips please refer to the following guide on how to check the item information of the user through shopservice getmycontentitemlistasync() \[ get information about items owned by a user docid\ f h8587l2x7g4lmtydthh ] when searching for items owned by the user, you can search by category using itemkeyword and display them in a list on the ui ❗️ caution the list of clothes retrieved through shopservice getmycontentitemlistasync() contains expired time limited products so expired item error log can be called step 2 2 setting the myitemlist inspector register the itemprefab created in step 1 in the item prefab of the component to which myitemlist is applied, and register the canvas in the itemcanvas step 3 run if you press the play button to run it, the canvas ui will display a list of items owned by the local player, and you can see that the item changes to the corresponding outfit when selected ❗️ caution this costume wearing api only applies to local players and does not currently support multiplayer synchronization costume multiplayer synchronization will be available in the future