Game Dev: [Unity 2D] สร้างเกมง่ายๆ Tappy Plane ตอนที่ 4 : สร้างแอนิเมชั่นให้เครื่องบิน

เปิดหน้าต่าง Animation

เริ่มแรกเลยมารู้จักกับ Animation Tool กันก่อน ไปที่ Window -> Animation เพื่อเปิดหน้าต่างการทำงานของ Animation ขึ้นมา

จะได้หน้าต่างการทำงานแบบนี้

สร้างแอนิเมชั่นบินให้เครื่องบิน

เราจะมาสร้างแอนิเมชั่นบินให้เครื่องบินกันก่อน ให้ทำการคลิกที่ Game Object Plane ที่เราได้สร้างไว้ในตอนที่แล้วเพื่อทำการเลือก Game Object ที่เราจะทำการสร้างแอนิเมชั่นให้ จากนั้นที่หน้าต่าง Animation ให้คลิกที่ Create เพื่อสร้างแอนนิเมชั่นคลิปขึ้นมา จะมีป๊อปอัพให้เราตั้งชื่อแอนนนิเมชั่นคลิป ในที่นี้ให้ตั้งชื่อว่า Fly

ไปยังที่ที่เซฟแอนิเมชั่นคลิปไว้จะเห็นว่าได้ไฟล์ใหม่มา 2 ไฟล์ คือ Fly แอนนิเมชั่นคลิปที่เราตั้งใจสร้าง และอีกไฟล์หนึ่งคือ Plane ซึ่งจะมีชื่อไฟล์ชื่อเดียวกันกับ Game Object ที่เราลือกจะไว้ว่าจะสร้างแอนนิเมชั่นให้ เนื่องจาก Unity จะออโต้สร้างให้เป็นชื่อเดียวกับ Game Object ซึ่งไฟล์ Plane คือ Animator Controller ส่วน Animator Cotroller คืออะไรจะกล่าวถึงในภายหลัง

เลือกรูปภาพ planeYellow1 planeYellow2 และ planeYellow3 หรือจะเลือกสีอื่นก็ได้ตามใจชอบ

จากนั้นลากทั้ง 3 รูปภาพลงใน แอนิเมชั่นคลิป Fly ที่เราสร้างเมื้อกี้

คลิก

เพื่อเล่นแอนิเมชั่นคลิป

ในหน้าต่าง Scene จะเห็นว่าเครื่องบินมีแอนิเมชั่นบินแล้ว

อะไรคือ Samples

หลังจากที่เราได้ทำการสร้างแอนิเมชั่นกันไป เราจะเห็นได้ว่าเครื่องบินบินเร็วไปนั่นก็เพราะค่าดีฟอลต์ของแอนนิเมชั่นเป็น 60 เฟรมต่อวินาที

วิธีเปลี่ยนค่าดีฟอลต์ให้ไปที่หน้าต่าง Animation ที่ค่า Samples ให้เปลี่ยนค่าจาก 60 เป็น 12 หมายความว่าตอนนี้แอนนิเมชั่นที่เราสร้างจะมีอัตราเฟรมเรท 12 เฟรมต่อวินาที กดรันแอนนิเมชั่นอีกทีเพื่อดูผลลัพธ์

สร้างแอนิเมชั่นตายให้เครื่องบิน

สร้างคลิปใหม่ให้กับ Game Object Plane โดยการคลิกที่ Fly จะมีป๊อปอัพขึ้นมาให้คลิกที่ Create New Clip จะมีป๊อปอัพขึ้นมาให้เลือกที่จัดเก็บและตั้งชื่อแอนิเมชั่นคลิปใหม่ที่เราจะสร้าง ในที่นี้จะตั้งชื่อว่า Die

จะเห็นว่ามีไฟล์แอนิเมชั่นใหม่ที่เราสร้างขึ้นมาในโฟลเดอร์ที่เราเลือกจัดเก็บ

กลับมาที่หน้าต่าง Animation เราจะสร้างแอนนิเมชั่นตายให้กับเครื่องบิน โดยเมื่อเครื่องบินชนเราจะค่อยๆปรับให้สีเครื่องบินจางลงจนถึงระดับหนึ่งเหมือนในรูปภาพ

อย่างแรกเริ่มจากลากภาพ planeYellow3 เข้ามาในหน้าต่างแอนิเมชั่น หลักจากนั้นคลิกที่ปุ่ม Add Property เลือก Sprite Renderer คลิกปุ่มบวกที่ Color

เปลี่ยนค่า Samples เป็น 12 เพื่อปรับค่าเฟรมเรทเป็น 12 เฟรมต่อ 1 วินาที จากนั้นไปที่เฟรมที่ 5 โดยการเปลี่ยนเลขที่อยู่ข้างบนชื่อแอนิเมชั่นจาก 0 เป็น 5

ที่ Plane : Sprite Renderer.Color คลิกลูกศรข้างหน้าเพื่อขยายดูค่าข้างใน จะเห็นว่ามีออพชั่นเกี่ยวกับสี RGB Color.r Color.g และ Color.b ตามลำดับ ส่วน Color.a จะหมายถึง Alpha ในที่นี้เราจะมาปรับ Color.a กัน เพราะเราต้องการให้เครื่องบินจางลง ไม่ได้ต้องการเปลี่ยนสีเครื่องบิน เปลี่ยนค่า Color.a เป็น 0.6

ปรับให้แอนนิเมชั่นเล่นครั้งเดียวแล้วหยุด

โดยปกติดีฟอลต์ของแอนิเมชั่นคือ Loop ตัวอย่างเช่นแอนิเมชั่นบินที่เราสร้างไปก่อนหน้านี้จะเห็นได้ว่าแอนิเมชั่นจะเล่นวนลูปไปเรื่อยๆไม่มีสิ้นสุด แต่ในแอนิเมชั่นตายเราต้องการให้แอนิเมชั่นเล่นครั้งเดียวไม่ต้องเล่นซ้ำ สามารถทำได้ดังนี้

ไปที่ที่จัดเก็บแอนิเมชั่นตายที่เราทำการสร้างไว้ก่อนหน้านี้ คลิกที่แอนิเมชั่น ทางด้านขวาที่หน้าต่าง Inspector ให้ติ๊ก Loop Time ออก เราก็จะได้แอนิเมชั่นที่เล่นครั้งเดียวแล้วหยุดอย่างที่ต้องการ