สร้างโลกของคุณเอง
การโต้ตอบกับวัตถุ
การนำยานพาหนะมาใช้กับตัวละคร ZEPETO
18นาที
โดยการใช้คู่มือในการติดวัตถุเข้ากับตัวละคร zepeto คุณสามารถทำให้ตัวละครขี่ยานพาหนะ เช่น รถยนต์ เครื่องบิน สัตว์เลี้ยง ฯลฯ ได้เหมือนกับว่าตัวละครกำลังขี่มันอยู่ 📘 กรุณาอ้างอิงไปที่คู่มือต่อไปนี้ \[ การแนบวัตถุกับตัวละคร zepeto docid\ hoje6kdwjoddw48r0mqb0 ] การตั้งค่า animator 1\) สร้าง animator controller โดยไปที่ project > create > animator controller และเปลี่ยนชื่อเป็น vehiclezepetoanimator 2\) ในแท็บ animator ให้สร้างสถานะว่างโดยเลือก create state > empty 3\) เปลี่ยนชื่อให้เหมาะสมใน inspector และกำหนดคลิปอนิเมชันให้กับ motion ในการใช้ไฟล์คลิปอนิเมชันที่คุณต้องการ โปรดดูคู่มืออนิเมชันแบบกำหนดเอง 📘 โปรดดูคู่มือต่อไปนี้ \[ วิธีการใช้แอนิเมชันแบบกำหนดเอง docid\ jknf6qjpod9qmwelyyzyk ] 4\) ลากและวาง vehiclezepetoanimator ลงบน zepetoplayers เพื่อทำการตั้งค่า 👍 เคล็ดลับ หากความสูงของกล้องต้องเปลี่ยนแปลงขึ้นอยู่กับขนาดของรถ คุณสามารถตั้งค่าค่าของ camera lookoffset ใน zepetoplayers ได้ ตัวอย่างโค้ด 1\) สร้าง typescript โดยไปที่ project > create > zepeto > typescript และเปลี่ยนชื่อเป็น ridevehicle 2\) เขียนสคริปต์ตัวอย่างตามที่แสดงด้านล่าง โปรดทราบว่าค่าการแปลงของยานพาหนะในตัวอย่างนี้ควรปรับให้ตรงกับ vehicle prefab เมื่อใช้งานจริง import { zepetoscriptbehaviour } from 'zepeto script'; import { zepetocharacter, zepetoplayers } from 'zepeto character controller'; import { transform, animator, gameobject, humanbodybones, object, vector3, quaternion } from 'unityengine'; export default class ridevehicle extends zepetoscriptbehaviour { public vehicleprefab gameobject; public bodybone humanbodybones; private localcharacter zepetocharacter; private vehicle gameobject; start() { zepetoplayers instance onaddedlocalplayer addlistener(() => { // find the local player and set it to localcharacter this localcharacter = zepetoplayers instance localplayer zepetoplayer character; // get the localcharacter's animator component const animator animator = this localcharacter zepetoanimator; // get the position of the bone to attach the object to const bone transform = animator getbonetransform(this bodybone); // create the vehicle prefab this vehicle = object instantiate(this vehicleprefab, bone) as gameobject; // set vehicle transform this vehicle transform localposition = new vector3(0 5, 0,0); this vehicle transform localrotation = quaternion euler(0, 0,90); }); } } 3\) หลังจากเขียนสคริปต์เสร็จแล้ว ให้เพิ่มสคริปต์ลงใน gameobject ในฉาก 4\) ใน inspector ให้กำหนดทรัพยากร prefab ของรถและกระดูกตัวถังที่จะติดตั้ง 5\) คลิกปุ่มเล่น แล้วคุณจะเห็นตัวละคร zepeto ขี่อยู่บนรถ 👍 เคล็ดลับ คุณสามารถสร้างรถยนต์หลายประเภทได้โดยการเปลี่ยน prefab ของรถและคลิปอนิเมชันของตัวละคร ตัวอย่างการเปลี่ยนขนาดเมื่อบริโภคไอเทม นี่คือตัวอย่างการใช้งานที่สนุก การนำเสนอเนื้อหาที่ขนาดของตัวละครเปลี่ยนไปเมื่อบริโภคไอเทมขณะขี่รถ 1\) ในตัวอย่างนี้ เราเตรียม prefab สองประเภทและตั้งแท็กของไอเทมที่เพิ่มขนาดเมื่อบริโภคเป็น "เพิ่ม" และไอเทมที่ลดขนาดเป็น "ลด" 2\) เพิ่ม collider ให้กับแต่ละไอเทมและตรวจสอบให้แน่ใจว่าได้เลือก istrigger 3\) สร้าง typescript โดยไปที่ project > create > zepeto > typescript และเปลี่ยนชื่อเป็น changeobjectsize 4\) เขียนสคริปต์ตัวอย่างตามที่แสดงด้านล่าง import { collider, gameobject, vector3 } from 'unityengine'; import { zepetoscriptbehaviour } from 'zepeto script'; export default class changeobjectsize extends zepetoscriptbehaviour { public vehicle gameobject; start() { } ontriggerenter(collider collider) { if (collider tag === "increase") { this gameobject transform localscale += new vector3(0 1, 0 1, 0 1); gameobject destroy(collider gameobject); } if (collider tag === "decrease") { const decreaseamount = new vector3(0 1, 0 1, 0 1); const newscale = this gameobject transform localscale decreaseamount; gameobject destroy(collider gameobject); // exception handling ensure that the scale does not become smaller than (1, 1, 1) if (newscale x >= 1 && newscale y >= 1 && newscale z >= 1) { this gameobject transform localscale = newscale; } } } } ส่วนสำคัญของโค้ดคือการปรับเปลี่ยน localscale เพื่อเปลี่ยนขนาดของตัวละคร zepeto เมื่อมันสัมผัสกับแต่ละรายการ ปรับเปลี่ยนตัวเลขสำหรับการเปลี่ยนขนาดได้ตามต้องการ แต่ต้องแน่ใจว่าจัดการข้อยกเว้นเพื่อป้องกันไม่ให้ขนาดเล็กกว่าค่า (1,1,1) 5\) สคริปต์นี้ควรเพิ่มไปยังตัวละคร zepeto ที่สร้างขึ้นในระหว่างการทำงาน ดังนั้นให้ปรับเปลี่ยนสคริปต์ ridevehicle ที่แนบยานพาหนะดังนี้ import { zepetoscriptbehaviour } from 'zepeto script'; import { zepetocharacter, zepetoplayers } from 'zepeto character controller'; import { transform, animator, gameobject, humanbodybones, object, vector3, quaternion } from 'unityengine'; import changeobjectsize from ' /changeobjectsize'; export default class ridevehicle extends zepetoscriptbehaviour { public vehicleprefab gameobject; public bodybone humanbodybones; private localcharacter zepetocharacter; private vehicle gameobject; start() { zepetoplayers instance onaddedlocalplayer addlistener(() => { // ค้นหาผู้เล่นท้องถิ่นและตั้งค่าให้กับ localcharacter this localcharacter = zepetoplayers instance localplayer zepetoplayer character; // รับส่วนประกอบ animator ของ localcharacter const animator animator = this localcharacter zepetoanimator; // รับตำแหน่งของกระดูกเพื่อแนบวัตถุ const bone transform = animator getbonetransform(this bodybone); // สร้าง prefab ยานพาหนะ this vehicle = object instantiate(this vehicleprefab, bone) as gameobject; // ตั้งค่า transform ของยานพาหนะ this vehicle transform localposition = new vector3(0 5, 0,0); this vehicle transform localrotation = quaternion euler(0, 0,90); // เพิ่มสคริปต์ไปยัง charactercontroller const sizescript = this localcharacter gameobject addcomponent\<changeobjectsize>(); // เพิ่มยานพาหนะไปยัง inspector ของสคริปต์ sizescript vehicle = this vehicle; }); } } ได้เพิ่มโค้ดเพื่อเพิ่มสคริปต์ changeobjectsize ในระหว่างการทำงานแล้ว 6\) คลิกที่ปุ่มเล่น และคุณจะเห็นขนาดของตัวละครเปลี่ยนแปลงทุกครั้งที่มันบริโภคไอเท็ม การโต้ตอบกับยานพาหนะ โดยการใช้คู่มือการโต้ตอบ จะสามารถดำเนินการขึ้นรถที่ตำแหน่งที่ต้องการหลังจากโต้ตอบกับมันได้ 📘 โปรดดูคู่มือต่อไปนี้ \[ การโต้ตอบกับวัตถุ docid\ g2x lv 1ysilja9 yrlbi ] การตั้งค่า 1\) ตั้งค่าวัตถุ dockpoint และ ui prefab บน prefab ของยานพาหนะของคุณในลักษณะเดียวกับคู่มือการโต้ตอบ 2\) ใน unity editor ให้แน่ใจว่าปุ่มสลับ gizmo การแปลงที่ด้านบนตั้งค่าเป็น local และหมุนมันเพื่อให้แกน z (ลูกศรสีน้ำเงิน) ชี้ออกจากวัตถุ 3\) เพิ่มคอมโพเนนต์ collider และตรวจสอบตัวเลือก istrigger 4\) ปรับขนาดของ collider ให้เหมาะสมกับช่วงที่ผู้เล่นสามารถโต้ตอบกับวัตถุได้ 5\) สร้างวัตถุเปล่าเป็นลูกของ dockpoint โดยไปที่ hierarchy > สร้างวัตถุเปล่า และเปลี่ยนชื่อเป็น iconpos 6\) ตั้งค่า preficoncanvas ในลักษณะเดียวกับคู่มือการโต้ตอบของวัตถุ จากนั้นทำให้มันเป็น prefab 7\) ขั้นตอนเพิ่มเติม สร้างปุ่มลงจากรถ สร้างปุ่มเป็นลูกของวัตถุรถโดยไปที่ hierarchy > ui > button และเปลี่ยนชื่อเป็นปุ่มลงจากรถ การเพิ่มอนิเมชันการขึ้นรถให้กับรถ เมื่อมีตัวละครขึ้นหรือลงจากรถ พวกเขาต้องมีการตั้งค่าอนิเมเตอร์ที่เป็นธรรมชาติเพื่อให้ตรงกัน คู่มือด้านล่างจะช่วยคุณในการตั้งค่าอนิเมเตอร์ที่จำเป็นสำหรับการขึ้นหรือลง โปรดดูคู่มือเกี่ยวกับการใช้อนิเมชันที่กำหนดเองเพื่อเพิ่มสถานะอนิเมชันนั่งให้กับอนิเมเตอร์ที่กำหนดเองของคุณ 📘 โปรดดูคู่มือต่อไปนี้ \[ วิธีการใช้แอนิเมชันแบบกำหนดเอง docid\ jknf6qjpod9qmwelyyzyk ] 1\) คลิกขวาที่สถานะการเคลื่อนไหวที่เพิ่มเข้ามา คลิกที่ make transition เพื่อสร้างการเปลี่ยนแปลงจาก idle ไปยัง sitting และกลับจาก sitting ไปยัง idle เลือกการเปลี่ยนแปลงที่สร้างขึ้นและยกเลิกการเลือกตัวเลือก has exit time 2\) ใน animator ที่กำหนดเอง → parameters → \[ + ] เพิ่ม bool condition และเปลี่ยนชื่อเป็น isriding 3\) สำหรับการเปลี่ยนแปลงจากสถานะ sitting ไปยัง idle คลิกที่ conditions → \[ + ] และเพิ่ม isriding condition โดยตั้งค่าตัวเลือกเป็น false 4\) สำหรับการเปลี่ยนแปลงจากสถานะ idle ไปยัง sitting คลิกที่ conditions → \[ + ] และเพิ่ม isriding condition โดยตั้งค่าตัวเลือกเป็น true สคริปต์ เขียนสคริปต์ interactionicon ts เช่นเดียวกับในคู่มือการโต้ตอบ ซึ่งจะแสดง ui การโต้ตอบเมื่อเข้าสู่พื้นที่กระตุ้นของ prefab ยานพาหนะ เพิ่ม interactionicon zepetoscript ที่เขียนไว้ในวัตถุ dockpoint และกำหนด pref icon canvas และ icon position ใน inspector ดูตัวอย่างโค้ดใน ridevehicleexample ด้านล่างเพื่อดูวิธีการขึ้นรถหลังจากโต้ตอบกับ ui import { animator, gameobject, humanbodybones, physics, transform, vector3, waitforendofframe } from 'unityengine'; import { zepetoscriptbehaviour } from 'zepeto script'; import { zepetoplayers, zepetocharacter, characterstatemachine } from "zepeto character controller"; import { button } from 'unityengine ui'; import interactionicon from ' /interactionicon'; export default class ridevehicleexample extends zepetoscriptbehaviour { @serializefield() private bodybone humanbodybones; public isriding bool; public getoffbtn button; public vehicleobj gameobject; private interactionicon interactionicon; private localcharacter zepetocharacter; private playersittingposition vector3; private animator animator; private start() { zepetoplayers instance onaddedlocalplayer addlistener(() => { this localcharacter = zepetoplayers instance localplayer zepetoplayer character; this animator = this localcharacter zepetoanimator; }); this interactionicon = this transform getcomponent\<interactionicon>(); this interactionicon onclickevent addlistener(() => { // เมื่อไอคอนการโต้ตอบถูกคลิก ให้ซ่อนไอคอนและทำการโต้ตอบ this interactionicon hideicon(); this dointeraction(); }); // ตั้งค่าเหตุการณ์คลิกสำหรับ getoffbtn (ปุ่มออกจากยานพาหนะ) this getoffbtn onclick addlistener(() => { if(this isriding) { this stopinteraction(); this interactionicon showicon(); } }); this getoffbtn gameobject setactive(false); } //วิธีการสำหรับการทำงานของการขี่ private dointeraction() { // ตั้งค่าค่าการเปลี่ยนแปลงของ animator เพื่อเปลี่ยนสถานะการเคลื่อนไหวปัจจุบันเป็นสถานะนั่ง this animator setbool("isriding", true); this startcoroutine(this snapbone()); // เพื่อแก้ไขการเคลื่อนไหวปัจจุบัน ให้ปิดการใช้งาน animator this localcharacter statemachine constraintstateanimation = true; // ตั้งค่าพ่อแม่ของวัตถุยานพาหนะเป็นตัวละครท้องถิ่น this vehicleobj transform parent = this localcharacter transform; // เปิดใช้งานปุ่ม getoffbutton this getoffbtn gameobject setactive(true); this isriding = true; } private stopinteraction() { // ตั้งค่าค่าการเปลี่ยนแปลงของ animator เพื่อเปลี่ยนสถานะการเคลื่อนไหวเป็น idle this animator setbool("isriding", false); // เปิดใช้งาน animator อีกครั้ง this localcharacter statemachine constraintstateanimation = false; this isriding = false; // ตั้งค่าพ่อแม่ของวัตถุยานพาหนะเป็น null this vehicleobj transform parent = null; // ปิดการใช้งานปุ่ม getountbutton this getoffbtn gameobject setactive(false); } // coroutine สำหรับการ snap กระดูกไปยังยานพาหนะ private snapbone() { const animator animator = this localcharacter zepetoanimator; const bone transform = animator getbonetransform(this bodybone); let idx = 0; while (true) { // คำนวณระยะห่างระหว่างกระดูกและตำแหน่งตัวละคร const distance = vector3 op subtraction(bone position, this localcharacter transform position); const newpos vector3 = vector3 op subtraction(this transform position, distance); // อัปเดตตำแหน่งนั่งของผู้เล่นและตั้งค่าตำแหน่งและการหมุนของตัวละคร this playersittingposition = newpos; this localcharacter transform position = this playersittingposition; this localcharacter transform rotation = this transform rotation; yield new waitforendofframe(); idx++; // ปรับตำแหน่งระหว่าง 5 เฟรมของการเคลื่อนไหว if (idx > 5) { return; } } } } ลำดับการทำงานของสคริปต์มีดังนี้ เริ่มต้น() เมื่อคลิกที่ไอคอน this interactionicon จะถูกปิดการใช้งาน และฟังก์ชัน dointeraction() จะถูกเรียกใช้ dointeraction() ตั้งค่าค่าการเปลี่ยนแปลงของ animator เพื่อเล่นอนิเมชันนั่ง เริ่มต้น coroutine snap bone() เพื่อเชื่อมโยง bodybone ของตัวละคร zepeto กับ targettransform ใช้ฟังก์ชัน this localcharacter statemachine constraintstateanimation = true; เพื่อปิดการเปลี่ยนแปลงของ animator ปัจจุบัน โดยล็อคอนิเมชันที่กำลังเล่นอยู่ พ่อแม่ของวัตถุรถยนต์เปลี่ยนเป็นตัวละคร zepeto ปุ่มลงจากรถที่มุมขวาบนถูกเปิดใช้งาน หยุดการโต้ตอบ() ตั้งค่าค่าการเปลี่ยนแปลงของ animator เพื่อเล่นอนิเมชันอยู่เฉยๆ เปิดใช้งานการเปลี่ยนแปลงของ animator อีกครั้งเพื่อให้อนิเมชันที่เหมาะสมเล่นตามสถานการณ์ ตั้งค่าพ่อแม่ของวัตถุรถยนต์เป็น null ปิดการใช้งานปุ่มลงจากรถ this getoffbtn onclick ฟังก์ชัน stopinteraction() ถูกเรียกใช้ this interactionicon ถูกเปิดใช้งาน เพิ่มสคริปต์ ridevehicleexample ที่เขียนไว้ลงใน dockpoint และกำหนดปุ่ม get off และ prefab ของยานพาหนะใน inspector \[▶︎(เล่น)] กดปุ่มเล่นเพื่อทดลองขึ้นรถ หน้าจอผลลัพธ์ 👍 เคล็ดลับ ตัวอย่างข้างต้นเป็นตัวอย่างของเนื้อหาที่ไม่ถือว่ามีการซิงโครไนซ์แบบผู้เล่นหลายคน ในการดำเนินการซิงโครไนซ์แบบผู้เล่นหลายคน คุณต้องซิงโครไนซ์ข้อมูล เช่น รถที่ผู้เล่นแต่ละคนกำลังนั่งอยู่ ขนาดและตำแหน่งของรถ เช่น สถานะห้อง