เปลี่ยนชุดผู้เล่นท้องถิ่น
คุณสามารถเปลี่ยนชุดของผู้เล่นท้องถิ่นเป็นชุดที่คุณมีได้
ต้องติดตั้ง ZEPETO.Character.Controller เวอร์ชัน 1.11.3 หรือสูงกว่า
การใช้ API SetCostume
วิธีการ
API | คำอธิบาย |
|---|---|
SetCostume($itemCode: string, $complete?: System.Action):void; | ใส่รหัสรายการ (item id) เป็นค่าพารามิเตอร์เพื่อเปลี่ยนชุดของผู้เล่นท้องถิ่น รับการเรียกกลับเมื่อการเปลี่ยนชุดเสร็จสิ้น |
ตัวอย่างการเปลี่ยนชุดผู้เล่นท้องถิ่น
คุณสามารถเปลี่ยนชุดของผู้เล่นท้องถิ่นโดยใช้ SetCostume().
นี่คือตัวอย่างโค้ดที่สร้างผู้เล่นท้องถิ่นเมื่อฉากเริ่มต้น และเปลี่ยนชุดด้วยรหัสไอเท็มเฉพาะเมื่อผู้เล่นท้องถิ่นถูกสร้างขึ้น
1) เพิ่ม ZEPETO > Typescript และตั้งชื่อสคริปต์ว่า ChangeLocalPlayerCostume
เขียนสคริปต์ตัวอย่างตามด้านล่าง
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}`);
});
}
}คำอธิบายสคริปต์
- สคริปต์นี้เปลี่ยนชุดของผู้เล่นท้องถิ่นตามรหัสรายการที่กำหนดไว้
- เมื่อฉากเริ่มต้น ให้สร้างผู้เล่นด้วยรหัสผู้ใช้ที่ระบุและใช้ CreatePlayerWithUserId() ฟังก์ชันนี้
- มีการเพิ่มตัวฟังเหตุการณ์ OnAddedLocalPlayer เพื่อให้เมื่อมีการเพิ่มผู้เล่นท้องถิ่น เหตุการณ์นั้นจะถูกเรียกใช้ และ ChangeCostume() เมธอดจะถูกเรียกเพื่อเปลี่ยนชุด
- เข้าถึงอินสแตนซ์ผู้เล่นท้องถิ่นผ่านคุณสมบัติ LocalPlayer และเปลี่ยนชุดโดยใช้รหัสรายการที่ให้ไว้ เมื่อการเปลี่ยนชุดเสร็จสิ้น จะมีการบันทึกข้อความ Set Costume Complete ซึ่งจะแสดงถึงการเปลี่ยนแปลงที่สำเร็จ
📘 กรุณาอ้างอิงคู่มือหุ่นจำลองเกี่ยวกับวิธีการตรวจสอบรหัสรายการ[ZEPETO Mannequin]
2) หากคุณกดปุ่ม [▶︎(เล่น)] เพื่อรันมัน คุณจะเห็นว่าผู้เล่นท้องถิ่นถูกสร้างขึ้นและเปลี่ยนด้วยชุดเครื่องแต่งกายตามรหัสรายการที่ป้อนเข้าไป

ก่อนการเปลี่ยนชุดเครื่องแต่งกาย (ซ้าย), หลังการเปลี่ยนชุดเครื่องแต่งกาย (ขวา)
- หากรายการเป็นผลิตภัณฑ์ที่มีระยะเวลาคงที่ จะต้องสวมใส่หลังจากตรวจสอบว่าหมดอายุหรือไม่ สำหรับรายการที่หมดอายุ จะมีบันทึกข้อผิดพลาดที่เรียกว่า รายการหมดอายุ ถูกเรียกว่า.
- หากรายการเป็นผลิตภัณฑ์ที่จ่ายด้วย Zem จะต้องสวมใส่หลังจากตรวจสอบว่าผู้เล่นท้องถิ่นเป็นเจ้าของหรือไม่ สำหรับรายการที่ไม่มีเจ้าของ จะมีบันทึกข้อผิดพลาดที่เรียกว่า ไม่มี ItemCode ถูกเรียกว่า.
ตัวอย่างการโหลดรายการเสื้อผ้าและการเปลี่ยนชุด
คุณสามารถดึงรายการเสื้อผ้าโดยใช้ GetMyItemListAsync(), ซึ่งให้ข้อมูลเกี่ยวกับรายการที่ผู้ใช้เป็นเจ้าของ.
ตัวอย่างต่อไปนี้แสดงวิธีการแสดงชุดเครื่องแต่งกายที่ผู้เล่นท้องถิ่นเป็นเจ้าของบนหน้าจอและให้พวกเขาเลือกและเปลี่ยนชุดเครื่องแต่งกายได้
ขั้นตอนที่ 1. สร้าง UI รายการเสื้อผ้า
ก่อนอื่น สร้างทรัพยากร UI รายการที่จะแสดงภาพขนาดย่อและชื่อของรายการเสื้อผ้า ทรัพยากรที่ต้องสร้างรวมถึง:
ขั้นตอนที่ 1-1. สร้าง Item Prefab
หลังจากโหลดรายการเสื้อผ้าที่ผู้เล่นท้องถิ่นมี เราจะสร้างรายการรายการใน UI Item Prefab ทำหน้าที่เป็นแหล่งข้อมูลสำหรับแต่ละรายการที่ถูกสร้างขึ้น
เมื่อสร้าง Item Prefab ขึ้นมา จะมีภาพขนาดย่อและชื่อรายการแสดงใน UI.
Item Prefab ประกอบด้วยองค์ประกอบดังต่อไปนี้.
- วัตถุ Button_thumbnail: นี่คือวัตถุที่มีส่วนประกอบ Raw Image และส่วนประกอบ Button ลงทะเบียนเพื่อแสดงภาพขนาดย่อของรายการ.
- วัตถุ Text_name: วัตถุส่วนประกอบ Text ที่ชื่อรายการจะแสดงอยู่.

ขั้นตอนที่ 1-2. การตั้งค่า Canvas
Canvas คือหน้าจอ UI ที่แสดงเมื่อสร้าง Item Prefab ขึ้นมา แนะนำให้สร้าง Scroll View ภายใน Canvas นี้เพื่อให้สามารถดึงรายการขนาดใหญ่ได้.
วัตถุ Scroll View ภายใน Canvas ถูกตั้งค่าไว้ดังนี้.
- วัตถุ Scroll View ถูกตั้งค่าให้อนุญาตการเลื่อนแนวตั้งเท่านั้น
- วัตถุ Content ตั้งค่าคอมโพเนนต์ต่อไปนี้:
- กลุ่มเลย์เอาต์แบบกริด:
- ขนาดเซลล์ : x: 150, Y: 150
- ข้อจำกัด : จำนวนคอลัมน์ที่คงที่
- จำนวนข้อจำกัด : 5

ขั้นตอนที่ 2. สคริปต์เพื่อโหลดรายการและเปลี่ยนชุด
ขั้นตอน 2-1. เขียนสคริปต์
- เพิ่ม ZEPETO > Typescript และเปลี่ยนชื่อสคริปต์เป็น MyItemList.
- เขียนสคริปต์ตัวอย่างตามด้านล่าง.
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(() => {
// เริ่ม Coroutine CoGetMyItem เพื่อดึงและแสดงรายการสินค้า
this.StartCoroutine(this.CoGetMyItem());
});
}
// Coroutine เพื่อดึงและแสดงรายการสินค้า
*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;
// ขอ texture thumbnail สำหรับสินค้า
var textureReq = contentItems[i].GetThumbnailAsync();
yield new WaitUntil(() => textureReq.keepWaiting == false);
let thumbnailTexture: Texture2D = textureReq.responseData.texture;
// สร้าง prefab สินค้าและตั้งค่าคุณสมบัติ
const item = Object.Instantiate(this.itemPrefab, this.itemCanvas) as GameObject;
item.GetComponentInChildren<RawImage>().texture = thumbnailTexture;
item.GetComponentInChildren<Text>().text = contentItems[i].id;
// เพิ่มผู้ฟังการคลิกไปยังปุ่มสินค้าเพื่อเปลี่ยนชุดเมื่อคลิก
item.GetComponentInChildren<Button>().onClick.AddListener(() => {
this.SetItemButton(contentItems[i].id);
});
}
}
// บังคับให้สร้างเลย์เอาต์ใหม่เพื่อให้แน่ใจว่าการจัดตำแหน่งของ UI ถูกต้อง
const rect = this.itemCanvas.gameObject.GetComponent<RectTransform>();
LayoutRebuilder.ForceRebuildLayoutImmediate(rect);
}
// วิธีการเปลี่ยนชุดของผู้เล่นท้องถิ่นตามรหัสสินค้าที่ให้มา
SetItemButton(itemCode: string) {
// ใช้คุณสมบัติ ZepetoPlayers.instance.LocalPlayer เพื่อเข้าถึงอินสแตนซ์ผู้เล่นท้องถิ่นและเปลี่ยนชุดของพวกเขา
ZepetoPlayers.instance.LocalPlayer.SetCostume(itemCode, () => {
// เมื่อการเปลี่ยนชุดเสร็จสิ้น ให้บันทึกข้อความที่บ่งบอกถึงการเปลี่ยนแปลงที่สำเร็จ
console.log(`Set Costume Complete : ${itemCode}`);
});
}
}คำอธิบายสคริปต์
- ในวิธี Start ผู้เล่นใหม่ถูกสร้างขึ้นโดยใช้ ZepetoPlayers.instance.CreatePlayerWithUserId()และ CoGetMyItem() coroutine จะถูกเรียกใช้เมื่อผู้เล่นท้องถิ่นถูกเพิ่มเข้าไป.
- coroutine ของ CoGetMyItem() ใช้ ShopService.GetMyContentItemListAsync() เพื่อดึงรายการของรายการที่ผู้เล่นเป็นเจ้าของ.
- ขอรายการของรายการทั้งหมดในทุกหมวดหมู่ผ่าน ItemKeyword.all รอจนกว่าคำขอจะเสร็จสิ้นโดยใช้ yield new WaitUntil(() => requestItemList.keepWaiting == false).
- ถ้าคำขอสำเร็จ requestItemList.responseData.isSuccess, ทำการวนซ้ำผ่านรายการของ contentItems และดึงภาพขนาดย่อของแต่ละรายการโดยใช้ GetThumbnailAsync().
- สร้างองค์ประกอบ UI สำหรับแต่ละรายการโดยใช้ itemPrefab ที่ให้มา และตั้งค่าภาพขนาดย่อและ ID ปุ่มสำหรับแต่ละรายการถูกสร้างขึ้น และตั้งค่าให้เรียก SetItemButton() โดยใช้ ID ของรายการเป็นอาร์กิวเมนต์.
- วิธีการ SetItemButton() จะถูกเรียกเมื่อปุ่มที่เกี่ยวข้องกับรายการถูกคลิก.
- ใช้รายการที่เลือกเป็นชุดเครื่องแต่งกายของตัวละครผู้เล่นโดยใช้ ZepetoPlayers.instance.LocalPlayer.SetCostume().
- เมื่อชุดเครื่องแต่งกายถูกเปลี่ยนสำเร็จ ข้อความบันทึกที่บอกว่า Set Costume Complete จะถูกแสดงพร้อมกับรหัสรายการ.
📘 เคล็ดลับ
- โปรดดูคู่มือด้านล่างเกี่ยวกับวิธีการตรวจสอบข้อมูลรายการของผู้ใช้ผ่าน ShopService.GetMyContentItemListAsync(). [ค้นหาข้อมูลเกี่ยวกับสิ่งของที่ผู้ใช้เป็นเจ้าของ]
- เมื่อค้นหารายการที่ผู้ใช้เป็นเจ้าของ คุณสามารถค้นหาตามหมวดหมู่โดยใช้ ItemKeyword และแสดงในรายการบน UI.
❗️ ระวัง รายการเสื้อผ้าที่ดึงมาผ่าน ShopService.GetMyContentItemListAsync() มีผลิตภัณฑ์ที่หมดอายุและมีเวลาจำกัด ดังนั้น รายการที่หมดอายุ สามารถเรียกดูบันทึกข้อผิดพลาดได้.
ขั้นตอน 2-2. การตั้งค่าตรวจสอบ MyItemList
ลงทะเบียน itemPrefab ที่สร้างขึ้นในขั้นตอนที่ 1 ใน Item Prefab ของคอมโพเนนต์ที่ MyItemList ถูกนำไปใช้ และลงทะเบียน Canvas ใน itemCanvas.

ขั้นตอนที่ 3. รัน
หากคุณกดปุ่มเล่นเพื่อรัน มุมมอง UI ของแคนวาสจะแสดงรายการของที่เป็นเจ้าของโดยผู้เล่นท้องถิ่น และคุณจะเห็นว่าของเปลี่ยนเป็นชุดที่ตรงกันเมื่อเลือก

❗️ ระวัง
- API การสวมชุดนี้ใช้ได้เฉพาะกับผู้เล่นท้องถิ่นและไม่รองรับการซิงโครไนซ์แบบผู้เล่นหลายคนในขณะนี้
- การซิงโครไนซ์ชุดแบบผู้เล่นหลายคนจะมีให้ในอนาคต