แอพแอนดรอยด์ รับค่าจากบอร์ด Arduino #1 (ออกแบบหน้าจอ)

เราจะมาเขียน แอพแอนดรอยด์ เพื่อ รับค่าที่ส่งออกมาจาก บอร์ด Arduino ผ่านทาง Bluetooth HC-05 กันนะครับ ไปที่ http://ai2.appinventor.mit.edu/

เริ่มต้นเขียนโปรแกรม ไปที่ Projects -> Start new project



ตั้งชื่อ Project เช่น Get_up_Arduino แล้วคลิก OK


เปลี่ยน Title ของ Screen1 เป็น Get up Arduino


ลาก ListPicker1ไปวางไว้ที่  Screen1
ลาก Label1 ไปวางไว้ที่  Screen1
ลาก Button1 ไปวางไว้ที่  Screen1


ไปที่ Sensors ลาก Clock1 ไปวางไว้ที่  Screen1
(Clock1 จะเลื่อนไปอยู่ข้างล่าง Screen1 โดยอัตโนมัติ เพราะเป็น Component ที่ซ่อนไว้)


ตังค่า TimerInterval เป็น 500


ที่ Connectivity ลาก BluetoothClient1 ไปที่ Screen1
BluetoothClient1 จะเลื่อนไปอยู่ข้างล่าง Screen1 โดยอัตโนมัติ เพราะเป็น Component ที่ซ่อนไว้


ให้ BluetoothClient1 แสดงผลเป็นรูปภาพ โดยไปที่ Image


คลิก Upload File -> Choose File


เลือกไฟล์รูปภาพ (*.png) ที่ต้องการ


คลิก OK


ตั้งค่า BluetoothClient1 ดังนี้
Height เป็น 80 pixels
Width เป็น 80 pixels


ตั้งค่า Text เป็น ว่างปร่าว (ไม่มีข้อความใดๆ)


ไปที่ Screen1 ตั้งค่า AlignHorizontal เป็น Center



ตั้งค่า Label1 ดังนี้
ติ๊กเลือก FontBold (ตัวหนา)
ขนาดตัวอักษร FontSize เป็น 32


ตั้งค่า Button1 ดังนี้
ติ๊กเลือก FontBold (ตัวหนา)
ขนาดตัวอักษร FontSize เป็น 18


ถึงขั้นตอนนี้ การออกแบบหน้าจอ แอพแอนดรอยด์ ควบคุมรถบังคับ โหมด Designer ของเราก็เสร็จ  เพื่อพร้อมที่จะ เข้าสู่ โหมด Blocks ต่อไป
........................

หรือ จะเปิดโปรแกรม aiStarter เพื่อทดสอบ Emulator สมาร์ทโฟนจำลอง



คลิก Connect -> Emulator


รอสักครู่... ก็จะเห็นหน้าจอที่เราออกแบบไว้ครับ