สวัสดีครับ, ในบล็อกนี้ผมก็จะมาสอนพื้นฐานการเขียนโปรแกรมภาษา Autoit กับการใช้งาน GUI แบบรวดเร็วกันครับ ก่อนอื่นเลยสิ่งที่ท่านต้องเตรียม มีดังนี้
- บอร์ด Arduino และ Arduino IDE
- โปรแกรม AutoIt และ AutoIt Script Editor
ผมขอข้ามขั้นตอนการติดตั้งโปรแกรมไปนะครับ เพราะติดตั้งแบบเดียวกับโปรแกรมทั่วๆไป
การออกแบบ GUI พื้นฐาน
เปิดโปรแกรม SciTE Script Editor ขึ้นมาได้เลยครับ
หน้าตาโปรแกรมจะเหมือนกับพวกโปรแกรม Text Editor ทั่วๆไป ก่อนที่จะเรียกใช้ตัวช่วยออกแบบ GUI เราต้องเซฟไฟล์เปล่าๆเสียก่อน จึงจะมีเมนูขึ้นมาให้เลือก คลิกที่เมนู Tool > Koda (FormDesigner) เพื่อเรียกโปรแกรม Koda มาเป็นตัวช่วยในการออกแบบ GUI
ก็จะปรากฎหน้าตาของโปรแกรม และหน้าต่างออกแบบ GUI (Form1) ขึ้นมาให้
ขนาดของโปรแกรม สามารถย่อขยายได้ ด้วยการคลิกค้างไว้แล้วลากย่อขยายตรงมุมหน้าต่าง (แบบเดียวกับการเลือกย่อ – ขยายรูป) โดยสามารถย่อขยายให้มีขนาดเท่าใดก็ได้ แต่ไม่ควรใหญ่มากนัก หากไปใช้ในหน้าจอคอมฯที่เล็กกว่าขนาดของโปรแกรม มันจะทำให้โปรแกรมมีขนาดใหญ่เกินหน้าจอ และไม่สามารถย่อหน้าต่างโปรแกรมได้ (ไม่มีภาพมาให้นะครับ เนื่องจากโปรแกรมจับภาพไม่สามารถจบภาพของเคเซอร์ได้)
มาดูทางซ้ายกันบ้างครับ ซ้ายล่างจะมีหน้าต่างสำหรับการตั้งค่าอยู่ และจะมีค่าประมาณรูปด้านล่างนี้ (หากไม่ได้แบบนี้ ให้นำเมาส์คลิกในหน้าต่างพื้นว่างๆก่อน จะมีให้ตั้งค่าหน้าต่างโปรแกรมขึ้นมา) โดยปกติแล้ว ส่วนนี้เราจะแก้แค่ตรง Caption อย่างเดียว (สำหรับหน้าต่างโปรแกรม) โดยแก้เป็นอะไรก็ได้ หากแก้ตรงส่วนนี้ ตรงส่วน Title ของหน้าต่างจะเปลี่ยนตาม
เนื่องจากเราจะเชื่อมต่อกับ Arduino ผ่านการใช้งาน Serial ดังนั้นจึงต้องมีกล่องสำหรับเลือก COM Port และ Baud rate และจัดเป็นหมวด Connect ด้วย Group
สร้าง Group ก่อน โดยหน้าต่างด้านบน โดยคลิปที่เมนู Standard และคลิก GroupBox
ในหน้าต่างออกแบบ คลิกค้างไว้ และลาก จนกว่าจะได้ขนาดที่ต้องการ แลวปล่อยเม้าส์ คลิกในกรอบ แล้วลาก เพื่อจัดวางให้สวยงาม คลิกที่กล่อง GroupBox และหน้าต่างด้านซ้ายล่าง แก้ตรง Caption เป็น Connect
คลิกเลือก ComboBox แล้วลากวาง ปรับ เราจะใช้ ComboBox อันนี้เป็นเลือก COM Port แต่เนื่องจาก COM Port ไม่ใช่ค่าคงที่ ดังนั้นจึงต้องเว้นไว้ก่อน คลิกที่ ComboBox และลากวาง ปรับ เราจะใช้ ComboBox อันนี้เป็นการเลือก Baud rate
ลองคลิกปุ่ม เพื่อทดลองรันโปรแกรมขึ้นมาดู ว่าโปรแกรมของเรามีหน้าตาแบบที่ต้องการหรือไม่
จะเห็นว่า ComboBox ของเราสามารถแก้ไขค่าได้ ซึ่งอาจจะทำให้โปรแกรมของเราทำงานผิดพลาดได้ คลิก x ปิดหน้าต่างโปรแกรมที่รันขึ้นมาไปก่อน แล้วคลิกเลือก ComboBox (ทั้ง ComboBox 1 และ 2 ทำแบบเดียวกัน) ในหน้าต่างการตั้งค่า หรือ Object Inspector มองแท๊ปด้านล่าง คลิกเลือก Styles แล้วคลิกเลือก CBS_DROPDOWNLIST (คลิกในกรอบสี่เหลี่ยมให้เป็นเครื่องหมายถูก)
เนื่องจาก Baud rate นั้นเป็นค่าคงที่ จึงสามารถกำหนดค่าที่จะให้เลือกได้เลย โดยค่าที่จะให้เลือกได้มีดังนี้
- 1200
- 2400
- 4800
- 9600
- 19200
- 38400
- 57600
- 115200
หน้าต่าง Object Inspector กลับมาเลือกแท๊ป Properties คลิก Items แล้วคลิปปุ่มที่เป็นจุด 3 จุด จะแสดงหน้าต่างขึ้นมาในหน้าต่างนี้จะเป็นการใส่ค่าที่ให้เลือกได้ โดยจะยึดตาม 1 บรรทัด 1 ตัวเลือก ดังนั้นจึงนำค่าทั้งหมดมาวางในแต่ละบรรทัดได้เลย แล้วคลิกปุ่ม Ok
แต่เนื่องจาก 9600 เป็นค่าที่ใช้บ่อยที่สุด ดังนั้นเมื่อเปิดโปรแกรมขึ้นมา และเลือก 9600 อยู่แล้ว ก็จะทำให้ใช้งานโปรแกรมได้สะดวกยิ่งขึ้น คลิกที่ ItemIndex กรอก 4 (ที่ต้องกรอก 4 เนื่องจาก 9600 อยู่ในบรรทัดที่ 4 หรือตัวเลือกที่ 4) แล้วกด Enter 1 ครั้ง
ลองคลิปปุ่ม ก็จะเห็นว่า ตัวเลือกได้เลือก 9600 ไว้แล้ว
ปิดหน้าต่างโปรแกรมไปก่อน เราจะมาสร้างปุ่มกันครับ ปุ่มที่เราจะสร้าง คือปุ่ม Connect คลิกที่ปุ่ม Button
ลาก วาง ปรับ ก็จะได้ปุ่มแล้ว
ต่อมา ก็แก้ข้อความในปุ่ม คลิกเลือกปุ่ม ในหน้าต่าง Object Inspector แก้ตรงส่วน Caption
ก็จบการสร้างปุ่มแล้ว และต่อมา ผมจะทำการควบคุมการเปิด – ปิด LED เป็นตัวอย่าง ดังนั้นจึงต้องมีปุ่มอีก 1 ปุ่ม สำหรับส่งข้อมูลไปให้ Arduino หน้าตาโปรแกรมเมื่อคลิก ก็จะได้ออกมาประมาณนี้
การ Export ออกมาเป็นโค้ด และเริ่มเขียนโค้ด
แนะนำให้เซฟไว้ก่อน จากนั้นจึงคลิกที่ปุ่ม แล้วคลิกปุ่ม Inser into Scite เพื่อนำโค้ดเข้าโปรแกรมทันที แล้วโปรแกรม Koda ก็จะปิดไป
โค้ดก็เข้ามาอยู่ในโปรแกรม SciTE Script Editor ทันที
กดปุ่ม F5 บนคีย์บอร์ด จะเป็นการรันโปรแกรมขึ้นมา
สำหรับโค้ดโปรแกรม ขอไม่สอนเขียนนะครับ เนื่องจากมันจะยาวมากๆ เอาเป็นว่าอ่านในคอมเม้นของโค้ดนี้ได้เลยครับ
#include <ButtonConstants.au3> #include <ComboConstants.au3> #include <GUIConstantsEx.au3> #include <WindowsConstants.au3> ;~ #include <Array.au3> #include 'CommMG.au3' ; เรียกโค้ดจาก CommMG.au3 มาใช้งาน $Connect = False $Status = False Local $sportSetError $Form1 = GUICreate("ArduinoEx", 378, 218, 263, 181) $Group1 = GUICtrlCreateGroup("Connect", 8, 8, 361, 65) $Combo1 = GUICtrlCreateCombo("", 32, 32, 97, 25, BitOR($CBS_DROPDOWNLIST,$CBS_AUTOHSCROLL)) $Combo2 = GUICtrlCreateCombo("", 152, 32, 97, 25, BitOR($CBS_DROPDOWNLIST,$CBS_AUTOHSCROLL)) GUICtrlSetData(-1, "1200|2400|4800|9600|19200|38400|57600|115200", "9600") $Button1 = GUICtrlCreateButton("Connect", 272, 32, 73, 25) GUICtrlCreateGroup("", -99, -99, 1, 1) $Button2 = GUICtrlCreateButton(">> LED ON <<", 96, 104, 179, 73) GUISetState(@SW_SHOW) $portlist = _CommListPorts(0); ดึงรายชื่อ COM Port ทั้งหมดออกมา If Not @error = 1 Then ; หากไม่มี error เกิดขึ่น ;~ _ArrayDisplay($portlist) ; แสดงอาเรย์ออกมาทั้งหมด For $pl = 1 To $portlist[0] ; วนลูปจาก 1 ถึง $portlist[0] GUICtrlSetData($Combo1, $portlist[$pl]); ดึงค่าในตัวแปร $portlist[0] ไปเซ็ตใน ComboBox 1 Next ; จบการวนลูป EndIf GUICtrlSetState($Button2, $GUI_DISABLE) ; ปิดการกดปุ่ม เพื่อป้องกันการกดปุ่มก่อน Connect While 1 $nMsg = GUIGetMsg() Switch $nMsg Case $GUI_EVENT_CLOSE Exit Case $Button1 ; เมื่อคลิกปุ่ม Connect If GUICtrlRead($Combo1) == "" Then MsgBox(16, "Error", "COM Port open error.") ; หากไม่มีการเลือก COM Port ให้แสดงข้อความแจ้ง error $setport = StringReplace(GUICtrlRead($Combo1), 'COM', '') ; ดึงค่าที่เลือกใร ComboBox 1 และตัดคำว่า COM ทิ้ง $resOpen = _CommSetPort($setport, $sportSetError, GUICtrlRead($Combo2)) ; เปิดพอร์ต If $resOpen = 0 Then ; หากเปิดพอร์ตไม่สำเร็จ MsgBox(16, "Error", $sportSetError) ; แสดงข้อความแจ้ง error Else ; หากเปิดพอร์ตสำเร็จ GUICtrlSetState($Button1, $GUI_DISABLE) ; ปิดการกดปุ่ม เพื่อป้องกันการกดปุ่มซ้ำ $Connect = True ; เซ็ตตัวแปร $Connect เป็น True _CommSendstring("LED1-OFF" & @LF & @LF) ; ส่งข้อความว่า LED1-OFF และ Enter 2 ครั้ง เพื่อตั้งให้ LED OFF ตามปุ่มที่ตั้งไว้ GUICtrlSetState($Button2, $GUI_ENABLE) ; เปิดให้สามารถกดปุ่มควบคุมได้ EndIf ; จบการเปรียบเทียบ Case $Button2 ; เมื่อคลิกปุ่ม LED ON If $Connect Then ; ถ้ามีการเชื่อมต่อแล้ว If Not $Status Then ; ถ้าตัวแปร $Status เป็นเท็จ _CommSendstring("LED1-ON" & @LF) ; ส่งข้อความว่า LED1-ON และ Enter $Status = True ; เซ็ตค่าตัวแปรเป็น True GUICtrlSetData($Button2, ">> LED OFF <<") ; เปลี่ยนค่าในปุ่มเป็น >> LED OFF << Else ; ถ้าเป็นจริง _CommSendstring("LED1-OFF" & @LF) ; ส่งข้อความว่า LED1-OFF และ Enter $Status = False ; เซ็ตค่าตัวแปรเป็น False GUICtrlSetData($Button2, ">> LED ON <<") ; เปลี่ยนค่าในปุ่มเป็น >> LED ON << EndIf ; จบการเปรียบเทียบ EndIf ; จบการเปรียบเทียบ EndSwitch WEnd
สำหรับโค้ดใน Arduino
/* LED Control with Serial port */ int LED1_Pin = 13; String SerialGET = ""; void setup() { Serial.begin(9600); pinMode(LED1_Pin, OUTPUT); } void loop(){ while (Serial.available()) { char c = Serial.read(); if (c == '\n') { /* You code chk */ Serial.println(SerialGET); if (SerialGET.indexOf("LED1-ON") >= 0) digitalWrite(LED1_Pin, HIGH); else if (SerialGET.indexOf("LED1-OFF") >= 0) digitalWrite(LED1_Pin, LOW); SerialGET = ""; }else SerialGET += c; } } }
ลองก๊อบโค้ดไป แล้วศึกษาดูนะครับ สำหรับไลบารี่เชื่อม COM Port หรือไฟล์ CommMG.au3 สามารถโหลดได้ที่ : Serial Port /COM Port UDF
หากต้องการทั้งชุดเลย สามารถโหลดได้ที่ : ArduinoEx.zip
ภาษา AutoIt ไม่ยากครับ แค่ขยันอ่านใน Help ก็สามารถเขียนได้แล้ว ในนั้นมีข้อมูลรายละเอียดของแต่ละฟังก์ชั่นครบถ้วนมากๆ