มาทำ Interaction Animation Unity กันเถอะ!! by

30
Jun
0

คราวนี้เราจะมาทำ Animation ที่ Interaction กับแผงควบคุมอย่าง Keyboard อย่างง่ายๆ กัน โดยคราวนี้เราจะใช้แต่ฟังก์ชั่นของ Unity เองล้วนๆ

ก่อนอื่น เริ่มจากหา Sprite Sheet ที่แจกให้ว่อนกันในเนตก่อนเลย~

1

เค้าไปเจอ Rockman X มาแหละ หุหุหุ

ต่อไป สร้าง GameObject ขึ้นมาตัวนึง เพื่อที่จะรับหน้าที่เป็น Rockman ของเรา จากนั้นเลือกที่ Sprite Sheet ที่จะใช้ มองหาเมนูทางขวามือที่เขียนว่า Sprite Mode โดยเจ้าตัวนี้แหละ จะเอาไว้เปลี่ยนให้กลายเป็น Sprite ชิ้นเล็กๆ ได้

2

 

จากนั้นกดปุ่ม Sprite Editor แถวๆ นั้น เพื่อที่จะเริ่มตัด Sprite กัน โดยที่แบ่งได้ 2 แบ คือ Automatic และแบบ Grid ซึ่ง Rockman ของเรานั้นจะใช้แบบ Automatic เพราะเรียงขนาด Grid ไม่ได้แบบที่ต้องการ ซึ่งผลก็ออกมาดูดีใช้ได้

4

ทีนี้ มาเริ่มที่ Animation กันเลย!! คลิกที่ตัว GameObject Rockman ของเรา แล้วเปิดหน้าต่าง Animation ขึ้นมา (ถ้าไม่มีให้เปิดจาก Window—->Animation) จากนั้นคลิกตรงปุ่ม Add Curve ตรงด้านซ้าย เพื่อสร้างไฟล์ .anim ที่จะใช้เล่น Animation โดยเราจะใช้ชื่อว่า rockman_idle เป็นตอนที่ยืนเฉยๆ แล้วกะพริบตานั่นเอง จากนั้นลากไปใส่ตำแหน่งตามภาพเลย~

5

6

 

 

7

 

ต่อไปเราจะมาทำ Animation ตอนวิ่งกัน ทำเหมือนขั้นตอนที่แล้ว แต่คราวนี้เราจะถึง Sprite มาทั้งแถบ เพราะแต่ละชิ้นคือ Sprite ในแต่ละ Frame นั่นเอง

8

 

เสร็จจาก Animation แล้ว เราจะไปวุ่นวายกับ Animator ซึ่งเป็นตัว Control Animation กัน เริ่มจากสร้างตัวแปรควบคุม state ของ Animation ตัวนี้ก่อนตามรูปเลย หลักการคือ เมื่อ run = 1 Rockman จะวิ่งนั่นเอง

9

 

เสร็จแล้วก็คลิกขวาเพื่อลากเส้น Transition ตามภาพ โดยตั้ง Condition เอาไว้ด้วย (run = 1 Rockman วิ่ง/ run = 0 Rockman หยุดและ idle)

10

11

 

เสร็จแล้ว ให้สร้าง Script เอาไว้รับค่าจาก Keyboard ติดเอาไว้ที่ตัว Rockman ได้เลย! โดยโค้ดตามภาพข้างล่าง
(ใช้ GetKeyDown() เพื่อตรวจจับเวลา Hold Right Button เอาไว้ และใช้ GetKey เพื่อ Detect เวลาที่ไม่ได้กด)

12

 

เสร็จแล้วลองกด Play แล้วจิ้มปุ่มลูกศรขวามือค้างไว้ดูสิ!! Rockman ก็จะวิ่งได้แล้ว!! เย้!! สามารถประยุกต์ใช้ต่อไปได้เพื่อทำเกมเต็มตัวนะจ๊ะ :3

13

 

Enjoy this article?

Consider subscribing to our RSS feed!

ไม่มีความเห็น

ยังไม่มีความเห็น

ใส่ความเห็น

RSS feed for comments on this post