The words you are searching are inside this book. To get more targeted content, please make full-text search by clicking here.

คู่มือการสร้างเกมด้วยโปรแกรม Construct 2

Discover the best professional documents and content resources in AnyFlip Document Base.
Search
Published by natthaphon.kha, 2022-11-22 02:48:49

คู่มือการสร้างเกมด้วยโปรแกรม Construct 2

คู่มือการสร้างเกมด้วยโปรแกรม Construct 2

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภิวัฒน์ วงศก์ ัณหา หน้า 1

การสรา้ งเกมดว้ ยโปรแกรม Construct 2

ขน้ั ตอนการสร้างเกม (The Steps)

ข้นั ท่ี 1 สรา้ งโปรเจกต์ใหม่ (Create a New Project)

ขั้นท่ี 2 ต้ังค่า Layout

2.1 เปล่ยี นชื่อ Layout และ กาหนดขนาดของ Layout (Change the Layout Name and Size)
ดงั นี้
1. Click ทว่ี ่างบน Layout
2. ใน Layout Properties ตรงชอ่ ง Name ใหเ้ ปล่ยี นชือ่ จาก Layout 1 เป็นชื่อวา่ Battle
Ground
3. ตรง Layout Size ใหเ้ ปล่ยี นค่าเดิมจาก 1708, 960 เป็น 10000, 2000 ซึ่งจะมีหน่วยวดั เป็น
pixel

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภิวัฒน์ วงศ์กณั หา หน้า 2

2.2 การทาภาพพน้ื หลังของเกม (Set the Background Image)
1. ให้ Double click บริเวณพืน้ ที่ว่างๆ บน Layout จะมีหน้าตา่ ง The Insert New Object
Dialog เป็น pop up โผลข่ ้นึ มา

2. Double click รูป ท่ีชื่อว่า Tiled Background Object.

3. เคอรเ์ ซอรเ์ มาสข์ องเราจะกลายเปน็ รปู เครื่องหมายบวก

จากนนั้ ให้ Click ลงไปบนพ้นื ท่วี า่ งของ Layout
4. จะปรากฏหนา้ ตา่ งแก้ไขรปู ภาพขน้ึ มา

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภวิ ฒั น์ วงศก์ ณั หา หนา้ 3

5. ให้ Click ท่ปี มุ่ Folder
6. ไปเปดิ เอารูปภาพพืน้ หลังท่เี ราเตรียมไว้แล้วกดปมุ่ ปดิ หนา้ ต่างนี้ไป

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ัฒน์ วงศก์ ัณหา หน้า 4

7. เราจะเหน็ รูปพืน้ หลังปรากฏบน Layout กดปุ่ม CTRL + หมนุ ป่มุ กลางเมาส์ เพอื่ ซูมภาพเข้าออก

ใหเ้ ห็นขนาดภาพท่งี า่ ยในการทางาน

8. Click ทีร่ ปู พื้นหลัง จากน้นั ไปกาหนดตาแหน่ง Position 0,0 และ Size ขนาด 10000,2000

9. กดปมุ่ CTRL + 0 เพื่อปรับขนาดเปน็ 100%
2.3 จัดการเลเยอร์ (Set the Layers)

1. Clickที่ Layers Tab
2. Clickท่ี Layer 0 ซึ่งเราจะใชเ้ ลเยอรน์ ีเ้ ป็นเลเยอร์ใส่ฉากหลัง
3. Clickทรี่ ูปกุญแจ เพื่อล็อคเลเยอรพ์ ้นื หลงั น้ีไว้

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภวิ ัฒน์ วงศก์ ัณหา หนา้ 5

จากนน้ั ใหท้ าการเปลยี่ นชือ่ เลเยอร์
1. Clickที่รปู ดนิ สอ
2. เปลี่ยนชื่อจาก Layer 0 เปน็ ช่อื ว่า
Background

ให้ทาการเพ่มิ เลเยอรโ์ ดยการกดปุ่มเคร่ืองหมายบวก +

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภิวฒั น์ วงศ์กณั หา หนา้ 6

หลังจากน้นั ให้เปลี่ยนชือ่ เลเยอร์ดา้ นบน ชื่อว่า Main

ข้ันท่ี 3 ตงั้ ค่าขนาดงาน (Change the Window Size)

