ใช้ภาพเคลื่อนไหวแผ่นสไปรท์

สภาพแวดล้อมการตรวจสอบ

หน้าต่าง

• หน้าต่าง 11

บรรณาธิการ Unity

• ปี 2020.3.25f1

แพ็คเกจระบบอินพุต

• 1.2.0

ข้อกําหนดเบื้องต้นสําหรับเคล็ดลับนี้

การตั้งค่าต่อไปนี้ถูกกําหนดค่าไว้ล่วงหน้าเป็นข้อกําหนดเบื้องต้นสําหรับคําอธิบายของเคล็ดลับเหล่านี้

• ขอแนะนําแพ็คเกจระบบอินพุต
• จัดตําแหน่งกล้อง (2D) ให้ตรงกับผืนผ้าใบ

Sprite Sheet Animation คืออะไร?

ในเกมสมัยใหม่ตัวละครและเอฟเฟกต์จะเคลื่อนไหวโดยการย้ายโมเดล 3 มิติการคํานวณการระเบิดแบบเรียลไทม์และการแสดงเอฟเฟกต์ สิ่งนี้เป็นไปได้เพราะพลังการคํานวณของคอนโซลเกมเพิ่มขึ้น แต่เนื่องจากคอนโซลเกมเก่าไม่มีพลังมากนักแอนิเมชั่นแผ่นสไปรท์ที่เปลี่ยนภาพอย่างต่อเนื่องเพื่อให้ดูเหมือนว่ามันกําลังเคลื่อนที่เป็นกระแสหลัก หลักการนี้เหมือนกับอนิเมะที่เล่นทางทีวี ภาพเคลื่อนไหวแผ่นสไปรท์ถูกใช้โดยเกมน้อยกว่าในอดีต แต่ก็ยังมักใช้เนื่องจากภาระที่จําเป็นสําหรับการคํานวณนั้นต่ํากว่ามาก

สไปรท์แผ่นภาพเคลื่อนไหวสลับและแสดงภาพหลายภาพในแถว เป็นการยากที่จะเตรียมไฟล์ภาพให้มากที่สุดเท่าที่จะทําได้และโดยทั่วไปรูปแบบการแสดงผลทั้งหมดจะรวมอยู่ในภาพเดียว ทําให้ง่ายต่อการจัดการไฟล์ภาพและลดภาระในการโหลดไฟล์ภาพ ไฟล์ภาพที่สรุปภาพเคลื่อนไหวนี้เรียกว่า "แผ่นสไปรท์"

สร้างแผ่นงานสไปรท์

แผ่นสไปรท์เป็นเพียงไฟล์ภาพ เนื่องจากไม่มีส่วนเกี่ยวข้องกับ Unity โปรดสร้างด้วยเครื่องมือแก้ไขภาพ รูปแบบไฟล์สุดท้ายจะเป็นไฟล์ PNG ที่ Unity สามารถจัดการได้

นอกจากนี้ยังมีกฎต่อไปนี้สําหรับการสร้างแผ่นสไปรท์

• รวมขนาดภาพของเฟรมทั้งหมดเข้าด้วยกัน ตัวอย่างเช่น หากภาพแรกมีขนาด 32x32 พิกเซล ภาพที่สองและภาพถัดไปจะเป็น 32x32 พิกเซล ตัวอย่างเช่น หากคุณเตรียมแผ่นสไปรท์ในรูปแบบ "3x2" ที่มี 6 เฟรม ขนาดของแผ่นสไปรท์จะเป็น 96x64 พิกเซล
• คุณสามารถจัดแนวภาพได้อย่างอิสระเช่น "6x4" หรือ "2x8" แต่อย่าลืมสร้างภาพบนสมมติฐานที่ว่าเฟรมทั้งหมดจะถูกเติมเต็ม ถ้าเป็น "6x4" ก็ 24 เฟรมและอื่น ๆ หากเป็นภาพเคลื่อนไหว 13 เฟรม ให้เตรียมด้วย "1x13" หรือ "13x1"
• เนื่องจากเป็นภาพเคลื่อนไหวจึงจัดตําแหน่งอย่างเหมาะสมเพื่อไม่ให้มีการจัดแนวผิดแนวในเฟรมก่อนและหลัง
• ทิศทางของภาพเคลื่อนไหวเริ่มต้นจากเซลล์ด้านซ้ายบนและไปทางขวาและเมื่อคุณไปทางขวาสุดมันจะเริ่มจากซ้ายหนึ่งก้าวลงและไปทางขวาอีกครั้ง

ในความเป็นจริงคุณไม่จําเป็นต้องทําข้างต้นอย่างเคร่งครัดใน Unity แต่มันง่ายกว่ามากที่จะตัดสินใจเกี่ยวกับข้อกําหนดล่วงหน้า

คราวนี้ฉันจะใช้แผ่นสไปรท์เพื่อสลับหมายเลขต่อไปนี้ หนึ่งสี่เหลี่ยมจัตุรัสคือ 32x32 พิกเซล ประกอบด้วยเฟรม "6x4" 24 เฟรมดังนั้นขนาดภาพคือ 192x128 พิกเซล

การกําหนดค่าแผ่นงานสไปรท์ใน Unity Editor

เมื่อคุณสร้างโครงการแล้ว ให้เพิ่มไฟล์แผ่นงานสไปรท์ลงในโครงการของคุณ ที่นี่สันนิษฐานว่าชื่อไฟล์คือ NumberAnimation .

NumberAnimation เลือกไฟล์และกรอกตัวตรวจสอบดังนี้:

