วันอังคารที่ 22 มีนาคม พ.ศ. 2559

construct 2 : sprite font

sprite font คือ วิธีการหนึ่งในการใช้งาน text แต่มีข้อแตกต่างจากการใช้ตัวอักษรทั่วไป คือการใช้ภาพแทนตัวอักษร ตัวอักษรแต่ละตัวจะแทนด้วยส่วนย่อยของภาพ 1 ส่วน ตัวอักษรแต่ละตัว จะถูกออกแบบและตกแต่งให้มีลักษณะเฉพาะ และเข้ากับเกมที่สร้างขึ้น

การเลือกใช้ sprite font ควรใช้เมื่อใด
การใช้งานตัวอักษรต่าง ๆ มักเกิดปัญหาในการแสดงผล เช่น การเปิดด้วย browser ที่แตกต่างกัน การแสดงผลตัวอักษรจะแตกต่างกันด้วย แต่ปัญหาดังกล่าวจะไม่เกิดขึ้น เมื่อใช้งานภาพข้อความ แต่การใช้ภาพข้อความ มักจะเกิดปัญหา เมื่อต้องการเปลี่ยนข้อความในขณะที่รับชม หรือเล่นเกม การใช้ spritefont จะเป็นการใช้ภาพมาแทนตัวอักษร จึงสามารถเปลี่ยนแปลงข้อความได้ตลอดเวลา

การใช้ตัวอักษร จะสามารถเปลี่ยนแปลงสีได้เพียงสีเดียว แต่ถ้าหากใช้ spritefont สามารถจะตกแต่งด้วยสีได้ตามต้องการ ตกแต่งได้หลากหลายสี ทำให้เกมที่สร้างขึ้นมานั้นน่าสนใจมากยิ่งขึ้น

เราควรเลือกใช้ sprite font เมื่อ
1. เมื่อต้องการให้การแสดงผลตัวอักษร การจัดแนว เหมือนกันในทุก browser ที่เรียกใช้งาน
2. เมื่อต้องการใช้กราฟิคกับตัวอักษร เช่น fades, outline, drop shadows
3. ใช้ sprite font เมื่อเกิดปัญหาในการส่งออกเกม แล้วไม่สามารถส่งออกแบบอักษรที่ใช้ไปด้วยได้

ควรระวังการใช้งาน sprite font เมื่อ
1. ไม่ควรใช้ sprite font เมื่อมีการเปลี่ยนขนาดของตัวอักษร หรือการจัดรูปแบบที่แตกต่างกันบ่อยๆ เช่น ตัวหนา ตัวเอียง เพราะจะต้องสร้าง sprite font ที่แตกต่างกันจำนวนมาก
2. ไม่ควรใช้ sprite font สำหรับการแสดงข้อความจำนวนมาก เช่น รายละเอียดของเกม หรือเนื้อหา เรื่องราว เนื้อเรื่อง หรือ คำอธิบายเกม การแสดงผลลักษณะนี้ ควรใช้ข้อความที่เป็นตัวอักษรทั่วไปจะเหมาะสมกว่า

หวังว่าหลักการใช้งาน sprite font จะเป็นประโยชน์กับผู้อ่านนะครับ แล้วบทความต่อไป ผมจะนำเสนอวิธีการใช้งาน sprite font และแหล่งข้อมูลในการหา sprite font สวยๆ มาใช้งาน ขอให้สนุกกับการสร้างเกมนะครับ

วันอาทิตย์ที่ 13 มีนาคม พ.ศ. 2559

construct 2 : Sprite เดินเอง ตอน 2

บทความนี้ เป็นตอนที่ 2 แล้วนะครับ สำหรับการสร้าง sprite ที่สามารถเคลื่อนที่ไป-มา ได้โดยอัตโนมัติ ในบทความที่ผ่านมา ผมนำเสนอการเคลื่อนที่แบบง่าย ๆ  คือ เดินไปชนผนังแล้วก็เปลี่ยนทิศทาง กลับไป-กลับมา
แต่ในบทความนี้ เราจะเอาผนังออกไป ให้ sprite ของเราฉลาดขึ้นมา คือเดินไปสุดทาง แล้วเดินกลับ

ขั้นแรกต้องสร้างทางเดินของตัว sprite โดยกำหนดพฤติกรรมเป็นแบบ solid ดังนี้



