Construct 2 : จับเวลานับถอยหลังแบบแสดง ชั่วโมง นาที และวินาที (Count Down)

มีเพื่อนสมาชิกถามมาว่าต้องการให้เวลานับถอยหลังแสดงเป็น MM : SS มีวิธีการทำอย่างไร วันนี้เราจะมาเรียนรู้การทำนาฬิกาจับเวลากันครับ โดยมีรูปแบบการแสดงผลเป็น HH:MM:SS เรามาเริ่มกันเลยครับ

1. เปิดโปรเจ็คใหม่ ตั้งขนาดของวินโดว์และเลย์เอาท์ตามต้องการ

2. เปลี่ยนชื่อ Layout 1 เป็น setTime และเพิ่ม Layout ใหม่อีกหนึ่ง ชื่อ countDown โดยให้ทั้งสองเชื่อมโยงกับ Event Sheet 1

3. ที่ Layout  setTime  เพิ่มออบเจ็ค ดังนี้

  • Text
  • Text Box
  • Button

โดยตั้งชื่อและจัดวางตำแหน่งให้เหมาะสม ดังรูปด้านล่าง

p1

4. ที่ Layout  countDown  เพิ่มออบเจ็ค Text ตั้งชื่อ TimerText ตั้งค่า ขนาดของตัวอักษรให้เหมาะสมสวยงามp2

5. เปิดแท็ป Event Sheet 1 ขึ้นมา เพิ่มตัวแปร Global ดังนี้

  • ตัวแปร Text ชื่อ sec ตั้งค่าเป็นว่าง สำหรับเก็บค่าของวินาที
  • ตัวแปร Text ชื่อ mins ตั้งค่าเป็นว่าง สำหรับเก็บค่าของนาที
  • ตัวแปร Text ชื่อ hrs ตั้งค่าเป็นว่าง สำหรับเก็บค่าของชั่วโมง
  • ตัวแปร Number ชื่อ timer ตั้งค่าเป็น 0 สำหรับเก็บค่าของชั่วโมง

6. ตั้งค่าเบื้องต้นของ TextBoxHrs TextBoxMins TextBoxSec และ TitleText ขณะเมื่อเริ่มต้นเลย์เอาท์

evt1

7. กำหนดให้ทุกๆ 1 วินาที Timer ลดลง 1 และทำการคำนวนเวลาโดยใช้วิธีหารเอาเศษ (modulus operator, %60)

  • hrs = int(timer/60/60%60)
  • mins = int(timer/60%60)
  • sec =  int(timer%60)

evt2

8. คลิกปุ่ม OK เพื่อตั้งค่าเวลา (timer) และเริ่มต้นนับถอยหลังในหน้า countDown

evt3

หวังเป็นอย่างยิ่งว่าบทความนี้จะเป็นประโยชน์ในการนำไปประยุกต์ใช้ไม่มากก็น้อย ขอให้ทุกท่านมีความสุขและสนุกกับการสร้างเกม และ App เพื่อการศึกษานะครับ

Demo >> http://chambermaid-tom-58583.bitballoon.com/

Download capx file >> https://drive.google.com/file/d/0BxYLwl-Us18KQTJ6VG9vd3FRZUk/view?usp=sharing