Construct 2 : ทำเมนูเลือกด่าน (Level selector) ด้วย Localstorage

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

1. เริ่มต้น โดยการสร้างโปรเจ็คใหม่ขึ้น

  • กำหนดขนาดของ Layout ตามความต้องการ
  • เพิ่ม Sprite ภาพพื้นหลัง
  • เพิ่ม Sprite ปุ่มเมนู ตั้งชื่อ BtnMenu
  • เพิ่มรูปภาพใน BtnMenu จำนวน 3 เฟรม ดังรูป

1

  • Sprite BtnMenu ตั้งค่า animation speed = 0

2. เพิ่มตัวแปรให้กับ BtnMenu ดังนี้

  • levelMenu เป็นตัวแปรชนิด Number ค่าเริ่มต้น Initial value = 0
  • buttonOn  เป็นตัวแปรชนิด Boolean  ค่าเริ่มต้น Initial value = false

02

3. นำ BtnMenu มาวางใน Layout ตามรูป และตั้งค่า levelMenu ของแต่ละปุ่ม เป็น 1, 2, 3, 4, 5 … ตามลำดับไปเรื่อยๆ จนถึงปุ่มสุดท้าย ในตัวอย่างนี้ คือ 10

2

4. เพิ่ม Local storage และ Touch

5

6

5. เปิด Event Sheet ของ Menu Selector ขึ้นมา

  • เพิ่มตัวแปร Global Variable
    • ชื่อ Level  ชนิด Number ตั้งค่าเริ่มต้น 1
    • ชื่อ currentLevel  ชนิด Number ตั้งค่าเริ่มต้น 1
  • กำหนดการดำเนินการ Local storage item = “KeyCurrentLevel”
    • เหตุการณ์ที่ 1 ในการเริ่มต้นของ layout จะตรวจสอบ key ว่ามีอยู่หรือไม่
    • เหตุการณ์ที่ 2 ถ้ามีอยู่ก็จะมีการเรียกเก็บจาก Local Storage ผ่าน ‘Get Item’
    • เหตุการณ์ที่ 3 ปรับปรุงค่าตัวแปร “currentLevel” เป็นค่าที่บันทึกไว้ใน Local Storage
    • เหตุการณ์ที่ 4 ถ้า Key ไม่มีอยู่มันจะถูกสร้างขึ้นด้วย ‘Set Item’ กับค่าปัจจุบันของ currentLevel นี้ (ตัวแปร)

event1

  • กำหนดให้ปุ่มแสดงค่าว่าผ่านด่านนั้นแล้ว สามารถเข้าเล่นซ้ำได้

event5

  • กำหนดให้ปุ่มแสดงค่าการปลดล็อคปุ่ม เพื่อให้เข้าเล่นได้

event6

  • กำหนดค่าการคลิกหรือแตะปุ่มในการเข้าเล่นเกมในด่านต่างๆ

event7

6. เพิ่มเหตุการณ์ด้านล่างนี้ลงในเงื่อนไขการผ่านด่านในหน้า Event Sheet ของเกม เพื่อบันทึกค่าด่านสูงสุดที่ชนะลงใน Local storage เมื่อผ่านด่าน

  • ถ้า Level มากกว่าค่าที่บันทึกไว้ ให้แทนค่า Level ลงใน currentLevel และ currentLevel ลงใน KeyCurrentLevel

eventgame