สร้าง sprite ขึ้นมา เพื่อเป็นตัวละครของเกม กำหนดพฤติกรรมเป็นแบบ platform



เพิ่ม instance variable จากแถบ Properties ของตัวละคร ชื่อ moveRight เป็นชนิด Boolean มีค่าเริ่มต้นเป็น true



การตรวจสอบการเดินของ sprite จะตรวจสอบจาก offset ของพื้น โดยปกติ ถ้าไม่ได้กำหนดเป็นอย่างอื่น ถ้าเคลื่อนที่ไปทางด้านขวา ค่าในแกน x จะเป็นลบ แต่เมื่อเคลื่อนที่ไปทางซ้าย ระยะแกน x จะเป็นบวก




การคำนวณ ระยะที่ต้องหมุนกลับ เมื่อเดินไปทางด้านขวา ค่า offset แกน x จะคำนวณดังนี้
- (ความกว้างของพื้น)  เช่น  -(wall.Width)

การคำนวณ ระยะที่ต้องหมุนกลับ เมื่อเดินไปทางด้านซ้าย ค่า offset แกน x จะคำนวณดังนี้
ความกว้างของพื้น เช่น  wall.Width


เพิ่มคำสั่งใน event sheet ดังนี้




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



ขอให้สนุกกับการสร้างเกมนะครับ

construct 2 : Sprite เดินเอง ตอน 1

สำหรับมือใหม่หัดสร้างเกม หลายคนคงจะเคยสร้าง sprite ที่ไว้ให้ hero ของเราเดินชน กระโดดเหยียบ แบบที่วางไว้ตรงไหนก็อยู่ตรงนั้น แต่บทความนี้ ผมจะนำเสนอวิธีการที่ทำให้ sprite ของเกมที่เราสร้างดูฉลาดขึ้นมาหน่อย คือ เคลื่อนที่ไป-มา ได้โดยอัตโนมัติ

ในบทความตอนนี้ จะนำเสนอการเคลื่อนที่แบบง่าย ๆ กันก่อนนะครับ คือ เดินไปชนผนังแล้วก็เปลี่ยนทิศทาง กลับไป-กลับมา ขั้นแรกต้องสร้างทางเดินของตัว sprite โดยกำหนดพฤติกรรมเป็นแบบ solid ดังนี้



สร้าง sprite ขึ้นมา เพื่อเป็นตัวละครของเกม กำหนดพฤติกรรมเป็นแบบ platform



เพิ่ม instance variable จากแถบ Properties ของตัวละคร ชื่อ moveRight เป็นชนิด Boolean มีค่าเริ่มต้นเป็น true




เพิ่มคำสั่งใน event sheet ดังนี้



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



ขอให้สนุกกับการสร้างเกมนะครับ

construct 2 : วาดเส้นอิสระ

หลังจากที่ผมได้นำเสนอวิธีการวาดเส้นตรงด้วย Construct 2 ไปแล้ว บทความนี้ผมจะนำเสนอวิธีการวาดเส้นอิสระ โดยใช้ mouse กดลากให้เกิดรูปตามต้องการ  หลายคนคงอาจจะเคยใช้วิธีการให้สร้างวัตถุใหม่ขึ้นมาเรื่อยๆ ในขณะที่ mouse เคลื่อนที่ แต่วิธีการดังกล่าวนั้นจะมีปัญหา คือ เมื่อเราลาก  mouse ไปอย่างรวดเร็ว เส้นที่เกิดจะขาดเป็นช่วง ไม่ต่อเนื่องกัน และถ้าวาดเยอะมาก จะเกิดการค้างของโปรแกรมได้
การแก้ปัญหาของผมที่จะนำเสนอคือ การใช้หลักการของการวาดเส้นตรงระหว่างจุดสองจุด โดยอาศัยตัวแปรชั่วคราว 2 ตัว เพื่อเก็บตำแหน่งจุดเริ่มต้น x และ y  และอีก 2 ตัว เพื่อเก็บตำแหน่งจุดสิ้นสุด x และ y ใช้ฟังก์ชันทางคณิตศาสตร์ ที่ชื่อว่า distance โดยมีรูปแบบคำสั่ง คือ distance(X1,Y1,X2,Y2)

