เกมเปายิงฉุบ : construct2

สำหรับช่วงปิดเทอม น้องๆ หยุดพักสมองจากการสอบปลายภาค อาจจะลองมาสนใจโปรแกรม construct2 ในการทำเกมสนุกๆ วันนี้ผมเลยขอนำเสนอเกมง่ายๆ คือ เกมเป่ายิงฉุบ ที่ทุกคนรู้จักวิธีการเล่นเป็นอย่างดี หลักการก็ง่ายๆ มีผู้เล่น 2 คน แต่ละคนก็สุ่มออกเครื่องหมาย คือ ค้อน กรรไกร กระดาษ ถ้าฝ่ายหนึ่งออกค้อน อีกฝ่ายออกกรรไกร ฝ่ายที่ออกค้อนจะชนะกรรไกร กรรไกรชนะกระดาษ และกระดาษชนะค้อน  เกมง่ายๆ แบบนี้ เรามาลองสร้างเกมให้เล่นกับคอมพิวเตอร์ดูกันดีกว่า
แนวคิดในการสร้างเกม คือ มีผู้เล่น 2 ฝ่าย ฝ่ายหนึ่งคือคนเล่น อีกฝ่ายคือคอมพิวเตอร์ โดยผู้เล่นจะเลือกว่าจะออกอะไร ระหว่าง ค้อน กรรไกร กระดาษ และคอมพิวเตอร์จะสุ่มว่าจะออกกรรไกร ค้อน หรือกระดาษ เมื่อกดปุ่มต่อสู้ จะตรวจสอบว่าระหว่างคอมพิวเตอร์กับผู้เล่นใครเป็นฝ่ายชนะ



เตรียมตัวก่อนสร้างเกม
ให้ download ภาพประกอบที่ใช้ในเกมจาก link ภาพที่ใช้ในเกม


ลงมือสร้างเกมกัน
ขั้นแรกสร้างไฟล์ construct2 โดยกำหนดขนาด window เป็น  1000 x 600

แล้วเพิ่มภาพโลโก้เกมเข้ามาดังภาพ

คลิกขวา เลือก Insert new object (1) เลือก Sprite (2) แล้วกดปุ่ม Insert (3) จะได้หน้าต่างสำหรับเพิ่มภาพเข้ามาในเกม คลิกที่ปุ่มเปิด (4) แล้วเลือกภาพโลโก้เกม

จัดวางตำแหน่งให้สวยงาม

ขั้นที่ 2 สร้างปุ่มสำหรับเลือกสัญลักษณ์ที่จะเล่น สำหรับผู้เล่น โดยเมื่อคลิกที่ปุ่ม ภาพจะเปลี่ยนไปเรื่อยๆ จากค้อน เป็นกรรไกร และ กระดาษ โดยคลิกขวาเพิ่ม Sprite เข้ามาในเกม ตามขั้นตอนที่ผ่านมา ตั้งชื่อว่า hand1 แล้วเลือกภาพกำมือ แทนค้อน (1) แล้วคลิกขวาที่ Animation frames เลือก Add frame (2)

เลือกภาพ กรรไกร และกระดาษ ตามลำดับ

กำหนดการเปลี่ยนลำดับภาพ speed เป็น 0  และ Loop เป็น No

จัดวางตำแหน่งไว้ด้านขวาของจอภาพ

เพิ่ม new object ชื่อ Touch เข้ามาในเกม ใช้สำหรับรับเหตุการณ์กดวัตถุต่างๆ ในเกม

คลิกที่ Event sheet แล้วเพิ่มตัวแปร global variable ชื่อ hand1_state

กำหนดเหตุการณ์สำหรับการคลิกที่ปุ่มภาพ hand1 ดังนี้
คลิกขวา ที่ event sheet เลือก Touch แล้วคลิก Next เลือก On tap object คลิก Next
เลือก Object ชื่อ hand1 แล้วคลิก Done

กำหนดเหตุการณ์เมื่อเกิดการคลิกที่ภาพมือ ดังนี้
1. เพิ่มค่าให้ตัวแปร hand1_state (บรรทัดที่ 1)
2. ตรวจสอบค่า hand1_state ถ้ามากกว่า 2 คือมากกว่าหมายเลขเฟรมที่มี ให้เริ่มใหม่เป็น 0
โดยตรวจสอบ ถ้า hand1_state > 2 กำหนด hand1_state = 0 (บรรทัดที่ 2)
3. เพิ่ม blank sub event ใส่เหตุการณ์ให้แสดงภาพในเฟรมที่ตรงกับค่าของ hand1_state

ทดสอบโปรแกรมเกม เมื่อเราคลิกที่ปุ่มภาพ ภาพจะเปลี่ยนวนไปเรื่อยๆ จากค้อน เป็นกรรไกร และกระดาษ

ขั้นตอนที่ 3 สร้างปุ่มการเลือกสัญลักษณ์ สำหรับฝ่ายคอมพิวเตอร์ โดย คลิกขวาที่หน้าต่าง Object ตรงวัตถุ hand1 แล้วเลือกคำสั่ง Clone จะได้วัตถุชื่อ hand2

ดับเบิลคลิกที่วัตถุ hand2 จะเปิดหน้าต่างแก้ไขวัตถุขึ้นมา กดปุ่ม Shift ค้างไว้แล้วคลิกปุ่ม mirror เพื่อพลิกภาพในทุกเฟรมให้หมุนไปอีกด้าน

ลากวัตถุ hand2 มาวางในฉากเกม จัดตำแหน่งให้สวยงาม

เพิ่ม spite เข้ามาในฉากเกม คือภาพของผู้เล่นแต่ละฝ่าย และ spite ของปุ่มที่จะกดให้สุ่มภาพสัญลักษณ์ของฝ่ายคอมพิวเตอร์ และตัดสินผลการแข่งขันเกม โดยกำหนดชื่อปุ่มว่า play ดังภาพ

กำหนดเหตุการณ์ เมื่อกดปุ่ม เป่ายิงฉุบ
1. กำหนดตัวแปร global variable ชื่อ hand2_state
2. เพิ่ม spite เข้ามาในเกม ชื่อ play_state โดยกำหนดให้มีเฟรมภาพ 4 เฟรม โดยเฟรมแรกให้เป็นภาพว่างๆ ดังนี้

3. กำหนดเหตุการณ์เมื่อคลิกปุ่ม play ให้สุ่มค่า ตั้งแต่ 0 - 2 ด้วยคำสั่ง random(3)
ไปเก็บไว้ที่ตัวแปร hand2_state แล้วแสดงภาพของเฟรม hand2 ตามค่าที่สุ่มได้




ตรวจสอบการแพ้ชนะ
กำหนด event สำหรับตรวจสอบผลการเล่น ดังนี้

เมื่อทดสอบเล่นเกม ก็จะได้เกมเป่ายิงฉุบ ที่สามารถบอกผลแพ้ชนะได้

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

:::download file game Rock-paper-scissors.capx :::