Construct 2 : ทำระบบ Register และ Login ด้วย Firebase (ตอนจบ)

วันนี้เราจะมาเรียนรู้พื้นฐานการนำข้อมูลไปเก็บบันทึกบน  Firebase Realtime Database กันนะครับ ปัจจัยสำคัญในการสร้างงานในครั้งนี้ คือ plugin Firebase 3 ตัวนี้ครับ

โดยท่านสามารถดาวน์โหลดได้ที่ https://c2rexplugins.weebly.com/map.html เมื่อดาวน์โหลดเสร็จเรียบร้อยให้ทำการติดตั้งปลั๊กอินลงใน Construct 2 ที่ C:\Program Files\Construct 2\exporters\html5\plugins\ สำหรับวินโดวน์ 64 บิต ส่วนวินโดวน์ 32 บิตติดตั้งที่ C:\Program Files(86)\Construct 2\exporters\html5\plugins\

1. เปิดโปรแกรม Construct 2

2. เปิดโปรเจ็กต์ใหม่ขึ้นมา

3. นำเข้าวัตถุ (Objects) ต่างๆ ดังนี้

4. จัดวางลงบนเลย์เอาต์ดังรูป

5. คลิกที่ FirebaseAPIV3 คัดลอกรายละเอียดข้อมูลต่างๆ ของ Database วางลงในช่อง Properties ของ  FirebaseAPIV3 ดังรูป

6. เปิด Event Sheet ขึ้นมา

  • สร้างตัวแปร ประเภท Text  จำนวน 2 ตัวแปร ดังรูป

  • ตั้งค่าเริ่มต้นให้ TextAlert และ Firebase

  • Event Sheet Register เมื่อคลิกปุ่ม RegisterBtn จะนำค่าจากกล่องข้อความไปเก็บไว้ใน อาร์เรย์ และนำค่าจากอาร์เรย์บันทึกไว้ในฐานข้อมูล

  • เมื่อบันทึกข้อมูลสำเร็จ (savedata) จะทำการตั้งค่า กล่องข้อความเป็นว่าง และล้างอาร์เรย์

  • Event Sheet Login เมื่อคลิกปุ่ม Submit (loginBtn) จะนำค่าจากกล่องข้อความไปเก็บไว้ในตัวแปร username และ password

  • เมื่อโหลดข้อมูล (datauser) สำเร็จ จะนำข้อมูลจาก Database เก็บไว้ในอาร์เรย์ และตรวจสอบ ชื่อผู้ใช้และรหัสผ่านตรงกับฐานข้อมูลหรือไม่ ถ้าตรงกันให้เปิดเลย์เอาต์ game ถ้าไม่ตรงกันให้แสดงข้อความเตือน

ตัวอย่าง https://semicon.github.io/member/

ตัวอย่าง capx+plugin

เป็นอันเสร็จเรียบร้อยครับ

แล้วพบกันใหม่ในบทความหน้า

สวัสดีครับ