เอกสารประกอบการใช้งาน การพฒั นาแอพพลเิ คชนั่ บนอปุ กรณ์แอนดรอยด์ สาํ หรบั ผเู้ รม่ิ ตน้ จดั ทําโดย ธวชั ชยั สีลาดเลา AppInventorthai “ เนือ้ หาหรือข้อมลู ตา่ งๆท่ปี รากฏในคมู่ ือเลม่ นเี ้ป็ นเพยี งการนาํ เนอื ้ หา ข้อมลู ขา่ วสาร และความรู้ของผ้เู ขียนทม่ี อี ยอู่ ยา่ งจํากดัซง่ึ อาจจะมีความผิดพลาดในเนือ้ หาและความแตกตา่ งกนั บ้าง ในการนาํ ไปใช้งาน ซง่ึ ผ้เู ขยี นมไิ ด้มีเจตนาให้เกิดขนึ ้ ความเสยี หายตา่ งๆสารบญัท่ีเกิดขนึ้ จากการนาํ บทความนีไ้ ปใช้งาน ผ้เู ขียนมไิ ด้มีหน้าที่รับผิดชอบโดยตรง แตจ่ ะพยายามแก้ไขปรับปรุงเนือ้ หาให้รัดกมุ มากขนึ้คมู่ อื เลม่ นไี ้ มไ่ ด้สงวนสทิ ธิ์ในการคดั ลอก ดดั แปลง ทาํ ซาํ ้ แตป่ ระการใด ”
สารบญั แนะนํา App Inventor การตดิ ตงั้ JAVA การตดิ ตงั้ โปรแกรม AppInventor การสมคั ร Google Account การสรา้ งโปรเจค็ ดาวน์โหลด อพั โหลด Screen Arrangement Components การสรา้ งไฟลส์ าํ หรบั ตดิ ตงั้ Android Application Package file (APK) การตดิ ตงั้ แอพพลเิ คชนั ่ บนอุปกรณ์แอนดรอยด์ ตดิ ตงั้ โปรแกรมผา่ น USB Storage Device ตดิ ตงั้ โปรแกรมผา่ น ADB (Android Debug Bridge) ตดิ ตงั้ โปรแกรมผา่ น Wi-Fi เรมิ่ ตน้ กบั Hello World AppInventor กบั การสอ่ื สารแบบไรส้ าย Bluetooth เขยี นโปรแกรมตดิ ตอ่ กบั คอมพวิ เตอร์ เขยี นโปรแกรมเพอ่ื ควบคุมการทาํ งานของหุน่ ยนต์ App Inventor กบั การทาํ งานแบบออฟไลน์ (OFFLINE)
แอนดรอยด์ ( android) เป็นระบบปฏบิ ตั กิ ารสําหรบั อุปกรณ์พกพา เช่น โทรศพั ท์มอื ถือสมารต์ โฟน แทบ็ เลต็ คอมพวิ เตอร์ เน็ตบุ๊ก ทํางานบนลนิ ุกซ์ เคอรเ์ นล เรม่ิ พฒั นาโดยบรษิ ทั แอนดรอยด์(องั กฤษ: Android Inc.) จากนัน้ บรษิ ทั แอนดรอยดถ์ ูกซอ้ื โดยบรษิ ทั กูเกล้ิ และนําแอนดรอยดไ์ ปพฒั นาต่อ ภายหลงั ถูกพฒั นาในนามของ Open Handset Alliance ทางกูเก้ลิ ไดเ้ ปิดใหน้ กั พฒั นาสามารถแก้ไขโคด้ ต่างๆ ดว้ ยภาษาจาวา และควบคุมอุปกรณ์ผา่ นทางชุด Java libraries ทก่ี เู กล้ิ พฒั นาขน้ึ แอนดรอยด์ไดเ้ ป็นท่รี ูจ้ กั ต่อสาธารณชนเม่อื วนั ท่ี 5 พฤศจกิ ายน พ.ศ. 2550 โดยทางกูเก้ลิ ได้ประกาศก่อตงั้ Open Handset Alliance กลุ่มบรษิ ทั ฮารด์ แวร,์ ซอฟต์แวร์ และการส่อื สาร 48 แห่ง ท่ีรว่ มมอื กนั เพอ่ื พฒั นา มาตรฐานเปิด สาํ หรบั อุปกรณ์มอื ถอื ลขิ สทิ ธขิ ์ องโคด้ แอนดรอยดน์ ้ีจะใชใ้ นลกั ษณะของซอฟตแ์ วรเ์ สรี โทรศัพท์เคร่ืองแรกท่ีสามารถใช้งานระบบปฏิบัติการแอนดรอยด์ได้คือ HTC Dreamออกจาํ หน่ายเมอ่ื 22 ตุลาคม 2551 เวอรช์ นั ล่าสุดของแอนดรอยด์คอื 4.2 (Jellybean) ความสามารถใหม่ของ แอนดรอยด์ 4.2 ท่ีเพมิ่ ขน้ึ มาคอื Photo Sphere ทส่ี ามารถถ่ายรปู ได้ 360 องศา และ Keyboard Gestures ทส่ี ามารถลากน้ิวแทนการสมั ผสั ตวั อกั ษรได้ เริ่มต้นพฒั นาแอพพลิเคชนั ่ บนระบบปฏิบตั ิการแอนดรอยด์ ด้วย AppInventor ในปจั จุบนั โทรศพั ทเ์ คล่อื นทแ่ี ละแทบ็ เลต็ ทใ่ี ชร้ ะบบปฏบิ ตั กิ ารแอนดรอยด์นนั้ มจี าํ นวนมากมายหลายรนุ่ หลายยห่ี อ้ ใหเ้ ลอื กใชง้ าน และคาดว่าในอนาคตจะมกี ารใชง้ านเพม่ิ มากขน้ึ เรอ่ื ยๆ ซง่ึ เป็นผลให้นักพฒั นาแอพพลเิ คชนั่ จาํ เป็นต้องพฒั นาแอพพลเิ คชนั่ เพ่อื ให้สามารถตอบสนองความต้องการของผู้ใช้ได้อย่างเพยี งพอ แต่เน่ืองจากแอพพลเิ คชนั่ บนระบบปฏบิ ตั ิการแอนดรอยด์นัน้ ถูกพฒั นาขน้ึ ด้วยโปรแกรมภาษาจาวา ซง่ึ เป็นเรอ่ื งยากสําหรบั นักพฒั นาแอพพลเิ คชนั่ มอื ใหม่ ทอ่ี ยากจะเรยี นรเู้ กย่ี วกบัเรอ่ื งของการเขยี นโปรแกรม ดงั นนั้ ทางบรษิ ทั กูเกล้ิ จงึ ไดพ้ ฒั นาโปรแกรมทช่ี ่อื ว่า App Inventor เพ่อื ใช้เป็นเคร่อื งมอื ในการพฒั นาแอพพลเิ คชนั่ บนมอื ถอื ระบบปฏบิ ตั กิ ารแอนดรอยด์ แต่ในปจั จุบนั ทางกูเก้ลิไดส้ ่งมอบ AppInventor ใหอ้ ย่ใู นการควบคุมดูแลของสถาบนั MIT (Massachusetts Institute ofTechnology) จนถงึ ปจั จบุ นั AppInventor ภายใตก้ ารควบคุมดแู ลของ MIT ไดม้ กี ารพฒั นาเคร่อื งมอื ของAppInventor ขน้ึ มาอย่างต่อเน่ือง โดย AppInventor นนั้ ถูกออกแบบมาเพ่อื ใหง้ า่ ยต่อการใชง้ าน โดยอาศยั หลกั การทาํ งานผ่านระบบเครอื ขา่ ยอนิ เตอรเ์ น็ตเป็นหลกั ซง่ึ ใชเ้ วบ็ บราวเซอรใ์ นการทํางานรว่ มกบัเวบ็ เซฟิ เวอร์ แอพพลเิ คชนั่ ทถ่ี ูกพฒั นาจะถูกจดั เก็บไว้ในเคร่อื งคอมพวิ เตอรเ์ ซฟิ เวอร์ ซง่ึ เวลาท่เี ราเรยี กใชง้ าน จะตอ้ งเขา้ ไปทเ่ี วบ็ ไซด์ appinventor.mit.edu/ เพ่อื ทจ่ี ะนําแอพพลเิ คชนั่ ทส่ี รา้ งขน้ึ มาแก้ไข และพฒั นาต่อได้ ถือเป็นอกี หน่ึงแนวทางในการพฒั นาแอพพลเิ คชนั่ บนมอื ถือรูปแบบใหม่ ท่ีน่าสนใจ และสามารถใชเ้ ป็นพน้ื ฐานในการเรยี นรแู้ ละพฒั นาแอพพลเิ คชนั่ ขนั้ สงู ต่อไป
ไดอะแกรมแสดงการทาํ งานของ AppInventorAppInventor สามารถติดต่อกบั อปุ กรณ์ภายในและอปุ กรณ์ภายนอก
Block Diagram แสดงส่วนประกอบของแอพพลิเคชนั ่กระบวนการในการพฒั นาแอพพลิเคชนั่ ด้วย AppInventor 1. ติดตงั้ JAVA JRE 2. ติดตงั้ โปรแกรม App Inventor 3. ออกแบบและเขียนคาํ สงั ่ ด้วย AppInventor 4. ติดตงั้ แอพพลิเคชนั ่ ลงบนอปุ กรณ์แอนดรอยด์
ติดตงั้ JAVA JRE เคร่อื งมอื ตวั แรกทจ่ี าํ เป็นต้องตดิ ตงั้ ลงบนคอมพวิ เตอร์ คอื Java jre ซง่ึ จะทาํ หน้าทใ่ี นการเปิดไฟลท์ ไ่ี ดจ้ ากการดาวน์โหลดจากเวบ็ ไซด์ appInventor.mit.edu ซง่ึ สามารถตดิ ตงั้ และใชง้ านไดต้ งั้ แต่เวอร์ชัน่ 6 ข้ึนไป แต่แนะนําให้ใช้งาน เวอร์ชัน่ ล่าสุดซ่ึงสามารถดาวน์โหลดได้จากเว็บไซด์www.java.com ในค่มู อื จะอา้ งองิ Java เวอรช์ นั่ 7u21 การติดตงั้ โปรแกรมจาวาสามารถทาํ ได้ 2 วิธีด้วยกนั คือ 1. ติดตงั้ ผา่ นเวบ็ ไซด์ (web installer) 2. ติดตงั้ แบบออฟไลน์ (offline install ) 1) ติดตงั้ ผา่ นเวบ็ ไซด์ (web installer) จาํ เป็นตอ้ งมกี ารเช่อื มต่อกบั เครอื ขา่ ยอนิ เตอรเ์ น็ตอยู่ตลอดจนกว่าการตดิ ตงั้ จะสาํ เรจ็ โดยมขี นั้ ตอนการดาวน์โหลดและตดิ ตงั้ ดงั น้ี หลงั จากท่เี ขา้ สู่เวบ็ ไซด์จะปรากฏหน้าต่างหลกั ของเวบ็ ไซด์ดงั ภาพ ให้เราคลกิ เลอื กท่ี FreeJava Download เพอ่ื ทาํ การดาวน์โหลดและตดิ ตงั้ Java ลงในเครอ่ื งคอมพวิ เตอร์
จากนนั้ คลกิ เพ่อื ยอมรบั ขอ้ ตกลงในการดาวน์โหลดรอสกั ครู่ ระบบจะทาํ การตดิ ตงั้ โปรแกรมบนระบบปฏบิ ตั ทิ เ่ี ราใชโ้ ดยอตั โนมตั ิเมอ่ื โปรแกรมถกู ตดิ ตงั้ เรยี บรอ้ ยแลว้ กค็ ลกิ ทป่ี มุ่ Close เพ่อื ปิดหน้าต่างน้ีไดเ้ ลย
2) ติดตงั้ แบบออฟไลน์ (offline install ) กค็ อื การดาวน์โหลดไฟลต์ ดิ ตงั้ มาเกบ็ ไวใ้ นเครอ่ื งคอมพวิ เตอรก์ ่อน และทําการตดิ ตงั้ ภายหลงั สามารถดาวน์โหลดไฟลจ์ าวาสําหรบั ใชใ้ นการตดิ ตงั้ ได้ท่ีhttp://java.com/en/download/manual.jspหลงั จากทาํ การดาวน์โหลดไฟลต์ ดิ ตงั้ ของจาวาเสรจ็ เรยี บรอ้ ยแลว้ จะไดไ้ ฟลส์ าํ หรบั ตดิ ตงั้ ดงั ภาพ • ไฟล์ jre-7u21-windows-i586 ใชส้ าํ หรบั ใชต้ ดิ ตงั้ บนระบบปฏบิ ตั กิ ารวนิ โดวส์ 32 bit • ไฟล์ jre-7u21-windows-x64 ใชส้ าํ หรบั ใชต้ ดิ ตงั้ บนระบบปฏบิ ตั กิ ารวนิ โดวส์ 64 bitก่อนทาํ การตดิ ตงั้ โปรแกรมใหเ้ ลอื กไฟลต์ ดิ ตงั้ ใหต้ รงกบั ความต้องการของระบบปฏบิ ตั กิ ารคอมพวิ เตอร์ทใ่ี ช้ จากนนั้ ดบั เบล้ิ คลกิ ไฟลท์ ต่ี อ้ งการ และคลกิ ไปท่ี Install
จากนนั้ จะเขา้ ส่กู ระบวนการตดิ ตงั้ โปรแกรม อาจตอ้ งใชเ้ วลาสกั ครู่ ขน้ึ อยกู่ บั ความเรว็ ของเครอ่ื งคอมพวิ เตอรด์ ว้ ยโปรแกรม Java Jre ถูกตดิ ตงั้ บนคอมพวิ เตอรเ์ รยี บรอ้ ยแลว้
การติดตงั้ โปรแกรม AppInventor เรม่ิ ตน้ เขา้ ไปท่ี http://www.appinventor.mit.edu/ เป็นเวบ็ ไซดห์ ลกั ในการเขา้ ใชง้ านโปรแกรม และดาวน์โหลดโปรแกรมสําหรบั ตดิ ตงั้ ลงบนคอมพวิ เตอร์เราสามารถเขา้ ไปดาวน์โหลดไฟลโ์ ปรแกรมไดฟ้ รี โดยคลกิ ไปท่ี Explore หรอื คลกิ ท่ี Welcome to MITApp Inventor http://appinventor.mit.edu/explore/
หลงั จากนนั้ คลกิ เลอื กทห่ี วั ขอ้ Setupคอมพิวเตอรแ์ ละระบบปฏิบตั ิการท่ีใช้Macintosh (with Intel processor): Mac OS X 10.5, 10.6Windows: Windows XP, Windows Vista, Windows 7GNU/Linux: Ubuntu 8+, Debian 5+โปรแกรมเวบ็ บราวเซอรต์ ่างๆ ที่จาํ เป็นต้องใช้Mozilla Firefox 3.6 หรอื สงู กว่า ***Apple Safari 5.0 หรอื สงู กว่า ***Google Chrome 4.0 หรอื สงู กวา่ ***Microsoft Internet Explorer 7 หรอื สงู กวา่*** แนะนําใหใ้ ชโ้ ปรแกรมบราวเซอรเ์ วอรช์ นั่ ลา่ สุดในปจั จบุ นั
ขนั้ ตอนต่อไปเป็นขนั้ ตอนการตดิ ตงั้ โปรแกรม AppInventorทต่ี ําแหน่งดา้ นล่างของเวบ็ เพจ http://explore.appinventor.mit.edu/content/setup จะบอกถงึ ขนั้ ตอนการตดิ ตงั้ โปรแกรม AppInventor ทส่ี ามารถทํางานไดบ้ นระบบปฏบิ ตั กิ ารต่างๆ ไมว่าจะเป็น Mac OS,Linux และ Windowsโดยในทน่ี ้ีผมจะขออธบิ ายเฉพาะการตดิ ตงั้ โปรแกรมบนระบบปฏบิ ตั กิ าร Windows เท่านัน้ โดยคลกิเลอื กไปท่ี Instructions for Windows
คลกิ เพ่อื ดาวน์โหลดโปรแกรมเพอ่ื ใชใ้ นการตดิ ตงั้ หลงั จากดาวน์โหลดเสรจ็ เรยี บรอ้ ย จะไดไ้ ฟลช์ อ่ื วา่AppInventor_Setup_Installer_v_1_2.exeไฟลโ์ ปรแกรมตดิ ตงั้ ของ AppInventor ทไ่ี ดจ้ ากการดาวน์โหลด หลงั จากนัน้ ดบั เบล้ิ คลกิ เพอ่ื ทาํ การตดิ ตงั้ โปรแกรมคลกิ Next เพ่อื เขา้ สขู่ นั้ ตอนถดั ไปคลกิ I Agree เพ่อื ยอมรบั ขอ้ ตกลงในการเขา้ ใชง้ านโปรแกรม AppInventor
เลอื กตาํ แหน่งสาํ หรบั ตดิ ตงั้ โปรแกรม แนะนําใหใ้ ชค้ ่าปกตทิ โ่ี ปรแกรมตงั้ ไวใ้ ห้คลกิ ทป่ี มุ่ Install เพอ่ื ทาํ การตดิ ตงั้ โปรแกรม
การตดิ ตงั้ โปแกรม AppInventor อาจจะตอ้ งใชเ้ วลาระยะหน่ึง ขน้ึ อยกู่ บั ความแรงของเคร่อื งคอมพวิ เตอร์หลงั จากโปรแกรมทาํ การตดิ ตงั้ เสรจ็ เรยี บรอ้ ยแลว้ จะปรากฏหน้าต่างดงั ภาพ ใหค้ ลกิ ท่ี Finish เพ่อื เสรจ็สน้ิ กระบวนการตดิ ตงั้ โปรแกรมการตดิ ตงั้ โปรแกรม AppInventor นนั้ หลงั จากตดิ ตงั้ เสรจ็ จะมไี ดรเวอรข์ องโทรศพั ทม์ อื ถอื บางรนุ่ ตดิ ตงั้มาใหพ้ รอ้ มบนคอมพวิ เตอร์ เชน่ • T-Mobile G1* / ADP1 • T-Mobile myTouch 3G* / Google Ion / ADP2 • Verizon Droid (not Droid X) • Nexus One • Nexus Sสาํ หรบั ผทู้ ่ีใช้อปุ กรณ์แอนดรอยด์ สามารถดาวน์โหลดไดรเวอรแ์ บบ OEM ได้ฟรีที่http://developer.android.com/sdk/oem-usb.html
หลงั จากทเ่ี ราไดท้ ําการตดิ ตงั้ โปรแกรม และตงั้ ค่าการใชง้ านรว่ มกนั ระหว่างโทรศพั ทม์ อื ถอื แอนดรอยดร์ ว่ มกบั คอมพวิ เตอรเ์ รยี บรอ้ ยแลว้ ขนั้ ตอนต่อไปเป็นขนั้ ตอนในการพฒั นาแอพพลเิ คชนั่ ก่อนอ่นื เปิดโปรแกรมเวบ็ บราวเซอรแ์ ละไปทเ่ี วบ็ ไซด์ http://www.appinventor.mit.edu/คลกิ เลอื ก Invent Create Mobile Apps ทอ่ี ยบู่ รเิ วณดา้ นบนขวามอืจะปรากฏหน้าต่าง LOGIN เพ่อื เขา้ ส่รู ะบบโดยก่อนทเ่ี ราจะทาํ การ Login เพ่อื เขา้ ไปใชง้ านไดน้ ัน้ เราจาํ เป็นตอ้ งมี Google Account เพ่อื ใชใ้ นการLogin เขา้ สรู่ ะบบเสยี ก่อน ถา้ ยงั ไมม่ ใี หเ้ ขา้ ไปลงทะเบยี น Google Account เสยี ก่อน
การสมคั ร Google Account เพื่อลงชื่อเข้าใช้งาน AppInventor ในการเขา้ ใช้งาน App Inventor นัน้ มคี วามจําเป็นต้องลงช่อื ในการเขา้ ใช้งานก่อน จงึ จะสามารถใชง้ านได้ โดยในทน่ี ้ีเราสามารถใชช้ ่อื บญั ชจี ากทาง Google ซง่ึ กค็ อื Google Account นนั่ เองและนอกจากน้ียงั สามารถใช้ Gmail Accounts ในการเขา้ ใชง้ านได้ ซง่ึ ถา้ ผใู้ ชม้ บี ญั ชขี อง Google อยู่แลว้ หรอื ว่ามี Gmail อย่แู ลว้ กส็ ามารถลงช่อื เขา้ ใช้งาน AppInventor ไดเ้ ลย โดยไม่จาํ เป็นตอ้ งสมคั รบญั ชผี ูใ้ ช้ใหม่ แต่สําหรบั ผู้ท่ยี งั ไม่มบี ญั ชผี ู้ใชง้ านของ Google ก็สามารถสมคั รใหม่ได้ตามขนั้ ตอนต่อไปน้ีขนั้ ตอนการสมคั รเพ่ือขอใช้ Google Accountเรมิ่ ตน้ ไปท่ี URL https://accounts.google.com/ จะปรากฏหน้าจอดงั ภาพคลกิ ทส่ี มคั รใชง้ าน
สาํ หรบั ผสู้ รา้ งบญั ชี Google ใหม่ ใหก้ รอกรายละเอยี ดและขอ้ มลู ทจ่ี าํ เป็น ใหถ้ กู ตอ้ งและครบถว้ นหลงั จากสรา้ งบญั ชผี ใู้ ชง้ านเสรจ็ เรยี บรอ้ ยแลว้ กจ็ ะไดบ้ ญั ชที ส่ี ามารถนําไปใชใ้ นการ Login เพอ่ื เขา้ ใช้งานโปรแกรม AppInventor ไดแ้ ลว้
ทดสอบการเขา้ ใชง้ าน AppInventor โดยพมิ พ์ URL ไปท่ี http://appinventor.mit.edu จากนัน้ จะปรากฏหน้าหลกั ของ App Inventor ดงั ภาพ คลกิ เลอื กทห่ี วั ขอ้ Invent เพอ่ื เขา้ ใชง้ าน AppInventorจากนนั้ ทําการลงช่อื เพอ่ื เขา้ ใชง้ าน AppInventorหลงั จากลงช่อื เขา้ ใช้งานเสรจ็ เรยี บรอ้ ยแลว้ จะปรากฏหน้าต่างดงั ภาพ แสดงว่าเราสามารถเขา้ ใช้งานโปรแกรม AppInventor ไดแ้ ลว้
การสร้างโปรเจค็ ใหม่ ขนั้ ตอนการสรา้ งโปรเจค็ ใหมส่ ามารถไดง้ ่ายๆ เพยี งคลกิ ท่ี My Projects จากนัน้ คลกิ ท่ี Newตงั้ ช่อื ไฟลต์ ามตอ้ งการ แต่จะตอ้ งไมม่ สี ญั ลกั ษณ์และอกั ขระพเิ ศษ จากนัน้ คลกิ ท่ี OK แค่น้ีเรากจ็ ะได้โปรเจค็ ใหมข่ น้ึ มาแลว้หลกั จากสรา้ งโปรเจค็ ใหมเ่ รยี บรอ้ ย โปรแกรม AppInventor จะเขา้ สหู่ น้าต่างการออกแบบโดยอตั โนมตั ิ
การดาวน์โหลดซอรส์ โคด๊ ไฟลโ์ ปรเจค็ ทถ่ี ูกสรา้ งขน้ึ และพฒั นาอย่นู ัน้ เราสามารถทําการดาวน์โหลดเพ่อื เกบ็ ไฟลน์ ัน้ ไวใ้ ช้ในการพฒั นาต่อไปได้ อกี ทงั้ ยงั สามารถนําไฟลท์ ไ่ี ดไ้ ปใชก้ บั คอมพวิ เตอรเ์ คร่อื งอ่นื ไดด้ ว้ ย ขนั้ ตอนดาวน์โหลดทําได้ง่ายๆดงั น้ีคอื คลกิ เลอื กท่ี My Project จากนัน้ ทําเครอ่ื งหมายถูกหน้าโปรเจค็ ทต่ี ้องการเสรจ็ แลว้ คลกิ ทห่ี วั ขอ้ More Actions จากนนั้ เลอื ก Download Source เพอ่ื เรม่ิ การดาวน์โหลดหลงั จากดาวน์โหลดไฟล์โปรเจค็ ท่ตี ้องการเป็นท่เี รยี บร้อยแล้ว ไฟล์ท่ไี ด้จะเป็นไฟล์ท่ีถูกบบี อดั (ZIP)เอาไว้ ซง่ึ สามารถนําไปใชง้ านต่อได้ โดยขนั้ ตอนของการอพั โหลดการอพั โหลดซอรส์ โคด๊ การอพั โหลดซอรส์ โค๊ดนนั้ จะเป็นการนําไฟลโ์ ปรเจค็ ทเ่ี ราไดจ้ ดั เกบ็ เอาไว้ มาใชง้ าน เพ่อื แก้ไขหรอื พฒั นาต่อ โดยไฟล์ท่จี ะทําการอพั โหลดได้นัน้ จะเป็นไฟลท์ ่ถี ูกบบี อดั (ZIP) โดยมขี นั้ ตอนดงั น้ีคอืเรมิ่ ตน้ ไปท่ี My Projects จากนนั้ ทห่ี วั ขอ้ More Actions คลกิ เลอื กไปท่ี Upload Source เพ่อื ทําการอพัโหลด
จะปรากฏหน้าต่างสาํ หรบั เลอื กไฟลท์ ต่ี อ้ งการจะอพั โหลด คลกิ ท่ี Choose File จากนนั้ เลอื กไฟลท์ ่ีตอ้ งการจะอพั โหลด เสรจ็ แลว้ คลกิ OPEN และ OK ตามลาํ ดบัหลงั จากทไ่ี ดท้ าํ การอพั โหลดไฟลเ์ สรจ็ สน้ิ แลว้ จากนนั้ กจ็ ะเขา้ ส่หู น้าต่างของการพฒั นาต่อไป
เริ่มต้นเขียนโปรแกรมกบั Hello World หลงั จากทท่ี าํ ความรจู้ กั กบั AppInventor มาพอสมควรแลว้ แต่ไปเราจะสรา้ งโปรแกรมตวั แรกกนั กบั โปรแกรม Hello World สรา้ งโปรเจค็ ขน้ึ มาใหม่ แลว้ ตงั้ ช่อื ตามตอ้ งการ ในทน่ี ้ตี งั้ ช่อื เป็น Hello Worldนําเครอ่ื งมอื ทต่ี อ้ งการใชง้ าน ซง่ึ ประกอบดว้ ย Label และ Button ลากแลว้ วางบนพน้ื ทว่ี ่างบรเิ วณหน้าจอออกแบบ
คลกิ ท่ี Open Blocks Editor เพ่อื เปิดโปรแกรม blocks editor ขน้ึ มา เพ่อื ใชส้ าํ หรบั เขยี นคาํ สงั่ การทาํ งานใหก้ บั โปรแกรมจะปรากฏชอ่ื ไฟล์ AppInventorForAndroid.jnlp ใหค้ ลกิ ทป่ี มุ่ Keep เพ่อื ดาวน์โหลดและจดั เกบ็ ไฟลท์ ่ีไดล้ งบนคอมพวิ เตอร์ ในกรณนี ้ีเป็นการใชง้ านบราวเซอร์ Google Chromeจากนนั้ คลกิ ทช่ี ่อื ไฟลท์ ด่ี าวน์โหลดเสรจ็ แลว้ เพอ่ื เรยี กใชง้ านโปรแกรม blocks editor ขน้ึ มา ไฟลท์ ไ่ี ดจ้ ากการดาวน์โหลด**** ในกรณที บ่ี ราวเซอรเ์ ป็น Internet Explorer จะปรากฏหน้าต่างดงั ภาพ ซง่ึ เราสามารถคลกิ ทป่ี ุ่มSave เพอ่ื จดั เกบ็ ไฟลเ์ อาไวก้ ่อน หรอื จะคลกิ ทป่ี ุ่ม Open เพอ่ื เปิดไฟล์ กไ็ ดเ้ ชน่ กนั**** ในกรณที บ่ี ราวเซอรเ์ ป็น Firefox จะปรากฏหน้าต่างดงั ภาพ ใหค้ ลกิ ไปทป่ี มุ่ ตกลง จะเป็นการดาวน์โหลดไฟลแ์ ละเรยี กโปรแกรม Block Editor ขน้ึ มา
เลอื กบลอ็ กทต่ี อ้ งการ ในทน่ี ้ีคอื Button. Click จากนนั้ ลากไปวาง ทอ่ี ยใู่ นเครอ่ื งมอื Button มาวางบรเิ วณพน้ื ทว่ี ่างหลงั จากลากมาวางเรยี บรอ้ ยแลว้ จะปรากฏดงั ภาพคลกิ ลากเครอ่ื งมอื Label1.Text ไปไวใ้ นบลอ็ ก Button1.Click
การลากบลอ็ กไปวางต่อกนั นนั้ จะตอ้ งวางใหไ้ ดล้ งตวั พอดกี บั บลอ็ กอ่นื มเิ ชน่ นนั้ โปรแกรมจะไมส่ ามารถทาํ งานได้ ดงั ภาพคลกิ เลอื กเครอ่ื งมอื Text วางต่อทา้ ย Label1.Text เพอ่ื ใชใ้ นการแสดงขอ้ ความจากภาพสามารถอธบิ ายการทาํ งานไดด้ งั น้คี อื เมอ่ื คลกิ ทป่ี มุ่ Button 1 แลว้ ขอ้ ความ text จะแสดงขน้ึแทนทต่ี าํ แหน่งของ Label1
เราสามารถแกไ้ ขขอ้ ความทเ่ี ครอ่ื งมอื text ไดต้ ามตอ้ งการ ในทน่ี ้ีใหต้ งั้ ช่อื ว่า Hello World
จาํ ลองการทาํ งานของโปรแกรมด้วย Emulator หลงั จากเขยี นคาํ สงั่ ใหก้ บั โปรแกรมเสรจ็ เรยี บรอ้ ยแลว้ ขนั้ ตอนต่อไปจะเป็นการทดสอบการทาํ งานของโปรแกรม โดยจะใชว้ ธิ กี ารจาํ ลองการทาํ งานของโปรแกรม ซง่ึ สามารถทาํ โดยการคลกิ เลอื กไปท่ี New emulatorรอสกั ครู่ จะปรากฏหน้าต่าง emulator ขน้ึ มา เพ่อื จาํ ลองการทาํ งานของโปรแกรมทเ่ี ราไดส้ รา้ งขน้ึ
ยอ้ นกลบั ไปท่ี Block Editor ใหท้ าํ การคลกิ ไปท่ี emulator เพอ่ื เช่อื มต่อโปรแกรมใหไ้ ปแสดงผลการทาํ งานทห่ี น้าต่าง emulatorเมอ่ื โปรแกรมทาํ การเช่อื มต่อกบั emulator เป็นทเ่ี รยี บรอ้ ยแลว้ กจ็ ะแสดงหน้าตาโปรแกรมทเ่ี ราไดท้ าํการออกแบบไว้จากนนั้ เรมิ่ ตน้ ทดสอบการทาํ งานของโปรแกรม โดยการคลกิ ทป่ี มุ่ Button1 กจ็ ะมขี อ้ ความ Hello Worldปรากฏขน้ึ แทนทข่ี อง
การอพั โหลดไฟลม์ ลั ติมีเดีย การพฒั นาแอพพลเิ คชนั่ นัน้ สงิ่ ทส่ี าํ คญั และขาดไม่ไดเ้ ลยอยา่ งหน่ึงกค็ อื การใชง้ านไฟลป์ ระเภทมลั ติมเี ดีย ซ่งึ ประกอบด้วยภาพ และเสยี ง เพราะฉะนัน้ เราจงึ จําเป็นต้องเรยี นรู้หลกั การทํางานในเบ้อื งต้นว่าโปรแกรม AppInventor นัน้ สามารถรองรบั การทํางานของภาพและเสยี งประเภทใดได้บ้างและมขี นั้ ตอนการอพั โหลดไฟลเ์ หล่านนั้ ไปยงั โปรเจค็ งานของเราไดอ้ ยา่ งไร อธบิ ายไดด้ งั น้คี อื • ไฟลภ์ าพทโ่ี ปรแกรม Appinventor รองรบั *.JPG , *.GIF, *.PNG, *.BMP • ไฟลเ์ สยี งรปู แบบต่างๆ ท่ี AppInventor รองรบั *.3GP, *.MP4, *.M4A , *.MP3, *.MID, *.XMF, *.MXMF, *.RTT., *.RTX, *.OTA, *.IMY , *.OGG, *.WAVขนั้ ตอนการอพั โหลดไฟลท์ งั้ ภาพและเสยี งเพ่อื นํามาใชง้ านในโปรแกรมนนั้ มขี นั้ ตอนการทํางานท่ีเหมอื นกนั ดงั น้ีคอื 1. ทเ่ี มนู Media จะเป็นทอ่ี ยขู่ องไฟลต์ ่างๆ ทงั้ ภาพและเสยี งทเ่ี ราไดท้ าํ การอพั โหลดไวใ้ นโปรเจค็ ซง่ึ สามารถอพั โหลดใหมไ่ ดโ้ ดยคลกิ ท่ี Upload new…. 2. จากนนั้ จะปรากฏหน้าต่างสาํ หรบั เลอื กไฟลท์ ต่ี อ้ งการจะอพั โหลด ใหค้ ลกิ ท่ี Choose File
3. เลอื กไฟลต์ ามทต่ี อ้ งการ จากนนั้ คลกิ Open 4. จากนนั้ คลกิ ท่ี OK เพอ่ื ทาํ การอพั โหลดไฟลไ์ ปยงั โปรเจค็ ของเราการอพั โหลดเสรจ็ เรยี บรอ้ ย ระยะเวลาในการอพั โหลดนนั้ ขน้ึ อยกู่ บั ความเรว็ ของอนิ เตอรเ์ น็ตและขนาดของไฟล์ไฟลท์ เ่ี ราไมต่ อ้ งการใชใ้ นโปรเจค็ สามารถทาํ การลบทง้ิ ได้ โดยการคลกิ เลอื กไฟลท์ ต่ี อ้ งการจะลบทง้ิจากนนั้ คลกิ ท่ี Delete
ถา้ ตอ้ งการดาวน์โหลดไฟลท์ ม่ี อี ยใู่ นโปรเจค็ เอามาเกบ็ ไวใ้ นคอมพวิ เตอร์ สามารถทาํ ไดโ้ ดยการคลกิ ท่ีไฟลท์ ต่ี อ้ งการดาวน์โหลด จากนัน้ คลกิ ท่ี Download to my computer เพอ่ื จดั เกบ็ ไฟลท์ ไ่ี ดล้ งบนคอมพวิ เตอร์ตวั อย่างการนําไฟลภ์ าพไปใช้งาน 1. นําเครอ่ื งมอื Button มาวางบนหน้าจอการออกแบบ 2. อพั โหลดไฟลภ์ าพทต่ี อ้ งการใชใ้ นโปรเจค็ น้ี ตวั อยา่ งจะเป็นภาพแมว
3. อพั โหลดไฟลเ์ สยี งทต่ี อ้ งการ ตวั อยา่ งจะเป็นเสยี งรอ้ งของแมว4. จะไดไ้ ฟลภ์ าพและเสยี งเรยี บรอ้ ยแลว้5. คลกิ ท่ี Button1 จากนนั้ ไปท่ี Properties Image เลอื กไฟลท์ ไ่ี ดอ้ พั โหลดไวแ้ ลว้ ช่อื ว่า cat.jpg จากนนั้ คลกิ ท่ี OK
หน้าตาโปรแกรมเราจะไดด้ งั น้ี 6. เลอื กเครอ่ื งมอื ทช่ี ่อื วา่ Sound ในหมวดหมเู่ ครอ่ื งมอื Media จะปรากฏเครอ่ื งมอื ใหเ้ หน็ ดงั ภาพ 7. คลกิ ทเ่ี ครอ่ื งมอื Sound1 จากนนั้ ปรบั ค่า Properties Source เลอื กไฟลท์ ต่ี อ้ งการ ทไ่ี ดอ้ พั โหลด ไวแ้ ลว้ ชอ่ื วา่ cat.wav จากนนั้ คลกิ ท่ี OK
8. เปิดโปรแกรม Block Editor ขน้ึ มา เพอ่ื เขยี นโคด๊ คาํ สงั่ ของโปรแกรม9. ทดสอบการทาํ งานของโปรแกรม ผลลพั ธท์ เ่ี กดิ ขน้ึ คอื ทุกครงั้ ทม่ี กี ารกดปุม่ ซง่ึ ใชภ้ าพแมวแทน ปมุ่ กด กจ็ ะเกดิ มเี สยี งรอ้ งของแมวเกดิ ขน้ึ
การสรา้ งไฟลส์ าํ หรบั ติดตงั้ Android Application Package file (APK) ไฟล์ .apk คอื ตวั แพค็ เกจทร่ี วบรวมไฟลใ์ นการตดิ ตงั้ โปรเเกรมต่างๆบนระบบปฏบิ ตั กิ าร Androidเมอ่ื เปรยี บเทยี บกบั Windows เเลว้ มนั กค็ อื ไฟล์ .exe ทเ่ี อาไวต้ ดิ ตงั้ โปรเเกรมต่างๆ นนั่ เอง การสรา้ งไฟล์ APK ดว้ ยโปรแกรม AppInventor นนั้ สามารถทําได้ 3 วธิ ดี ว้ ยกนั คอื 1. Show Barcode 2. Download to this Computer 3. Download to Connected Phone 1. Show Barcode โปรแกรม AppInventor จะสรา้ งลงิ คส์ าํ หรบั ดาวน์โหลดไฟล์ apk ขน้ึ มาแต่จะเป็นรปู แบบของการแสดงเป็นบารโ์ ค๊ด ซ่งึ การท่เี ราจะอ่านบารโ์ ค๊ดได้นนั้ เราจาํ เป็นต้องใชโ้ ปรแกรม ***Barcode Scanner ทาํ การอ่านรหสั บารโ์ ค๊ดทโ่ี ปรแกรม AppInventor เสยี ก่อน***โปรแกรม Barcode Scanner สามารถดาวน์โหลดโปรแกรม ไดจ้ าก Google Playทเ่ี มนู Package for Phone เลอื กท่ี Show Barcodeโปรแกรมจะทําการสรา้ งไฟล์ APK โดยอาจจะตอ้ งใชร้ ะยะสกั ครู่ ทงั้ น้ขี น้ึ อยกู่ บั ขนาดของไฟลโ์ ปรแกรม
หลงั จากทโ่ี ปรแกรม app inventor สรา้ งไฟล์ APK เรยี บรอ้ ยแลว้ จะปรากฏหน้าต่างแสดงภาพบารโ์ คด๊ขน้ึ มา จากนนั้ ใหเ้ ราเปิดโปรแกรม Barcode Scanner แลว้ ทาํ การอ่านรหสั จากภาพบารโ์ ค๊ดนนั้เมอ่ื ทาํ การอ่านบารโ์ คด๊ เสรจ็ เรยี บรอ้ ยแลว้ จะปรากฏหน้าต่างดงั ภาพ ซง่ึ จะเป็นลงิ คท์ ใ่ี ชใ้ นการเขา้ ไปดาวน์โหลดไฟล์ APK นนั้ เอง
ไฟล์ APK เป็นไฟลท์ ่ี Widows ไมไ่ ดร้ องรบั เรอ่ื งของความปลอดภยั เพราะฉะนัน้ จะมขี อ้ ความขน้ึ มาเพ่อืแจง้ เตอื นเกย่ี วกบั ไฟล์ APK นนั้ ใหเ้ ราคลกิ ทต่ี กลงเพ่อื ยอมรบั และทาํ การดาวน์โหลดไฟลท์ ไ่ี ดจ้ ากการดาวน์โหลดนนั้ จะถูกจดั เกบ็ ไวใ้ นโฟลเดอรด์ าวน์โหลดบนอุปกรณ์แอนดรอยด์ แค่ทงั้ น้ีขน้ึ อยกู่ บั อุปกรณ์แอนดรอยดแ์ ต่ละรนุ่
เราสามารถตดิ ตงั้ โปรแกรมไดโ้ ดยการคลกิ เลอื กทโ่ี ปรแกรม จากนนั้ จะปรากฏหน้าต่างสาํ หรบั ตดิ ตงั้โปรแกรม จากนัน้ เลอื กทต่ี ดิ ตงั้โปรแกรมทเ่ี ราพฒั นาขน้ึ มาดว้ ยโปรแกรม AppInventor ถกู ตดิ ตงั้ ลงบนอุปกรณ์แอนดรอยดข์ องเราเป็นทเ่ี รยี บรอ้ ย
2. Download to this Computer วธิ นี ้เี ป็นวธิ กี ารดาวน์โหลดไฟล์ APK มาเกบ็ ไวท้ ค่ี อมพวิ เตอร์เหมาะสาํ หรบั การนําไฟลไ์ ปตดิ ตงั้ เพอ่ื ใชง้ านในภายหลงัทเ่ี มนู Package for Phone คลกิ เลอื กท่ี Download to this Computerโปรแกรมจะทําการสรา้ งไฟล์ APK โดยอาจจะตอ้ งใชร้ ะยะสกั ครู่ ทงั้ น้ีขน้ึ อยกู่ บั ขนาดของไฟลโ์ ปรแกรมไฟล์ APK ถูกดาวน์โหลดและจบั เกบ็ ลงบนคอมพวิ เตอรเ์ ป็นทเ่ี รยี บรอ้ ยแลว้ 3. Download to Connect Phone วธิ นี ้ีเป็นวธิ ที น่ี ิยมทส่ี ุด เพราะการใชง้ า่ ยคอ่ นขา้ งงา่ ย และสะดวก แต่ก่อนจะใช้งานได้นัน้ จําเป็นต้องติดตัง้ ไดรเวอร์ให้กบั อุปกรณ์แอนดรอยด์เสยี ก่อน เพ่อื ให้คอมพวิ เตอรน์ ัน้ สามารถส่อื สารกบั อุปกรณ์แอนดรอยด์ได้โดยตรงผ่านทาง ADB (Android DebugBridge) ซง่ึ จะทาํ หน้าทด่ี าวน์โหลดและตดิ ตงั้ ไฟล์ APK บนอุปกรณ์แอนดรอยดโ์ ดยตรงเพ่อื ใหส้ ามารถนําไปใชง้ านไดเ้ ลย โดยไมจ่ าํ เป็นตอ้ งมาตดิ ตงั้ ภายหลงั
โปรแกรม AppInventor จาํ เป็นตอ้ งเรยี กใชง้ าน Block Editor เพ่อื ใหท้ าํ การเชอ่ื มต่อกบั อุปกรณ์แอนดรอยดก์ ่อนทจ่ี ะดาวน์โหลดและตดิ ตงั้ โปรแกรมอุปกรณ์แอนดรอยดไ์ มถ่ ูกเช่อื มต่อเปิดโปรแกรม Block Editor ขน้ึ มาแลว้ ทาํ การเช่อื มต่ออุปกรแ์ อนดรอยดไ์ ปยงั คอมพวิ เตอร์ จากนัน้ ทเ่ี มนูConnect to Device ใหค้ ลกิ เลอื กไปยงั อุปกรณ์แอนดรอยดท์ เ่ี ราเช่อื มต่อเอาไว้ โดยสงั เกตทห่ี มายเลขประจาํ ตวั ของเครอ่ื ง 16 หลกั ทแ่ี สดงขน้ึ มา
รอจนกว่าการเช่อื มต่อคอมพวิ เตอรก์ บั อุปกรณ์แอนดรอยดจ์ ะสาํ เรจ็ ดงั ภาพกลบั ไปทห่ี น้าจอการออกแบบแลว้ คลกิ เลอื กท่ี Download to Connected Phoneโปรแกรมจะทาํ การสรา้ งไฟล์ APK จากนนั้ จะดาวน์โหลดและตดิ ตงั้ ไฟล์ APK ลงบนอุปกรณ์แอนดรอยด์โดยอาจจะตอ้ งใชร้ ะยะสกั ครู่ ทงั้ น้ีขน้ึ อยกู่ บั ขนาดของไฟลโ์ ปรแกรมหลงั จากทด่ี าวน์โหลดและตดิ ตงั้ ไฟล์ APK ลงบนอุปกรณ์แอนดรอยดเ์ รยี บรอ้ ยแลว้ จะปรากฏหน้าต่างดงัภาพ จากนนั้ คลกิ ท่ี OK และ Dismiss การทาํ งานของโปรแกรมเสรจ็ เรยี บรอ้ ยแลว้
Screen Arrangement Components เครอ่ื งมอื ทช่ี ่วยในการจดั วางตําแหน่ง ซง่ึ จะใชใ้ นการออกแบบหน้าตาโปรแกรมแบ่งไดเ้ ป็น 3 รปู แบบ ดงั น้ี 1. Horizontal Arrangement การจดั วางเครอ่ื งมอื ต่างในรปู แบบแนวนอน 2. Table Arrangement การจดั วางเครอ่ื งมอื ต่างๆในรปู แบบตาราง 3. Vertical Arrangement การจดั วางเครอ่ื งมอื ต่างๆในรปู แบบแนวตงั้ 1) Horizontal Arrangement การจดั วางรปู แบบของเครอ่ื งมอื ในแนวนอน เครอ่ื งมอื ต่างๆทอ่ี ยภู่ ายใน Horizontal Arrangement จะถูกวางเรยี งต่อๆกนั ในแนวนอน
วางเครอ่ื งมอื Button ไปไวใ้ น Horizontal Arrangement ซง่ึ จะเหน็ ไดว้ ่าเครอ่ื งมอื ทอ่ี ยใู่ น HorizontalArrangement นนั้ จะถูกจดั วางตําแหน่งในรปู แบบของแนวนอนProperties การปรบั แต่งคุณสมบตั ติ ่างๆ กส็ ามารถทาํ ได้ Align Horizontal และ Align Vertical เป็นการจดั รปู แบบเคร่อื งมอื ต่างๆทอ่ี ย่ใู น Horizontal Arrangement ใหม้ ตี ําแหน่งตามตอ้ งการ ค่าปกตขิ อง Align Horizontal จะเป็น Left ชดิ ซา้ ย ซง่ึ สามารถปรบั ให้ Center ก่งึ กลาง หรอื ว่า Right ชดิ ขวา ได้ แต่ก่อนทจ่ี ะปรบั ตําแหน่งให้ กง่ึ กลางหรอื ชดิ ขวาไดน้ นั้ เราจาํ เป็นตอ้ งปรบั ความกวา้ ง Width ใหม้ ขี นาด Pixel ตามทต่ี อ้ งการ หรอื เป็น Fill parent ก่อน Visible การตงั้ ค่าการแสดงผลการทาํ งานของเครอ่ื งมอื สามารถเลอื กไดค้ อื showing แสดงผล hidden ซ่อนไวไ้ มแ่ สดงผล ซง่ึ ในการเขยี นโปรแกรมนนั้ จะใชค้ ําสงั่ Visible true เพ่อื ใหแ้ สดง และ Visible False เพ่อื ไมใ่ หแ้ สดงผล Width ปรบั ขนาดความกวา้ งของเครอ่ื งมอื ค่าปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กให้ เป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ต็มความกวา้ งของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการกาํ หนดค่าเป็นจาํ นวนพกิ เซลกไ็ ด้
Height ปรบั ขนาดความสงู ของเครอ่ื งมอื คา่ ปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กใหเ้ ป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ตม็ ความสูงของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการ กําหนดคา่ เป็นจาํ นวนพกิ เซลกไ็ ด้ 2) Table Arrangement การจดั วางรปู แบบของเครอ่ื งมอื ในลกั ษณะของตาราง เคร่อื งมอื ต่างๆทอ่ี ย่ภู ายใน Table Arrangement จะถูกวางเรยี งในรปู แบบของตารางคอื มที งั้แนวตัง้ และแนวนอน ซ่ึงเคร่ืองมือต่างๆท่ีวางได้นัน้ จะวางตามจํานวนท่ีกําหนดไว้ใน PropertiesColumn และ Rowsวางเครอ่ื งมอื Button ไปไวใ้ น Table Arrangement ซง่ึ จะเหน็ ไดว้ า่ เครอ่ื งมอื ทอ่ี ยใู่ น TableArrangement นนั้ จะถกู จดั วางตําแหน่งในรปู แบบของตาราง
Properties การปรบั แต่งคณุ สมบตั ิต่างๆ กส็ ามารถทาํ ได้ Columns กําหนดขนาดจาํ นวนของคอลมั น์ Rows กําหนดขนาดจาํ นวนของแถว Visible การตงั้ ค่าการแสดงผลการทาํ งานของเครอ่ื งมอื สามารถเลอื กไดค้ อื showing แสดงผล hidden ซ่อนไวไ้ ม่แสดงผล ซง่ึ ในการเขยี นโปรแกรมนนั้ จะใชค้ าํ สงั่ Visible true เพ่อื ใหแ้ สดง และ Visible False เพ่อื ไมใ่ หแ้ สดงผล Width ปรบั ขนาดความกวา้ งของเครอ่ื งมอื ค่าปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กให้ เป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ตม็ ความกวา้ งของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการกําหนดคา่ เป็นจาํ นวนพกิ เซลกไ็ ด้ Height ปรบั ขนาดความสงู ของเครอ่ื งมอื คา่ ปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กใหเ้ ป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ตม็ ความสงู ของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการ กาํ หนดคา่ เป็นจาํ นวนพกิ เซลกไ็ ด้ 3) Vertical Arrangement การจดั วางรปู แบบของเครอ่ื งมอื ในแนวตงั้ เครอ่ื งมอื ต่างๆทอ่ี ยภู่ ายใน Vertical Arrangement จะถกู วางเรยี งต่อๆกนั ในแนวตงั้
วางเครอ่ื งมอื Button ไปไวใ้ น Vertical Arrangement ซง่ึ จะเหน็ ไดว้ า่ เครอ่ื งมอื ทอ่ี ยใู่ น VerticalArrangement นนั้ จะถกู จดั วางเรยี งต่อๆกนั ในรปู แบบของแนวตงั้Properties การปรบั แต่งคุณสมบตั ติ ่างๆ กส็ ามารถทาํ ได้ Align Horizontal และ Align Vertical เป็นการจดั รปู แบบเคร่อื งมอื ต่างๆทอ่ี ยใู่ น Vertical Arrangement ใหม้ ตี ําแหน่งตามตอ้ งการ ซง่ึ ค่าปกตขิ อง Align Horizontal จะเป็น Left ชดิ ซา้ ย ซง่ึ สามารถปรบั ให้ Center ก่งึ กลาง หรอื ว่า Right ชดิ ขวา ได้ แต่ก่อนทจ่ี ะปรบั ตําแหน่ง ให้ก่งึ กลางหรอื ชดิ ขวาไดน้ ัน้ เราจาํ เป็นต้องปรบั ความกว้าง Width ใหม้ ขี นาด Pixel ตามท่ี ตอ้ งการ หรอื เป็น Fill parent ก่อน Visible การตงั้ ค่าการแสดงผลการทาํ งานของเคร่อื งมอื สามารถเลอื กไดค้ อื showing สงั่ ให้ แสดงผล hidden ซ่อนไวไ้ ม่แสดงผล ซง่ึ ในการเขยี นโปรแกรมนัน้ จะใชค้ าํ สงั่ Visible true เพ่อื ใหแ้ สดง และ Visible False เพ่อื ไมใ่ หแ้ สดงผล
Width ปรบั ขนาดความกวา้ งของเคร่อื งมอื ค่าปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กให้ เป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ตม็ ความกวา้ งของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการกําหนดคา่ เป็นจาํ นวนพกิ เซลกไ็ ด้ Height ปรบั ขนาดความสงู ของเครอ่ื งมอื ค่าปกตจิ ะตงั้ อยทู่ ่ี Automatic แต่สามารถเลอื กใหเ้ ป็น Fill parent เพ่อื ปรบั ขนาดใหเ้ ตม็ ความสูงของหน้าจอ หรอื จะเลอื กกําหนดขนาดเอง โดยการ กาํ หนดค่าเป็นจาํ นวนพกิ เซลกไ็ ด้การติดตงั้ แอพพลิเคชนั่ บนอปุ กรณ์แอนดรอยด์ การติดตงั้ แอพพลเิ คชนั่ บนอุปกรณ์แอนดรอยด์นัน้ สามารถทําได้หลายวธิ ี ซงึ โดยปกติก็คอื จะใช้วธิ กี ารดาวน์โหลดไฟลต์ ดิ ตงั้ โดยตรงจาก Google Play ซง่ึ จะทาํ ใหเ้ ราไม่สามารถมองเหน็ ตวั ไฟลน์ ัน้ ได้จริงๆ เพราะระบบจะดาวน์โหลดและติดตัง้ ให้เองอัตโนมัติ และข้อจํากัดอีกอย่างคือต้องเป็นแอพพลเิ คชนั่ ทไ่ี ดบ้ รรจไุ วใ้ น Google Play เท่านนั้ ไม่สามารถตดิ ตงั้ จากทอ่ี ่นื ได้ เพราะฉะนัน้ จงึ ต้องมีขนั้ ตอนและการตงั้ ค่าเพ่อื ใหส้ ามารถตดิ ตงั้ แอพพลเิ คชนั่ ทม่ี าจากทอ่ี ่นื ได้ วธิ กี ารคอื จะทาํ การตดิ ตงั้ โดยการใชไ้ ฟลน์ ามสกุล apk นนั่ เอง ซง่ึ การตดิ ตงั้ ไฟล์ apk บนอุปกรณ์แอนดรอยดน์ นั้ จะต้องมกี ารตงั้ ค่าของอุปกรณ์แอนดรอยดเ์ สยี ก่อน มเิ ชน่ นนั้ จะไมส่ ามารถตดิ ตงั้ โปรแกรมได้ ขนั้ ตอนการตงั้ คา่ มดี งั ต่อไปน้ี เริ่มต้นเข้าไปท่ีเมนู การตัง้ ค่า (Setting) จากนัน้ เลือกไปท่ีเมนูระบบป้ องกัน (Security) ทําเคร่อื งหมายถูกท่เี มนู แหล่งท่ไี ม่รู้จกั (Unknown Sources) เพ่อื อนุญาตให้ติดตงั้ แอพพลเิ คชนั่ จากแหลง่ ทม่ี าอ่นื ๆ ทไ่ี มไ่ ดม้ าจาก Play Store
**** ไฟล์ .apk คอื ตวั เเพค็ เกจ็ ทใ่ี ชใ้ นการตดิ ตงั้ แอพพลเิ คชนั่ ต่างๆบนระบบปฏบิ ตั กิ ารแอนดรอยด์ เม่อืนําไปเปรยี บเทยี บกบั Windows เเลว้ มนั กค็ อื ไฟลน์ ามสกุล .exe ทเ่ี อาไวต้ ดิ ตงั้ โปรเเกรมนนั่ เองวธิ กี ารตดิ ตงั้ แอพพลเิ คชนั่ ลงบนอปุ กรณ์แอนดรอยด์ สามารถทาํ ไดห้ ลายวธิ ดี ว้ ยกนั ดงั น้ี 1. ติดตงั้ ผา่ น USB Storage Device 2. ติดตงั้ ผา่ น ADB (Android Debug Bridge) 3. ติดตงั่ ผา่ น Wi-Fiสามารถทาํ ไดโ้ ดยมขี นั้ ตอนดงั น้ี 1. ติดตงั้ ผา่ น USB Storage Device เป็นการใชง้ านเช่นเดยี วกนั กบั อุปกรณ์จบั เกบ็ ขอ้ มลู ทวั่ ไปหลงั จากท่ไี ด้ตดิ ตงั้ ไดรเวอรใ์ ห้กบั อุปกรณ์แอนดรอยด์เป็นท่เี รยี บรอ้ ยแล้ว สามารถเขา้ ใช้งานผ่านทางshort cut ทแ่ี สดงอยภู่ ายใน my computer ไดเ้ ลย อุปกรณ์จดั เก็บขอ้ มลู ท่แี สดงในภาพ เป็นอุปกรณ์จดั เก็บขอ้ มูลท่ตี ดิ ตงั้ อย่ภู ายในของอุปกรณ์แอนดรอยด์ Tablet คอื ช่อื พน้ื ทท่ี ใ่ี ชจ้ ดั เกบ็ ขอ้ มลู ภายในของระบบปฏบิ ตั กิ ารแอนดรอยดซ์ ง่ึ สามารถใช้เป็นพน้ื ทใ่ี นการจดั เก็บขอ้ มูลทวั่ ไปได้ เปรยี บเสมอื นกบั ไดรฟ์ C ของคอมพวิ เตอร์ และ Card คอื ช่อืพน้ื ทจ่ี บั เกบ็ ขอ้ มลู ทถ่ี ูกเพม่ิ เขา้ ไปในอุปกรณ์แอนดรอยดก์ เ็ ปรยี บเสมอื นกบั ไดรฟ์ D ของคอมพวิ เตอร์นนั่ เอง
เมอ่ื เขา้ ไปยงั พน้ื จดั เกบ็ ขอ้ มลู ดงั กล่าวแลว้ ใหน้ ําไฟลน์ ามสกุล .apk ซง่ึ เป็นไฟลส์ าํ หรบั ตดิ ตงั้แอพพลเิ คชนั่ นนั้ คดั ลอกไปเกบ็ ไวย้ งั พน้ื ทว่ี ่าง ในตําแหน่งใดกไ็ ด้ จากนัน้ เปิดโปรแกรมประเภท File manager , apk Installer ซง่ึ เป็นโปรแกรมใชง้ านทถ่ี ูกตดิ ตงั้ไวแ้ ลว้ บนอุปกรณ์แอนดรอยด์ เพอ่ื ทาํ การตดิ ตงั้ โปรแกรมทเ่ี ราไดค้ ดั ลอกไปไวย้ งั พน้ื ทจ่ี ดั เกบ็ ซง่ึ ถ้าไมม่ ีโปรแกรมประเภทน้ีกส็ ามารถดาวน์โหลดไดจ้ าก Google Play ในตวั อยา่ งเป็นการใชง้ านโปรแกรมประเภท File manager เพอ่ื เขา้ ไปยงั พน้ื ทท่ี ไ่ี ดจ้ ดั เกบ็ ไฟล์apk เอาไว้จากนนั้ เขา้ ไปยงั พน้ื ทท่ี เ่ี ราไดจ้ ดั เกบ็ ไฟลต์ ดิ ตงั้ เอาไว้
Search