ขั้นตอนแรก สร้าง sprite ที่จะใช้สำหรับสร้างเส้นตรง ตั้งชื่อว่า line1 และกำหนด Image points Origin ให้ค่า X = 0 เพื่อเป็นจุดเริ่มต้นของการขยายภาพ (ปกติค่า X จะถูกกำหนดไว้กึ่งกลางภาพ เวลาขยายภาพ จะขยายออกจากกึ่งกลางภาพ ทำให้เส้นตรงที่ได้ มีจุดเริ่มต้นไม่ตรงตามที่เราต้องการ)




สร้างตัวแปร จำนวน 4 ตัว คือ x1, y1, x2, y2 เป็นชนิด Number มีค่าเริ่มต้นเป็น 0



เพิ่มวัตถุ Mouse เข้ามาในเกม และเพิ่มคำสั่งใน event sheet ดังนี้



เมื่อทดลองวาดเส้นตรง จะเกิดเส้นตรงที่ต่อเนื่อง และไม่ขาดช่วง สามารถวาดเป็นภาพ หรือเขียนตัวหนังสือต่าง ๆ ได้



ขอให้สนุกกับการสร้างเกมนะครับ

construct 2 : วาดเส้นตรง

บทความนี้จะขอกล่าวถึงการวาดเส้นตรงในเกม โดยเกมส่วนมากจะใช้การวาดเส้นตรงในการวัดระยะหรือกำหนดขอบเขตของเกม หรือใช้แสดงเส้นแบ่งของการโจมตี เช่น เกม “fruit ninja” หรือใช้ในการเชื่อมความสัมพันธ์ของสิ่งของต่าง ๆ เช่น เกมจับคู่  หรือจะใช้ในการวาดภาพก็ได้เช่นเดียวกันครับ



หลักการวาดเส้นตรงที่ผมจะแนะนำ จะใช้หลักของการขยายภาพ โดยที่เรามีภาพที่เป็นสี่เหลี่ยมกำหนดไว้แล้ว หลังจากนั้นก็ขยายความยาวไปตามระยะทางที่ mouse เคลื่อนที่ไป การกำหนดความยาวนั้น จะใช้ฟังก์ทางคณิตศาสตร์ ที่ชื่อว่า distance โดยมีรูปแบบคำสั่ง คือ distance(X1,Y1,X2,Y2)

ขั้นตอนแรก สร้าง sprite ที่จะใช้สำหรับสร้างเส้นตรง ตั้งชื่อว่า line1 และกำหนด Image points Origin ให้ค่า X = 0 เพื่อเป็นจุดเริ่มต้นของการขยายภาพ (ปกติค่า X จะถูกกำหนดไว้กึ่งกลางภาพ เวลาขยายภาพ จะขยายออกจากกึ่งกลางภาพ ทำให้เส้นตรงที่ได้ มีจุดเริ่มต้นไม่ตรงตามที่เราต้องการ)



กำหนดค่าตัวแปร Instance variable ชื่อ drawing  ชนิดข้อมูลแบบ Boolean  กำหนดค่าเริ่มต้นเป็น false



เพิ่มวัตถุ Mouse เข้ามาในเกม และเพิ่มคำสั่งใน event sheet ดังนี้



เมื่อทดลองการทำงานของเกม เมื่อเราคลิก mouse แล้วลากออกไป จะเกิดเส้นตรงจากจุดเริ่มต้นและยาวไปถึงตำแหน่งของ mouse ที่เคลื่อนที่ไป

การวาดเส้นตรง สามารถนำไปใช้ในการสร้างเกมได้หลากหลาย และยังสามารถใช้สำหรับการวาดรูปร่างแบบอื่น ๆ ได้อีกด้วย เช่น วงกลม สี่เหลี่ยม เป็นต้น ขอให้สนุกกับการสร้างเกมนะครับ

วันศุกร์ที่ 11 มีนาคม พ.ศ. 2559

construct 2 : Upload game to Google Drive