Window size คือขนาดหนา้ จอที่ใช้แสดงผล ให้ทาการ
เปลย่ี นขนาดหน้าจอดังนี้
1. ในหน้าต่าง Project ให้Clickท่ี New project

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรียงโดย..นายอภวิ ฒั น์ วงศ์กณั หา หน้า 7

2. ในหนา้ ต่าง Properties ตรงชอ่ ง Window Size ให้
เปลย่ี นค่าตัวเลขเป็น 2000,1024

ขน้ั ที่ 4 แทรก Object ต่างๆ ในเกม (Insert The Objects)
จากท่ีเราได้รวู้ ิธแี ทรก Object มาแล้วในการแทรกพนื้ หลงั แบบ tiled background ทีนี้กใ็ หใ้ ช้วิธเี ดยี วกันใน

การแทรกวัตถตุ วั อนื่ ๆเพิม่ เข้า Object ทีใ่ หเ้ พ่ิมเขา้ มาอกี ได้แก่
1. แทรก Object เมาส์ เพ่อื ใช้ Click เมาส์ในการยิง
2. แทรก Object แป้นพมิ พ์ เพ่ือใช้สาหรับการควบคุมการเคล่ือนท่ีของตวั Player ดว้ ยปุม่ AWSD
3. แทรก Object แบบ Sprite เชน่ ตัว Player ตวั ศตั รู ระเบิด กระสนุ เลือด เวลา

ซ่ึงการแทรก Object นอกจากจะใช้วิธกี ารที่กลา่ วมาข้างต้นแลว้ เรายงั สามารถแทรก Object ไดอ้ กี วิธหี น่ึง
คอื การเปดิ ไฟล์รูปจากทีเ่ กบ็ ในเครื่องคอมพิวเตอร์ แล้วจับลากมาวางใสใ่ น Layout เลยกไ็ ด้ ทั้งแบบมภี าพเดยี ว หรอื
ไฟล์ภาพท่มี ีเปน็ ภาพชุดตอ่ เนื่อง

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภิวัฒน์ วงศ์กัณหา หนา้ 8

การนาภาพเขา้ มาใน Layout จากท่เี ก็บไฟล์แบบมภี าพเดียว

หรือ นาเขา้ แบบเปน็ ภาพชดุ ต่อเนื่องหลายภาพ

ซ่งึ เมือ่ เรา Double Click ดูจะเห็นภาพมีลักษณะเป็นภาพตอ่ เนื่อง

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภิวัฒน์ วงศ์กณั หา หนา้ 9

ขัน้ ท่ี 5 เปลี่ยนชื่อของ Sprite ทเี่ รานาเขา้ มา (Rename the Sprites)

ใหท้ าการเปล่ียนชือ่ sprites แตล่ ะตัวใหเ้ ป็นชอ่ื Player, Enemy, Blood, Blast1, Blast2, Bullet1,

Bullet2 ตามลาดบั โดยการClickทต่ี ัว sprite แล้วไปทาการเปลยี่ นช่อื ตรงที่ Properties Bar

ชือ่ ความหมาย
ตัวผู้เล่น หรอื ตวั Player
Player ตัวศัตรู
Enemy ระเบิดตรงปลายกระบอกปนื ของ Player เม่อื ยิงปืน
Blast1 ระเบดิ ตรงปลายกระบอกปนื ของตัวศัตรู เมอ่ื ยิงปืน
Blast2 กระสนุ ทยี่ ิงออกจากปลายปนื ของ Player
Bullet1 กระสนุ ท่ยี งิ ออกจากปลายปืนของตวั ศัตรู
Bullet2 เลือดกระจาย เมื่อตัวศตั รโู ดนกระสนุ ปนื
Blood

ขนั้ ที่ 6 ปรับแต่งคา่ Object ให้มีประสิทธภิ าพ (Efficiency)

จัดการตัว Sprite ที่ชื่อว่า Bullet2 ดงั นี้
1. Double click ทต่ี วั Bullet2
2. Clickทป่ี ุ่ม ครอบตัด หรือ Crop
ส่วนตวั Sprite ทเี่ ป็นแบบ animation อย่างเช่นตวั Blood น้ัน ใหก้ ดปุม่ Shift ค้างไว้ก่อน แล้วจงึ กดปุ่ม

Crop เพื่อให้มผี ลกบั ภาพทุกๆเฟรม

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ฒั น์ วงศก์ ัณหา หนา้ 10

