วิธีการสร้างappinventor 1

ส่วนประกอบของโปรแกรม App Inventor

โปรแกรม App Inventor ช่วยให้สามารถพัฒนาแอพพลิเคชันสำหรับโทรศัพท์ระบบปฏิบัติการ Android ซึ่งทำผ่านการใช้เว็บเบราเซอร์และทดสอบบนโทรศัพท์ที่เชื่อมต่ออยู่กับคอมพิวเตอร์หรือทดสอบบนโทรศัพท์จำลองบนเครื่องคอมพิวเตอร์ โปรเจคที่สร้างทั้งหมดจะถูกจัดเก็บไว้บนเซิร์ฟเวอร์ App Inventor ซึ่งช่วยให้สามารถพัฒนางานต่อที่เครื่องคอมพิวเตอร์เครื่องใดก็ได้ เพียงแค่ได้มีการเชื่อมต่อกับระบบอินเทอร์เน็ตไว้เท่านั้น การสร้างแอพพลิเคชันจะแบ่งการทำงานออกเป็นสองส่วน คือ ส่วนออกแบบ (App Inventor Designer) ที่จะให้เราเลือกคอมโพเนนท์ที่ต้องการสำหรับที่จะให้สร้างแอพพลิเคชัน ส่วนที่สองเป็นส่วนการเขียนโค้ด (App Inventor Blocks Editor) ที่ให้เราเขียนโค้ดด้วยการต่อบล๊อกต่างๆ เข้าด้วยกันเป็นคำสั่ง ซึ่งจะเป็นการกำหนดพฤติกรรมหรือเหตุการณ์ที่เกิดขึ้นกับคอมโพเนนท์ การเขียนโปรแกรมจะเสมือนการต่อชิ้นส่วนตัวต่อจิ๊กซอว์เข้าด้วยกัน ในแต่ละขั้นตอนการสร้างจะสามารถทำการทดสอบได้ทุกขณะ และเมื่อสร้างเสร็จสมบูรณ์แล้วจะสามารถแพ็คเกจแอพพลิเคชันเพื่อนำไปใช้งานบนโทรศัพท์ระบบปฏิบัติการ Android เครื่องใดก็ได้ หรือหากไม่มีโทรศัพท์ระบบปฏิบัติการ Android ก็สามารถที่จะทดสอบได้บนโทรศัพท์จำลองที่ทำงานอยู่บนคอมพิวเตอร์ซึ่งจะมีลักษณะการทำงานเหมือนโทรศัพท์จริงทุกประการ สภาพแวดล้อมในการพัฒนาด้วยโปรแกรม App Inventor นั้น สนับสนุนระบบปฏิบัติการที่หลากหลาย ไม่ว่าจะเป็นระบบปฏิบัติการ Mac OS X, GNU / Linux และระบบปฏิบัติการ Windows และแอพพลิเคชันที่สร้างขึ้นนั้นสามารถติดตั้งและทำงานได้บนโทรศัพท์ระบบปฏิบัติการ Android หลากหลายรุ่นที่เป็นที่นิยมในปัจจุบัน

ภาพ 1 แอพพลิเคชันที่สร้างขึ้นด้วยโปรแกรม App Inventor ในหน้าต่างเว็บเบราเซอร์ 1.1.1 ส่วนออกแบบ (App Inventor Designer) ในขั้นตอนแรกของการสร้างแอพพลิเคชันด้วย App Inventor เริ่มจากการเลือกคอมโพเนนท์ที่ต้องการและจัดวางลงในส่วนของการออกแบบโดยจะทำผ่านส่วนของการออกแบบ (App Inventor Designer) ดังที่แสดงในภาพที่ 1 แสดงให้เห็นถึงแอพพลิเคชันที่สร้างขึ้นในหน้าต่างเว็บเบราเซอร์ โดยด้านซ้ายจะเป็นส่วนของคอมโพเนนท์ที่ App Inventor เตรียมไว้ให้จัดเรียงเป็นหมวดหมู่ เช่น ปุ่ม (button) ข้อความ (label) กล่องข้อความ (text box) เป็นต้น ผู้ใช้ทำการเพิ่มคอมโพเนนท์ที่เลือกด้วยการคลิกลากลงไปวางไว้ในโปรเจค

ภาพ 2 หน้าจอการจัดการโปรเจค (My Projects) อินเตอร์เฟสบนหน้าเว็บ App Inventor นั้นจะประกอบด้วยแท็บที่จะปรากฏในส่วนบนของหน้าเว็บซึ่งจะใช้ในการเข้าไปจัดการโปรเจค (My Projects) ส่วนการออกแบบ (Design) ส่วนการเรียนรู้คำสั่ง (Learn) ในหน้าจอการจัดการโปรเจคดังภาพ 2 จะสามารถเข้าไปจัดการสร้าง ลบ ดาวน์โหลด หรือเลือกโปรเจคที่สร้างและได้ทำการบันทึกไว้เพื่อกลับมาแก้ไขในหน้าจอส่วนการออกแบบได้

ภาพ 3 หน้าจอส่วนคอมโพเนนท์ที่มีให้เลือก