หลายคนคงเจอปัญหาว่า เมื่อสร้างเกมมาแล้ว จะเอาเกมไปแจกจ่ายให้เล่นกันได้อย่างไร แถม construct ที่ใช้ก็เป็น free version ถึงจะสามารถ export ออกมาเป็น HTML5 ได้ แต่ก็ไม่อยากจะไปเช่าโฮสให้เสียเงินเปล่าๆ บทความนี้จะช่วยเป็นทางออกของคนทำเกมสมัครเล่นครับ ทางออกที่ว่านั้น คือ การใช้บริการ google drive ของบริษัท google ที่ให้บริการฝากไฟล์ข้อมูลให้ฟรี ๆ ขนาดพื้นที่ 15 G กันเลยทีเดียว (จริง ๆ แล้วแบบเสียเงินก็มีนะครับ แต่พอพูดว่าเสียเงินแล้ว ไม่ค่อยมีคนสนใจเท่าไร)



ขนาดที่ทาง google drive ให้มานี่ เกินพอสำหรับการ upload เกมของเราไปเก็บไว้ให้กลุ่มเพื่อน ๆ เล่นกัน
ก่อนจะทำตามขั้นตอนในบทความนี้ ผมขอให้สมัครเป็นสมาชิกของ google ก่อนนะครับ โดยการสมัครใช้บริการอีเมล์ของ gmail ก็ได้ครับ ส่วนใครที่เป็นสมาชิกอยู่แล้ว ก็ข้ามขั้นตอนนี้ไปได้เลย

เตรียมไฟล์เกม
เมื่อเราสร้างเกมเสร็จเรียบร้อยดีแล้ว จะต้องทำการ export เกมออกมาให้อยู่ในรูปแบบ HTML5 ก่อน โดยไปที่ File --> Export Project... จะได้หน้าต่างสำหรับส่งออกเกม ซึ่งมีหลายรูปแบบด้วยกัน แต่ขอให้เลือกเป็นแบบ HTML5



กำหนดตำแหน่งของไฟล์เกมที่จะส่งออก และยังสามารถกำหนดชื่อ Folder สำหรับเก็บภาพ และเก็บไฟล์เกมได้อีกด้วย แต่ปกติก็ไม่ต้องเปลี่ยนแปลงค่าอะไร คลิกปุ่ม Next เพื่อไปยังขั้นตอนต่อไปได้เลย



ต่อไปจะเป็นการกำหนดรูปแบบของเกมที่จะส่งออก โดยปกติจะกำหนดเป็น Normal style แต่เราก็ยังสามารถกำหนดการแสดงแบบอื่น ๆ เพิ่มเติมได้ แล้วคลิกปุ่ม Export เพื่อส่งออกเกมได้เลย



เมื่อส่งออกสำเร็จ โปรแกรมจะแสดงหน้าต่างแจ้ง The project was successfully exported. ถือว่าสำเร็จกระบวนการส่งออกเกม



เมื่อเปิดดูไฟล์ที่ได้จากการส่งออก จะประกอบด้วยไฟล์ข้อมูลที่จำเป็นในการแสดงเกมในรูปแบบเว็บ ดังภาพ




Upload file to google drive
ขั้นตอนต่อไปจะเป็นการนำไฟล์ที่ส่งออก ไปเก็บไว้ยัง drive ของ google โดยไปที่ เว็บ drive.google.com แล้วเข้าระบบให้เรียบร้อย สร้าง Folder สำหรับเก็บงานเกมของเรา ด้วยคำสั่ง New --> Folder  แล้วตั้งชื่อให้สอดคล้องกับเกมที่เราสร้าง





Upload ไฟล์ข้อมูลที่ได้ส่งออกไว้แล้วขึ้นไปยัง Folder ที่เราได้สร้างไว้




เมื่อ upload ไฟล์ข้อมูลทั้งหมดเสร็จแล้ว จะต้องแชร์ Folder เพื่อให้คนอื่นเข้ามาเล่นเกมที่เราสร้างได้ โดยไปที่ Folder ที่เราสร้างไว้ คลิกลูกศรสีดำ จะมีคำสั่งเลื่อนลงมา  เลือก Share...



กำหนดการเข้าถึงเป็นแบบ Anyone with the link can view เพื่อให้คนที่มีลิงค์สามารถเข้าชมได้  และคัดลอกที่อยู่ลิงค์ของ Folder เอาไว้



ลักษณะของลิงค์ ที่ได้ จะเป็น ดังนี้

https://drive.google.com/folderview?id=0B-f6ViMko6VsX1FCTDBTS2VLeGs&usp=sharing

ส่วนที่เป็นค่าของ id คือ ตำแหน่งของ Folder ที่อยู่บน Google drive (ส่วนที่เป็นตัวหนาสีแดง)