ขั้นท่ี 7 การควบคมุ การเคลือ่ นทข่ี องตัว Player (Control the Player Movement)

1. Click ท่ีตัว Player แลว้ ไป Click ท่ี Behaviors
2. Click ท่ปี มุ่ +
3. Double click ทต่ี ัว 8 Direction

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภิวฒั น์ วงศก์ ณั หา หน้า 11

จากน้ันให้เพิ่ม Behaviors อีก 2 ตัว ได้แก่ Scroll to กับ Bound to Layout

แลว้ ทาการทดสอบการทางาน โดยการกดปุ่ม Run layout

ทาการปรบั ตัว Player ใหอ้ ยูใ่ นแนวนอน โดยการ Double click ทีต่ วั Player จะเห็นจดุ และเส้นสนี า้ เงินตรงกลาง
ภาพ ซง่ึ จะแสดงเป็นมมุ 0 องศา

ซง่ึ เราจะต้องทาการหมุนตวั Player โดยการ Click ท่ปี ุ่ม หมุนตามเข็มนาฬิกา ให้ตวั Player หมุนไปทศิ ทางตามภาพ

และให้ไปทาการหมุนภาพของตวั เลือดท่ีชอื่ ว่า Blood แบบน้ีด้วยเช่นกัน
เมอ่ื เราทดสอบการเคล่ือนทขี่ องตวั Player ตอนนีจ้ ะเหน็ ว่าเคล่ือนท่ีชา้ เราจงึ ต้องมาปรับความเรว็ ในการเคลอ่ื นทเี่ สีย
ใหม่ โดยไปปรับท่ีคา่ Properties ของ 8 Direction behavior ใหเ้ ป็น

Max speed 800, Acceleration 2000,Deceletion 4000

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภิวฒั น์ วงศก์ ัณหา หน้า 12

เร่ิมกาหนด Event เพื่อควบคุมการทางานปุ่ม AWSD จากการกดปุ่มแป้นพมิ พ์ ดังนี้
1. Clickไปทแ่ี ทป็ Event sheet แล้ว Double click ท่วี ่างของ Event sheet แลว้ Double click ท่ปี ุ่มรูปแปน้ พิมพ์

2. Double click ทปี่ มุ่ Key is Down
3. Clickที่ <click to choose>
4. กดปุ่ม W ท่ีแป้นพิมพ์ 1 ครง้ั
5. Clickทีป่ มุ่ OK
6. Clickท่ปี ่มุ done

เมื่อกาหนดเสร็จแลว้ จะเหน็ ภาพ ดงั น้ี

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรียงโดย..นายอภวิ ัฒน์ วงศก์ ัณหา หน้า 13

จากนน้ั มากาหนด Action ดงั น้ี
1. Clickท่ี Add action
2. Double click ที่ Player
3. Double click ท่ี Simulate control
4. เลือกเป็น Up
5. Clickปุ่ม Done

เราทา Action ใหป้ มุ่ W เสรจ็ เรียบร้อยแลว้ จากนั้นใหท้ าแบบเดียวกนั กับปุ่ม A, S, D ให้ครบทกุ ปุ่ม
1. A  Left
2. S  Down
3. D  Right

จากนน้ั ให้ทดสอบการทางานโดยการกดปุ่ม F5 ทแ่ี ปน้ พมิ พ์

ขั้นที่ 8 กาหนดจดุ ชไี้ ปตามตาแหน่งของเมาส์ ( Point the Player Towards the Mouse’s Position)

ขัน้ ที่ 9 กาหนดจุดหมุนของตัว Player เมอ่ื เคล่อื นเมาส์ (Fix the Pivot Point)
1. Double click ที่ตัว Player

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภิวฒั น์ วงศก์ ัณหา หนา้ 14

2. Clickท่ีปุ่ม set origin and image points จะมองเห็นจุดเลก็ ๆ ตรงกลางภาพ

3. Clickเมาส์ท่ตี รงหวั ของ Player เพื่อใหจ้ ุดหมนุ อย่ตู รงกลางหัวของ Player

4. Clickปิดหน้าต่างแก้ไขภาพน้ี

ขัน้ ท่ี 10 การยงิ ( How to Shoot)
แนวคดิ ในการทาเอเฟกในการยงิ เมื่อ Click ปุ่มซ้ายเมาส์จะมรี ะเบดิ และกระสุนยิงออกจากปลายกระบอก

