Mario ใน Scratch

เกม Mario เป็นเกมที่ดังมาก การจะทำเกมให้เหมือน Mario ในโปรแกรม Scratch คงใช้เวลาเอาเรื่องเลย แต่มาลองดูการทำตัวละครใน Scratch ให้เคลื่อนที่คล้ายในเกม Mario ก่อนอื่นดูคลิปนี้เป็นแนวทาง ในวีดีโอนี้ MrMattperreault อธิบายการสร้างตัวละครแมว ให้เคลื่อนที่ในแนวดิ่งตามแรงโน้มถ่วง (gravity) และแมวยังเด้งได้เมื่อกระทบพื้นและกระโดดได้เมื่อกด space bar นอกจากนั้นแมวยังเคลื่อนที่ในแนวราบแบบมีแรงต้านหรือแรงเสียดทานได้อีก วิธีการเขียนโปรแกรมโดยสรุปจากวีดีโอมีดังนี้ การเคลื่อนที่ในแนวดิ่ง สร้างพื้นสีฟ้า เพื่อให้แมวตกลงมาแล้วหยุดหรือเด้งได้ สร้างตัวแปร gravity มีแรงดึงลง ดังนั้นกำหนดค่าให้เป็น -0.3 สร้างตัวแปร velocity เป็นตัวกำหนดความเร็วในแนวดิ่ง กำหนดค่าเริ่มต้นที่ 0 หมายความว่า แมวอยู่กับที่ การทำให้แมวเคลื่อนที่ในแนวดิ่ง ตกสู่พื้นหรือเด้งขึ้น ต้องเปลี่ยนความเร็วตามแรงโน้มถ่วง ดังนั้นกำหนดค่า velocity ใหม่เป็น velocity + gravity จากนั้นเปลี่ยนค่าตำแหน่ง y ตามค่า velocity เป็น y + velocity เนื่องจาก gravity มีค่าเป็นลบ จะทำให้แมวเคลื่อนที่ลงหรือตกสู่พื้นสีฟ้า ถ้าต้องการให้แมวเด้งขึ้นเมื่อกระทบพื้น ต้องตรวจสอบการสัมผัสพื้นก่อน จากนั้นเปลี่ยนทิศของการเคลื่อนที่ ที่ขึ้นกับค่าของ velocity ซึ่งก่อนหน้าจะกระทบพื้น velocity มีค่าเป็นลบ (เคลื่อนที่ลง) …

Advertisements

Kodu Grammar

Kodu เป็นโปรแกรมภาษาเฉพาะด้าน (Domain-specific language) สร้างมาสำหรับการสร้างเกม โดยอาศัยไวยากรณ์ภาษา (Grammar) ของ Kodu เป็นตัวกำหนดวิธีการเขียนโปรแกรมในเกม การเขียนเกมใน Kodu เริ่มจากการสร้างโลกของเกมขึ้นมาก่อน โดยสร้างพื้นที่ในการเล่นเกม (Terrain) จากนั้นสร้างตัวละคร หรือ วัตถุต่างๆ เข้าไปบนพื้นที่นั้น ต่อมาคือการสร้างกฎของเกม เพื่อให้ตัวละครและวัตถุต่างๆ ทำงานร่วมกัน ตามที่เกมได้ถูกออกแบบไว้ กฎต่างๆ ในเกม จะถูกกำหนดโดยการเขียนโปรแกรมเข้าไปยังตัวละคร หรือวัตถุต่างๆ และลักษณะการเขียนโปรแกรมใน Kodu คือการสั่งให้ตัวละคร หรือวัตถุต่างๆ ทำงานเมื่อเหตุการณ์ต่างๆ เกิดขึ้น เช่นในตัวอย่างตามรูปด้านบน เป็นการกำหนดกฎให้ตัวละคร Kodu มีทั้งหมด 4 เหตุการณ์ แต่ทำงาน 5 อย่าง  ไวยากรณ์ของ Kodu อยู่ในรูปแบบง่ายๆ คือ แต่ละบรรทัด หรือแต่ละรายการ (มีตัวเลขกำกับอยู่) เป็นกฎหนึ่งข้อสำหรับตัวละครหรือวัตถุนั้น กฎจะอยู่ในรูปแบบตามไวยากรณ์ของ Kodu ดังนี้ When Condition Do Action  อธิบายได้ว่า เมื่อ (When) เหตุการณ์ที่เฝ้ารอเกิดขึ้น (Condition) ให้ทำ (Do) งานดังนี้ (Action) …

โปรแกรมแมวเหมียว ตอน 4