ปรับปรุงส่วนของลิงค์ที่จะแชร์ใหม่ ให้อยู่ในรูปแบบ

https://googledrive.com/host/FOLDER ID/index.html

ตรงส่วนของ Folder id ให้แทนด้วย id ของ Folder ที่เราแชร์ไว้ จะได้ลักษณะ ดังนี้

https://googledrive.com/host/0B-f6ViMko6VsX1FCTDBTS2VLeGs/index.html

เมื่อเวลาส่งลิงค์ไปให้เพื่อนๆ เข้ามาเล่นเกมของเรา ก็เอาลิงค์ที่สร้างขึ้นใหม่นี้ไปใช้งาน ทีนี้ใครๆ ก็สามารถเข้ามาเล่นเกมที่เราสร้างขึ้นมาได้ โดยไม่จำเป็นต้องเสียเงินในกระเป๋าไปเช่าโฮสให้ยุ่งยากอีกแล้ว

แต่ของฟรีก็ย่อมมีข้อจำกัดอยู่บ้าง คือ bandwidth ที่ได้นั่นจะไม่มากนัก ถ้ามีการเข้าใช้งานเยอะๆ ทาง google อาจจะปิดการแชร์ ทำให้ไม่สามารถเข้าเล่นเกมได้ ถ้าเกมของเราเป็นที่นิยมขนาดที่มีคนเข้าเล่นเป็นจำนวนมาก ควรรีบเช่าโฮส และนำเกมไปติดตั้ง ลงโฆษณา หาเงินเข้ากระเป๋าเยอะๆ กันเลยนะครับ


วันพฤหัสบดีที่ 10 มีนาคม พ.ศ. 2559

Construct 2 : Instance Variables


Instance Variables หรือจะเรียกง่าย ๆ ว่าตัวแปรเฉพาะ ซึ่งตัวแปรดังกล่าวนี้ จะกำหนดให้เฉพาะวัตถุแต่ละตัว ชนิดข้อมูลที่สามารถกำหนดได้ จะเป็นตัวเลข ข้อความ และตรรกะ ค่าตัวแปรที่กำหนดนี้ จะมีความเฉพาะของวัตถุแต่ละตัว  เช่น ค่าพลังชีวิต (health) ค่าสถานะ (state) เป็นต้น การกำหนดค่า instance variables จะสามารถกำหนดได้จากแถบ Properties โดยจะมีกล่องโต้ตอบสำหรับเพิ่มหรือลบค่าตัวแปรเฉพาะ
 





Instance Variables  จะช่วยในการควบคุมวัตถุแบบอิสระ เช่น การกำหนดตัวแปร ชนิดตรรกะ เพื่อให้บอกสถานะของศัตรูว่าจะวิ่งเข้าทำร้ายตัวเอก (Hero)  ซึ่งกำหนดค่าเป็นจริง หรือวิ่งหนีจากตัวเอกของเกม โดยกำหนดค่าเป็นเท็จ  กลุ่มวัตถุชนิดเดียวกัน แต่ถูกกำหนดค่า instance variables  ที่แตกต่างกัน ส่งผลให้ตัวสถานะของศัตรูถูกแบ่งแยกออกไป บางตัวจะวิ่งเข้ามาทำร้ายตัวเอก แต่บางตัวจะวิ่งหนีไป วัตถุถึงแม้จะเป็นชนิดเดียวกัน แต่ก็จะมีพฤติกรรมที่แตกต่างกันไปอย่างอิสระ ด้วยการกำหนดค่า instance variables ที่แตกต่างกัน



Instance Variables dialog
การกำหนดค่า instance variables จะสามารถกำหนดได้จากแถบ Properties โดยคลิกที่คำสั่ง Add/Edit Instance Variables จะปรากฏกล่องโต้ตอบสำหรับเพิ่มหรือลบค่า Instance Variables
 




Name จะใช้กำหนดชื่อเฉพาะของตัวแปร ชื่อที่กำหนดขึ้นมาจะเป็นส่วนขยายของชื่อวัตถุ เช่น Sprite.MyVariable ซึ่งจะใช้อ้างถึงค่า instance variable ที่กำหนดขึ้นในวัตถุแต่ละตัว แต่ชื่อที่กำหนดขึ้นนี้ต้องไม่ซ้ำกับชื่อวัตถุ หรือคำสงวนที่สำคัญต่าง ๆ ของโปรแกรม Construct 2