ปืน หลังจากน้นั ระเบดิ จะจางหายไป สว่ นตัวกระสุนจะวงิ่ ออกไป ถ้ากระสนุ วิ่งออกนอกจอไปแล้ว ก็ให้ทาลายตวั มนั
เองไป แตถ่ ้าลกู กระสนุ ไปโดนศัตรูกใ็ ห้ลบกระสุนออกไปและใหเ้ กิดเลือดกระจาย

10.1 ใส่ Behaviors ใหก้ บั Object
กาหนดใหก้ บั ตวั ลูกกระสุน Bullet1 กับ Bullet2
1. โดยการใส่ Behaviors แบบ Bullet และกาหนด speed 3000

2. ใส่ Behaviors แบบ Destroy outside layout เพ่ือลบกระสุนเมื่อพน้ ออกจากหน้าจอ

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภวิ ฒั น์ วงศ์กัณหา หน้า 15

หลงั จากนัน้ ตัวระเบิด Blast1และ Blast2 ให่ใส่ Behaviors แบบ Fade
กาหนดเวลาในการเฟด 0.03 วนิ าที

สดุ ทา้ ยกาหนด Behaviors ให้ตัวเลือด Blood แบบ Fade เชน่ เดยี วกนั กาหนดเวลา
ในการเฟด 2 วินาที

และกาหนด Behaviors ใหก้ ับตัว Timer เป็นแบบ Timer

10.2 กาหนดจุด Image Point และ Origin Point
เพ่ือใหเ้ วลายิงแล้วกระสุนออกตรงปลายปืน เราจงึ ต้องมากาหนดจุด Image point เพิ่มเขา้ ไป ดังนี้
1. Double click ทีต่ วั Player
2. Click ปุ่ม Image Point และ Origin Point
3. Click เครอ่ื งหมาย +
4. Click ตรงปลายกระบอกปืน เพอื่ ให้ Image Point อยู่ ณ ตาแหน่งปลายกระบอกปนื น้ี

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ฒั น์ วงศ์กณั หา หน้า 16

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

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ฒั น์ วงศก์ ัณหา หน้า 17

10.3 กาหนด Event
ทาการเพ่ิม Event การคลกิ เมาส์ ดังน้ี

ขอ้ สังเกตคือ ให้กาหนด Layer 1 เพราะว่า Layer 0 เป็น Background
เม่อื ทดสอบเกมแล้วทดสอบยิง จะปรากฏภาพแบบน้ี

ซงึ่ ยงั ไมส่ มบรู ณ์ในการยิง ดงั นน้ั เราจึงตอ้ งมากาหนดคา่ Instance Variable เพม่ิ เข้าไป
1. Click ท่ีตัว Player
2. Click ที่ Instance Variable
3. Click เครอ่ื งหมาย +
4. พิมพ์ name: fire_ready กาหนด type: Boolean และ initial value: true.
5. Click ปุ่ม OK

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ฒั น์ วงศ์กณั หา หน้า 18

แล้วให้ทาการเพ่มิ เงื่อนไขท่ี 2 ลงไปในการคลกิ เมาส์ ดงั ภาพ

โดยมีข้นั ตอน ดงั น้ี
1. Double click ตรงชอ่ งใต้ Event เมาส์
2. Double click ท่ี player จะมี dialog box ปรากฏขึน้ มา
3. พมิ พค์ าวา่ “boo” ตรงบริเวณกลอ่ งคน้ หทเ่ี ปน็ รูปแว่นขยาย
4. Double click ที่ boolean instance variable set จะมี dialog box ปรากฏขึ้นมา
5. เลือก fire_ready.
6. Click ทปี่ มุ่ done

จากนั้นเพ่ิม Action เข้าไป ดังภาพ
ซง่ึ Toggle นจ้ี ะเปน็ การสลบั ค่าระหวา่ ง True กับ False

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ัฒน์ วงศ์กัณหา หนา้ 19

ขน้ั ที่ 11 กาหนด Event เม่ือเกิดการชน (Set a Collision Event)

กาหนดขัน้ ตอน ดงั นี้
Condition: Bullet 1 | on collision with another object > Object: Enemy
Action: Enemy | Destroy
Bullet1 | Destroy