ถ้าคุณมีมือถือ Android ที่สามารถติดต่อกับ App Inventor ได้ ให้ต่อสาย USB เข้ากับเครื่องคอมพิวเตอร์ โปรแกรม Hello Purr จะปรากฎบนมือถือให้ทดสอบ (live testing) ได้ทันที แต่ถ้าดึงสาย USB ออก โปรแกรมก็จะหายไป ไม่มีอยู่ในมือถืออีกต่อไป ทั้งนี้เพราะโปรเจกได้ถูกเก็บไว้ในระบบคลาวด์ (Cloud system) ถ้าเสียบสาย USB กลับไปขณะที่ยังอยู่ในระบบอยู่ โปรแกรม Hello Purr ก็จะกลับมาอีกครั้ง ถ้าต้องการทดสอบโปรแกรมที่เราสร้างขึ้นมา โดยไม่ต้องใช้สาย USB เราต้องดาวน์โหลดโปรเจกจากระบบมาเก็บไว้ที่มือถือเราเอง เรียกวิธีนี้ว่า Package for Phone เหมือนกับการจัดเก็บของ (ในที่นี้คือโปรเจก) แล้วส่งของผ่านพัสดุ จากระบบคลาวด์มาที่มือถือของเรานั้นเอง วิธีการทำ คือ คลิกปุ่ม Package for Phone บนโปรแกรม Designer คลิกเลือก Download to Connected Phone โปรแกรมจะสร้างไฟล์นามสกุล apk ส่งมาและติดตั้งเข้าไปยังมือถือ ซึ่งต้องต่อสาย USB อยู่ …

โปรแกรมแมวเหมียว ตอน 3

เมื่อเราได้ออกแบบโปรแกรม Hello Purr เรียบร้อยแล้ว ต่อไปก็จะทำการเขียนโปรแกรมให้แต่ละส่วนโปรแกรมทำงานร่วมกัน ตามโจทย์ของเรา นั่นคือเมื่อผู้ใช้โทรศัพท์แตะที่รูปแมว ก็จะมีเสียงร้องของแมวดังออกมา เริ่มต้นการเขียนโปรแกรมด้วยการเปิดโปรแกรม Blocks Editor ด้วยการคลิกปุ่ม Open the Blocks Editor บนโปรแกรม Designer รอสักครู่ ไฟล์ AppInventorForAndroidCodeblocks.jnlp จะถูกดาวน์โหลดและรันโดยอัตโนมัติ แต่ถ้าโปรแกรมไม่เปิดทำงานเอง (เบราว์เซอร์อาจไม่ได้ตั้งค่าให้รันโปรแกรมจาวาโดยอัตโนมัติ) ก็สามารถดับเบิลคลิกไฟล์ที่ดาวน์โหลดมาได้เอง Blocks Editor มี 3 แทป (Built-in, My Blocks, Advanced) Built-in รวบรวมบล็อกคำสั่งที่สามารถใช้ได้กับทุกโปรเจก ส่วน My Blocks เป็นบล็อกคำสั่งของส่วนโปรแกรมที่ออกแบบไว้ในโปรเจกนี้เท่านั้น (Advanced ยังไม่กล่าวถึงในที่นี่) พื้นที่ว่างด้านขวาเป็นพื้นที่สำหรับวางบล็อก เพื่อสร้างโปรแกรม ถ้าไม่ต้องการบล็อกใดแล้ว ให้ลากบล็อกนั้นไปลงถังขยะที่อยู่มุมล่างขวา ส่วนอื่นๆ ของโปรแกรมจะกล่าวต่อไปภายหลัง เมื่อคลิกที่ส่วนโปรแกรมใด (ในรูปเป็น Button1) จะปรากฎหน้าต่างแสดงบล็อกที่เกี่ยวข้องกับส่วนโปรแกรมนั้น วิธีการเขียนโปรแกรม ทำได้โดยลากบล็อกที่ต้องการไปยังพื้นที่ว่างถัดไป การต่อบล็อกจะคล้ายกับ Scratch …

โปรแกรมแมวเหมียว ตอน 2

เมื่อเรารู้องค์ประกอบหลักๆ ของ Designer กันแล้ว ขั้นตอนต่อไป คือ ออกแบบหน้าตาโปรแกรมบนมือถือ ซึ่งทำได้โดย ลากส่วนประกอบที่ต้องการไปยัง Viewer ตอนเริ่มต้นโปรเจกใหม่ จะมีส่วนโปรแกรมที่เป็นหน้าจอมือถือ (Screen1) ก่อนอยู่แล้ว ดังนั้นเราจึงเห็น หน้าจอมือถืออยู่ที่ Viewer ส่วนโปรแกรม Screen1 ใน Components และรายการคุณสมบัติของ Screen1 ใน Properties สังเกตเลข 1 ที่ตามหลังชื่อส่วนโปรแกรม Screen ใน Viewer หรือใน Components ตัวเลขนี้ถูกใส่เข้าไปในชื่อ เพราะในโปรแกรมหนึ่ง อาจมีส่วนโปรแกรมชนิดเดียวกันมากกว่า 1 ส่วน ถ้าเราลากส่วนโปรแกรมที่มีอยู่แล้วเพิ่มเข้าไปใน Viewer ตัวเลขในชื่อจะเพิ่มขึ้นเองโดยอัตโนมัติ เพื่อป้องกันชื่อซ้ำกัน ลำดับแรกในการออกแบบโปรแกรม Hello Purr เริ่มด้วยการลากส่วนประกอบปุ่ม (Button) ในหมวด Basic มายังหน้าจอมือถือ สังเกตว่าปุ่มใน Components จะถูกเลือกพร้อมทั้งแสดงคุณสมบัติของปุ่มใน Properties โดยอัตโนมัติ ณ ขณะนี้ ปุ่มที่อยู่ใน Viewer จะมีรูปร่างสี่เหลี่ยมพร้อมข้อความ Text for Button1 (ในกรอบสีส้ม) สิ่งที่เราต้องการแก้ไข …