Type เป็นการกำหนดชนิดของตัวแปร สามารถกำหนดได้ 3 ชนิด คือ ตัวเลข (Number)  ข้อความ (Text) และ ตรรกะ (Boolean)

Initial value คือ ค่าเริ่มต้นของตัวแปร โดยจะกำหนดตามชนิดของตัวแปรนั้น เช่น ตัวเลข ข้อความ ข้อความที่กำหนดเป็นค่าเริ่มต้น จะไม่สามารถเป็นค่าว่างได้ และข้อความจะต้องอยู่ภายใต้เครื่องหมาย "" และค่าข้อมูลแบบตรรกะ จะกำหนดได้สองค่า คือ true และ false เท่านั้น

Description คือ คำอธิบายเพิ่มเติม เพื่ออธิบายการใช้งานตัวแปร หรือวัตถุประสงค์ของการสร้างตัวแปร ซึ่งจะกำหนดหรือไม่ก็ได้

การใช้งาน instance variables เป็นประโยชน์อย่างมากในการสร้างเกม ขอให้ฝึกฝนและใช้งานกันบ่อย ๆ ขอให้สร้างเกมอย่างมีความสุขนะครับ


วันเสาร์ที่ 5 มีนาคม พ.ศ. 2559

construct 2 : ยิงปืนใหญ่แบบโพรเจกไทล์


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

การเคลื่อนที่แบบโพรเจกไทล์  เป็นการเคลื่อนที่ของวัตถุ โดยมีแนวการเคลื่อนที่เป็นแนวโค้ง  ตัวอย่าง : การเคลื่อนที่ของลูกธนู กระสุนปืนใหญ่ การเคลื่อนที่ของลูกเทนนิส การเคลื่อนที่ของลูกบอลที่ถูกเตะโด่ง

ลงมือสร้างเกมกันเลย สร้างโปรเจคใหม่ขึ้นมา  กำหนดขนาด window size เท่ากับ 800, 480  และ layout size เท่ากับ 800, 480
แทรกพื้นดินสำหรับตั้งปืนใหญ่ กำหนดคุณสมบัติเป็นแบบ solid อาจจะเพิ่มฉากหลังด้วยก็ได้นะครับ เพื่อความสวยงามของเกม




แทรกวัตถุปืนใหญ่ แบบ sprite เข้ามาในเกม โดยกำหนด image point 1 ที่ปลายกระบอกปืน แล้วนำมาลงในเกมที่ตำแหน่งมุมด้านขวา



ต่อไปสร้างกระสุนปืนใหญ่ ด้วยการแทรกวัตถุแบบ sprite เข้ามาในเกม ตั้งชื่อเป็น bullet และกำหนดพฤติกรรม behaviorsแบบ bullet โดยกำหนดให้ gravity = 20  กำหนด size เป็น 15,15 และวางไว้นอกพื้นที่เกม



เพิ่ม slider bar เข้ามาในเกม เพื่อใช้ปรับความเร็วของกระสุน โดยตั้งชื่อว่า speedbar กำหนด property ดังนี้
value = 100 กำหนดค่าเริ่มต้นของ slider bar
minimum =0 กำหนดค่าต่ำสุดของ slider bar
maximum = 150 กำหนดค่าสูงสุดของ slider bar
step = 5 กำหนดค่าช่วงข้อมูลของ slider bar
เพิ่ม slider bar เข้ามาในเกมอีกหนึ่งตัว เพื่อใช้ปรับมุมของปืนใหญ่ โดยตั้งชื่อว่า anglebar กำหนด property ดังนี้
value = 300 กำหนดค่าเริ่มต้นของ slider bar
minimum =270 กำหนดค่าต่ำสุดของ slider bar
maximum = 360 กำหนดค่าสูงสุดของ slider bar
step = 1 กำหนดค่าช่วงข้อมูลของ slider bar
จัดวาง และเพิ่ม text เพื่อความสวยงาม



เพิ่มวัตถุแบบ Mouse เข้ามาในเกม เพื่อใช้ควบคุมการทำงานและยิงกระสุนปืน
กำหนดคำสั่งสำหรับการทำงาน ดังนี้



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