ขน้ั ท่ี 12 กาหนดคา่ ใหก้ ับตวั ศัตรู (Make your Enemy Stronger)
ปกติเม่ือตัวศัตรโู ดนลูกกระสุนยงิ ถูกเพยี งนดั เดยี วก็ตาย เราจะมากาหนดค่าให้มันตายยากขนึ้
12.1 เพม่ิ Instance Variables 2 คา่ คือ
1. Instance Variables ตวั ศัตรู name: health, type: number, initial value: 100
2. Instance Variables ตวั Bullet1 name: power, type: number, initial value: 10
ซ่งึ เราตอ้ งการให้ศัตรูเวลาโดนกระสุนแต่ละนดั แล้ว ให้ค่าพลงั ศัตรลู ดลงทลี ะ 10
12.2 ทาการแกไ้ ขคา่ เมอ่ื กระสุนชนกับตวั ศตั รู ใหเ้ ป็นดงั ภาพ

12.3 กาหนดคา่ การตายไปของตวั ศัตรู (Destroy the Enemy)

ดังน้ี
Condition: Enemy | Compare instance variable > instance variable: health,
comparison: less or equal, value: 0
Action: Enemy | Destroy

ขั้นท่ี 13 กาหนดค่าเลอื ด (Add Some Blood)
1. กาหนด image point ให้อยู่ในตาแน่งดา้ นหน้าของลูกกระสนุ ดงั ภาพ

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรียบเรยี งโดย..นายอภวิ ัฒน์ วงศ์กณั หา หนา้ 20

2. จากน้นั Double click ตวั เลอื ด Blood ข้ึนมา ลองกดปุ่ม Preview ดตู ัวอย่างภาพการทางาน
จะเห็นวา่ เลือดกระจายชา้ เกนิ ไป ใหท้ าการเปลี่ยนค่า Speed ของ Blood จาก 5 เป็น เป็น 24

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภวิ ัฒน์ วงศ์กณั หา หน้า 21

3. จากน้ันไปเพิ่ม Action เข้าไปอีก ดงั ภาพ

ดังนี้
Bullet1 | spawn another object > Object: blood, layer: 1, image point: 1

หากทดสอบงานแล้ว เห็นวา่ เลือดมีขนาดใหญ่เกินไปกใ็ ห้ปรบั ลดขนาดให้พอเหมาะลงได้

ข้นั ท่ี 14 กาหนดบรเิ วณพนื้ ท่ีการชน (Fix Collision Area)

1. Double click ทต่ี วั กระสุน
2. Click ปุ่ม polygon
3. ปรบั จดุ หรอื ลบจดุ หรอื เพิ่มจุดให้เป็นดงั ภาพ

หลงั จากนัน้ ให้ทาแบบเดียวกันนี้กบั ตวั Bullet2 ตวั Player และตวั Enemy

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรียงโดย..นายอภิวฒั น์ วงศก์ ัณหา หนา้ 22

ข้ันที่ 15 การทาให้ศตั รูเคล่ือนที่(Make Your Enemy Smarter)

1. เพม่ิ image point ตรงปลายกระบอกปนื ของตัวศัตรู
2. ใส่ behaviors 3 อย่างเขา้ ไปในตวั ศัตรู

เพือ่ กาหนดเสน้ ทางใหศ้ ัตรเู คลือ่ นทหี่ าตัวผเู้ ลน่

เพอื่ ใหต้ ัวศัตรูหันหน้าไปตามทิศทางทกี่ าลังเคลอื่ นท่ไี ป (Turret เป็นเหมือนหอคอยบนปอ้ ม)

เพื่อให้ศัตรูหยุด เม่ือชนขอบ Layout
3. หลังจากเพม่ิ Behaviors แลว้ ให้กาหนดค่าต่างๆ ดังนี้

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรียบเรียงโดย..นายอภิวัฒน์ วงศก์ ัณหา หน้า 23

จากน้นั ให้กาหนด Event ดังนี้

ขั้นท่ี 16 เพิม่ พลังชีวติ ของ Player (Add Player’s Health and Set Another Collision Event)
เพิ่ม instance variable ชื่อวา่ Health ใหก้ บั ตัว Player เท่ากบั 1000
เพ่มิ instance variable ชอื่ วา่ Power ใหก้ บั กระสุนของตัวศัตรูคือ Bullet2 เทา่ กับ 5