ภาพ 4 หน้าจอการออกแบบ (Viewer) ในส่วนหน้าจอการออกแบบ ปุ่มที่อยู่ทางด้านบนจะใช้เพื่อการบันทึกโปรเจคในลักษณะต่างๆ การเพิ่มและลบหน้าจอ Screen ปุ่มสำหรับการเปิดส่วนการเขียนโค้ด (Open the Blocks Editor) และการจัดแพ็คเกจแอพพลิเคชันเพื่อนำไปใช้งานบนโทรศัพท์ระบบปฏิบัติการ Android ต่อไป ในการสร้างแอพพลิเคชันที่หน้าจอส่วนการออกแบบนี้ ผู้ใช้จะเลือกคอมโพเนนท์ที่อยู่ทางด้านซ้ายของหน้าจอดังภาพ 3 คลิกลากเพื่อนำมาวางลงในส่วน Viewer ที่อยู่ตรงกลางหน้าจอดังภาพ 4 หลังจากนั้นคอมโพเนนท์ที่เลือกนำมาวางจะปรากฏในส่วน Viewer ตามมุมมองของผู้ใช้ซึ่งสามารถเลือกจัดวางลงในตำแหน่งที่เหมาะสมได้ตามต้องการ และคอมโพเนนท์นั้นยังปรากฏในส่วนรายการคอนโพเนนท์ (Components) ดังภาพ 5 เรียงกันเป็นรายการเพื่อให้ดูง่ายและสามารถเลือกคอมโพเนนท์ที่ต้องการกำหนดคุณสมบัติจากรายการนี้แล้วกำหนดคุณสมบัติต่างๆ ที่หน้าจอส่วนคุณสมบัติ (Properties) ดังภาพ 6 ซึ่งจะเป็นคุณสมบัติเฉพาะของคอมโพเนนท์นั้นๆ

ภาพ 5 หน้าจอส่วนคอมโพเนนท์ (Components) ที่เลือกนำมาใช้ในโปรเจค

ภาพ 6 หน้าจอส่วนคุณสมบัติของคอมโพเนนท์ (Properties) นอกจากในกลุ่มของคอมโพเนนท์ทั่วไปแล้วยังมีคอมโพเนนท์ที่มองไม่เห็น (Non-Visible Components) ซึ่งเมื่อนำมาวางในหน้าจอ Viewer แล้วจะไม่ปรากฎคอมโพเนนท์ดังกล่าวที่หน้าจอ Viewer แต่จะปรากฏที่หน้าจอรายการคอมโพเนนท์แทน คอมโพเนนท์ที่มองไม่เห็นนี้จะประกอบไปด้วยคอมโพเนนท์ในกลุ่ม Sersors ซึ่งประกอบไปด้วยคอมโพเนนท์ที่เกี่ยวข้องกับการเรียกใช้ตัวตรวจจับต่างๆ ที่มีอยู่ในโทรศัพท์ เช่น ระบบ GPS หรือ Accelerometers เป็นต้น กลุ่ม Notifiers ซึ่งเกี่ยวข้องกับความสามารถในการแจ้งเตือนต่างๆ หรือการเขียนบันทึกกิจกรรมของโทรศัพท์ ซึ่งคอมโพเนนท์ในกลุ่ม Notifiers นั้นจะมองไม่เห็นหรือถูกซ่อนไว้ แต่จะสามารถมองเห็นได้เมื่อเกิดการแจ้งเตือนหรือสอบถามโดยมีการโต้ตอบกับผู้ใช้ในรูปของข้อความ เสียง ปุ่ม หรือช่องสำหรับกรอกข้อมูล ที่จะแสดงให้ผู้ใช้เห็นเป็นครั้งคราวเท่านั้น กลุ่ม Clocks ซึ่งเกี่ยวข้องกับฟังก์ชันของเวลา ตัวจับเวลา และการตั้งค่าเวลา กลุ่ม ActivityStarters ซึ่งเกี่ยวข้องกับการสั่งให้แอพพลิเคชั่นอื่นที่ติดตั้งอยู่ในโทรศัพท์ทำงาน เช่น โปรแกรมอ่านบาร์โค้ด (barcode scanner) หรือโปรแกรมอ่านออกเสียงจากข้อความ (text to speech) เป็นต้น กลุ่ม Web Services เช่น คอมโพเนนท์เกี่ยวกับเกมส์ออนไลน์ (Game Client) คอมโพเนนท์เกี่ยวกับฐานข้อมูลบนเว็บ และคอมโพเนนท์เกี่ยวกับการใช้บริการ Twitter เป็นต้น

อ้างอิงจาก: http://programmingappinventor.wordpress.com/%E0%B8%A3%E0%B8%B9%E0%B9%89%E0%B8%88%E0%B8%B1%E0%B8%81%E0%B8%81%E0%B8%B1%E0%B8%9A-app-inventor/%E0%B8%AA%E0%B9%88%E0%B8%A7%E0%B8%99%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%81%E0%B8%AD%E0%B8%9A%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B9%82%E0%B8%9B%E0%B8%A3%E0%B9%81%E0%B8%81%E0%B8%A3%E0%B8%A1-app-inventor/