วิชา การพัฒนาโปรแกรมประยุกต์บนอุปกรณ์พกพา 1

ใบงานที่ 4 การประยุกต์ใช้ Web viewer และ  เว็บไซต์ จัดทำโดย นายไชยวัฒน์ รอดมา  รหัสนักศึกษา 5931280059 เลขที่7 ปวส.2 กลุ่ม 3 ขั้นตอนการทำ  Web viewer และ เว็บไซต์ มีขั้นตอนดังนี้ 1.เปิดไฟล์ Notepad ขึ้นมา 2.เขียนโค้ด ว่า <img src=" (นำชื่อไฟล์รูปของคุณมาใส่ในที่ว่างนี้) " width="300" height="500"> 3.หลังจากนั้นก็ทำการ Save ไฟล์ให้เป็น .html และรูปที่โหลดมาจะต้องอยู่ในไฟล์เดียวกัน 4. ค้นหา  MIT App Inventor 2  ในGoogle หรือ คลิกที่ลิงก์นี้ได้เลย  http://ai2.appinventor.mit.edu 5.เมื่อเราเข้าเว็บไซต์  MIT App Inventor 2 แล้วให้ทำการ  New Project ขึ้นมาใหม่เพื่อเริ่มงานใหม่ 6.คลิกที Start New Project   แล้วให้ตั้งชื่อตามที่ต้องการ  7..เลือกแล้วจากนั้นให้เราลาก Web Viewer  เข้าที Screen 1 8.กดที่ Upload File...   และ เลือกไฟล์ รูปที่เตรียมไว้  9.คลิกที่ Web Viewer 1 และ พิมพ์ที่ HomeUrl ว่า file:///android_asset/ และตามชื่อที่ทำ .html 10.จากนั้นทำการ Build  ตามขั้นตอนดังนี้

ใบงานที่3 สรุปความรู้เกี่ยวกับ MiT App Inventer 2   จัดทำโดย นายไชยวัฒน์ รอดมา เลขที่ 7 รหัสนักศึกษา 5931280059 เริ่มต้นด้วยการเอาเครื่องมือมาวางบน Screen จากหน้า Screen จะประกอบด้วยเครื่งมือดังนี้ 1.Button 2.TextBox 3.TinyDB 4.TinyWebDB 5.Notifier 6.SpeechRecognizer 7.TextToSpeech หลังจากนั้น เป็นการเขียนโปรแกรมบน Blocks จากภาพเป็นการเอาจิ๊กซอมาต่อกันเป็นคำสั่งเพื่อให้แสดงผล โปรแกรมจะทำการ Compile ดังรูป จากนั้นจะขึ้น QRCode ให้เราสแกนเพื่อดาวน์โหลดใส่สมาร์ทโฟน  จากนั้นใช้โปรแกรม MIT AI2 Companion บนสมาร์ทโฟนสแกนQR Code เพื่อดาว์นโหลด เท่านี้เราก็จะได้ Application เรียบร้อยแล้ว

ใบงานที่ 2 การประยุกต์ใช้ Web viewer และ BarcodeScanner จัดทำโดย นายไชยวัฒน์ รอดมา  รหัสนักศึกษา 5931280059 เลขที่7 ปวส.2 กลุ่ม 3 ขั้นตอนการทำ  Web viewer และ BarcodeScanner      1.เมื่อเราเข้า ai2.appinventor ให้ทำการ  New Project ขึ้นมาเพื่อเริ่มงานใหม่      2.คลิกที่ Start Project   แล้วให้ตั้งชื่อตามที่ต้องการ แล้วคลิกที่ปุ่ม OK      3.เลือกที่แถบเครื่องมือ แล้วเลือกที่ Sensors แล้วลาก Barcode Scanner มาวางที่ Screen 1      4.แล้วเลือกที่ User interface แล้วจากนั้นให้เราลาก Button , Label และ WebViewer  มาวางที่ Screen 1            5.แล้วก็ให้เปลี่ยนโหมดไปที่ Blocks      6.ใส่ Code ตามนี้เพื่อให้ Application ทำงานตามที่เราต้องการ      7.แล้วให้ ทำการ Build  ตามขั้นตอนดังนี้      8.จากนั้นให้ทำการติดตั้ง Application แล้วก็ทดลองใช้งาน นายไชยวัฒน์ รอดมา  รหัสนักศึกษา 5931280059 เลขที7 ปวส.2 กลุ่ม 3