ขั้นท่ี 17 สร้างตัวศัตรเู พิ่มหลายๆตวั (Create More Enemy)
โดยการกดปุม่ Ctrl แช่ไว้ แลว้ ใชเ้ มาส์ลากรปู ตวั ศตั รูออกมา รวมท้งั หมดจานวน 5 ตวั

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภิวฒั น์ วงศก์ ณั หา หนา้ 24

ขน้ั ที่ 18 จดั การวางตาแหน่งของ Object (Clean Up The Layout)
วาง ลกู กระสุน เลือด ระเบดิ เวลา ใหอ้ ยูน่ อก Layout

ขน้ั ที่ 19 จัดการรปู แบบการแสดงผล (Creating a Heads-up Display (HUD))
เพื่อใช้ในการแสดงคะแนน เวลา หรอื พลังชวี ิต
การกาหนดคา่ ตัวแปร Score
1. คลกิ เมาส์ขวาตรงท่วี า่ งบน Event sheet เลือก Add global variable

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรยี บเรยี งโดย..นายอภวิ ฒั น์ วงศ์กณั หา หนา้ 25

พมิ พ์ชอื่ score ใหค้ า่ เรมิ่ ตน้ เท่ากบั 0

2. Click ปมุ่ OK
การกาหนดการแสดงผล Score ใหต้ รงึ บน Layer ตลอดเวลา ไมเ่ คล่อื นที่ไปมา
1. ใหเ้ พ่ิม Layer ขน้ึ มา แลว้ กาหนดชอื่ ว่า HUD
2. กาหนดค่า 0,0 ในชอ่ ง Parallax

3. แทรกวตั ถุ Text ตง้ั ชื่อวา่ Score วางไวม้ มุ ซ้ายบนของจอ
4. เปลย่ี นช่อื จาก Text ให้เปน็ เลข 0 กาหนดขนาดตวั อกั ษร และสีตวั อักษรเปน็ สเี หลือง

เอกสารประกอบการสรา้ งเกมดว้ ยโปรแกรม Construct 2 เรยี บเรียงโดย..นายอภวิ ัฒน์ วงศก์ ณั หา หน้า 26

แลว้ กาหนดคา่ ใน Event sheet

Add Action: System | Add to > variable: Score, Value: 100

Score | Set Text > Text: Score

ข้ันที่ 20 การเกดิ ศตั รูข้ึนมาใหม่ (Respawn the Enemy)
เมื่อเรายงิ ศตั รูตายลง กจ็ ะให้มศี ัตรตู วั ใหม่เกดิ ข้ึน โดยมีเงอ่ื นไขว่า ในทุกๆ 5 วนิ าที ถ้าจานวนตวั ศตั รูมีน้อยกว่า 5 ให้มี
ศตั รเู กดิ ขึ้นใหม่

ดงั น้ี
Condition: System | Every X seconds > Interval (seconds): 3
Action: System | Create object > Object to
create: Enemy, Layer: 1, X:random(layoutwidth) | Y: random(layoutheight)
Add Condition: System | compare two values > First value: Enemy.count, Comparison:Less
than, Second value: 5

ขัน้ ที่ 21 การเกดิ Player ขน้ึ มาใหม่ (Respawn the Player)
เม่อื ตัว Player โดนยงิ จนตายลงไป ก็จะใหม้ ตี ัว Player เกิดข้ึนใหมเ่ ชน่ เดยี วกนั

1. ใส่ Behaviors แบบ Flash ให้กบั ตัว Player
2. กาหนด Action ใหต้ ัว Player

ดังนี้
Action: System | Wait, seconds: 2.
System | Create object, object to create: Player, Layer 1, X: Enemy.X + 500, Y: Enemy.Y
Player | Flash, ‘On’ time: 0.1 ‘Off’ time: 0.1, Duration: 1.0

เมือ่ ตัว Player ตาย ให้รอ 2 วนิ าที เพอื่ ให้มี Player ตวั ใหม่เกดิ ขึ้นมา

เอกสารประกอบการสรา้ งเกมด้วยโปรแกรม Construct 2 เรียบเรียงโดย..นายอภวิ ฒั น์ วงศก์ ณั หา หนา้ 27

และน่คี ือ Event sheet ท้ังหมด เม่อื เสรจ็ สมบูรณ์แล้ว ดังน้ี


Click to View FlipBook Version