มีการตั้งค่าอื่น ๆ อีกมากมายที่สามารถกําหนดค่าได้ แต่ปล่อยให้เป็นอย่างที่เป็นอยู่ตอนนี้ เมื่อกําหนดค่าแล้วให้คลิกปุ่ม "Sprite Editor"

หากกล่องโต้ตอบด้านล่างปรากฏขึ้นให้คลิกปุ่ม "ใช้" ในความเป็นจริงการตั้งค่าของตัวตรวจสอบนี้จะต้องถูกบันทึกไว้และหากคุณเลื่อนไปที่ด้านล่างจะมีปุ่ม "ใช้" ดังนั้นคุณต้องบันทึกการตั้งค่าด้วยปุ่มนี้ นอกจากนี้ยังจะถูกบันทึกโดย "ใช้" ในกล่องโต้ตอบดังนั้นจึงไม่สําคัญว่าคุณจะบันทึกด้วยวิธีใด

ตัวแก้ไขสไปรท์จะปรากฏขึ้น ในส่วนนี้เราจะดําเนินการแยกสไปรท์ออกจากแผ่นสไปรท์

มีปุ่มที่เรียกว่า "หั่น" ที่มุมบนซ้ายคลิกที่มันและเปลี่ยนประเภทเป็น "ตารางตามขนาดเซลล์" ในแผ่นสไปรท์นี้สไปรท์หนึ่งขนาดคือพิกเซล" 32x32" ดังนั้นให้ป้อน 32 สําหรับแต่ละขนาดพิกเซล เมื่อเสร็จแล้ว ให้คลิกปุ่ม สไลซ์

ภาพนี้ยากที่จะเข้าใจเพราะดูเหมือนว่าจะแบ่งอย่างชัดเจนตั้งแต่ต้น แต่หารด้วย 1 สไปรท์ 32px กดปุ่ม "Ctrl" และเส้นแบ่งจะปรากฏเป็นสีเขียว

หลังจากแยกแล้วให้บันทึกด้วยปุ่ม "ใช้"

หากคุณคลิกสามเหลี่ยมในไฟล์รูปภาพของโครงการเพื่อขยายคุณจะเห็นว่าสไปรท์ถูกแบ่งออก

ตําแหน่งสไปรท์และแอนิเมชั่น

ลากสไปรท์ชุดลงในมุมมองและวาง

จากนั้นกล่องโต้ตอบจะปรากฏขึ้นดังนั้นบันทึก NumberAnimation เป็น . ไฟล์นี้เก็บการตั้งค่าภาพเคลื่อนไหว

สไปรท์แรกถูกวางไว้ในมุมมองและตัวควบคุมภาพเคลื่อนไหวและคลิปภาพเคลื่อนไหวจะถูกสร้างขึ้นในโครงการ หากภาพมีขนาดเล็ก ให้ตั้งค่าสเกลเพื่อให้ใหญ่ขึ้น

ณ จุดนี้การตั้งค่าภาพเคลื่อนไหวเริ่มต้นจะถูกนําไปใช้เพื่อให้คุณสามารถเรียกใช้เกมได้ คุณควรจะเห็นว่าภาพเคลื่อนไหวสไปรท์เคลื่อนไหวทันทีที่เกมเริ่มขึ้น

ป้องกันไม่ให้ภาพเคลื่อนไหววนซ้ํา

เลือกไฟล์คลิปภาพเคลื่อนไหว (NumberAnimation.anim) จากโครงการของคุณ

ในตัวตรวจสอบมีช่องทําเครื่องหมายสําหรับ "เวลาวนซ้ํา" ดังนั้นให้ยกเลิกการเลือก

หากคุณรันเกม คุณจะเห็นว่าภาพเคลื่อนไหวหยุดที่ 24 มันมีประสิทธิภาพสําหรับผลกระทบการระเบิดเพียงครั้งเดียว

เปลี่ยนความเร็วของภาพเคลื่อนไหว

เลือกสไปรท์ที่คุณต้องการทําให้เคลื่อนไหวจากลําดับชั้น

จากนั้นเลือกแท็บภาพเคลื่อนไหว ถ้าคุณไม่มีแท็บ ภาพเคลื่อนไหว ให้เลือก หน้าต่าง > ภาพเคลื่อนไหว > ภาพเคลื่อนไหว จากเมนู

มีตัวเลขที่เรียกว่า "ตัวอย่าง" ซึ่งเป็นจํานวนครั้งในการสลับภาพในหนึ่งวินาที ในตัวอย่างนี้ภาพเคลื่อนไหวคือ 24 เฟรมดังนั้นภาพเคลื่อนไหวจะถูกทําซ้ําทุก 2 วินาที

หากคุณลดจํานวนนี้ความเร็วของภาพเคลื่อนไหวจะช้าลงและหากคุณเพิ่มความเร็วจะเพิ่มขึ้น

เกี่ยวกับการตั้งค่าภาพเคลื่อนไหวขั้นสูงอื่นๆ

การตั้งค่าภาพเคลื่อนไหวต่างๆ จะอธิบายแยกกันในเคล็ดลับเฉพาะภาพเคลื่อนไหว การตั้งค่าเหล่านี้ไม่ได้เป็นเอกสิทธิ์ของแอนิเมชั่นสไปรท์ แต่ไม่ได้เป็นเอกสิทธิ์ของ มันเหมือนกับการตั้งค่าภาพเคลื่อนไหวเคลื่อนไหวอื่น ๆ และภาพเคลื่อนไหว 3 มิติ

ในเคล็ดลับนี้เราจะอธิบายวิธีการย้ายจากแผ่นสไปรท์เป็นภาพเคลื่อนไหว