เริ่มต้นใช้งานบอร์ด LattePanda และตัวอย่างการประยุกต์ใช้งาน ตอนที่ 1 เตรียมซอฟต์แวร์สำหรับ LattePanda และการสื่อสารกับบอร์ดเบื้องต้น

บทความ “เริ่มต้นใช้งานบอร์ด LattePanda และตัวอย่างการประยุกต์ใช้งาน”

LattePanda Article 01

ตอนที่ 1 เตรียมซอฟต์แวร์สำหรับ LattePanda และการสื่อสารกับบอร์ดเบื้องต้น

LattePanda Article 02

*** (บทความนี้สามารถประยุกต์ใช้ร่วมกับบอร์ด LattePanda, คอมพิวเตอร์ PC, Laptop ได้) ***

         LattePanda เป็นบอร์ดคอมพิวเตอร์รองรับระบบปฏิบัติการ Windows 10 ดังนั้นในด้านการใช้งานทั่วไปจึงไม่แตกต่างกับ แล็ปท็อป หรือ คอมพิวเตอร์ PC ทั่วไป บอร์ด LattePanda จะติดตั้งระบบปฎิบัติการ Windows 10 Home มาจากผู้ผลิต โดยแบ่งออกเป็น 2 รุ่นคือ Windows 10 Home 32 Bit (Activated) สำหรับรุ่นแรม 2GB และ Windows 10 Home 64 Bit (Not Activated) สำหรับรุ่นแรม 4GB อีกทั้งบอร์ด LattePanda มีชิพ ATmega32u4 ที่ลง Bootloader เป็น Arduino Leonardo ติดมาด้วย จึงทำให้สามารถใช้พอร์ตขา I/O ของ Arduino ได้ 

         ภายในบอร์ด LattePanda จะประกอบไปด้วยส่วนประมวลผล 2 ส่วนด้วยกัน

1. ส่วนประมวลผลหลักคือ Computer ที่ใช้ CPU Intel Cherry Trail Z8350 
2. ส่วน Microcontroller Atmega32u4 ที่ลง Bootloader ให้เป็น Arduino Leonardo

         ทำให้บอร์ด LattePanda เปรียบเสมือน Computer ที่มีบอร์ด Arduino Leonardo เชื่อมต่ออยู่ผ่านทาง Port USB ทำให้ฝั่ง Computer (Intel Cherry Trail Z8350) มองเห็น Arduino เป็น Comport (UART) ด้วยการรวมกันของ 2 ส่วนนี้ทำให้ LattePanda มีความสามารถในการควบคุมอุปกรณ์หรือ Sensor ต่างๆ ที่ต้องการความเป็น Realtime และเข้าถึง Hardware ในระดับ Low Level ด้วย Arduino และสร้าง Application ที่ต้องการความเร็วในการประมวลผล หรือมีโครงสร้างที่ซับซ้อนบน Intel Cherry Trail Z8350

Software ที่ใช้ในการพัฒนา Application (ดาวน์โหลดฟรี) 


เนื่องจากโปรแกรมที่ใช้ในการพัฒนาที่ถูกติดตั้งมากับบอร์ด LattePanda ยังไม่ใช่เวอร์ชั่นล่าสุด การทำงานบางฟีเจอร์อาจยังไม่รองรับการใช้งานในปัจจุบัน ในบทความนี้จึงขอแนะนำการ update โปรแกรมให้เป็นเวอร์ชันล่าสุด มี 2 โปรแกรม คือ Visual Studio Community 2017 (C#) และ Arduino IDE มีขั้นตอนการติดตั้งดังนี้


1. Visual Studio Community 2017
1.1 เปิด Internet Browser เข้าไปที่ https://www.visualstudio.com/downloads/ เลือก Visual Studio Community แล้วกด Free download


1.2 ติดตั้งโปรแกรม Visual Studio Community

1.3 เลือกแพ็คเกจ .NET desktop development แล้วกด Install แล้วรอจนเสร็จ

1.4 กดค้นหา >> ค้นหาคำว่า “Visual Studio” >> เปิดโปรแกรม Visual Studio 2017

1.5 หากติดตั้งโปรแกรมสำเร็จโปรแกรมจะขึ้นดังภาพ


2. Arduino IDE 
2.1 สามารถดาวน์โหลดได้จากเว็ปไซต์ https://www.arduino.cc/en/main/software >> เลือก “Windows zip file for non admin install”

2.2 แตกไฟล์ และลองทดสอบเปิดโปรแกรม “Arduino.exe” โปรแกรมจะมีหน้าตา และเห็นพอร์ต Arduino Leonardo เชื่อมต่ออยู่ดังภาพ


การสื่อสารระหว่างบอร์ด Arduino กับ Windows ด้วยโปรแกรม Visual Studio (C#)
         การสื่อสารระหว่างบอร์ด Arduino กับ Windows ด้วยโปรแกรม Visual Studio (C#) เป็นการสื่อสารระหว่างระบบปฏิบัติการ Windows ของบอร์ด LattePanda กับบอร์ด Arduino โดยใช้การสื่อสารแบบอนุกรม (Serial Communication) ในหัวข้อนี้จะแสดงการสื่อสารสองทาง จากระบบปฏิบัติการ Windows ไปยังบอร์ด Arduino และจากบอร์ด Arduino ไปยังระบบปฏิบัติการ Windows

แบ่งการพัฒนาโปรแกรมออกเป็น 2 ส่วน คือ
– พัฒนาโปรแกรมบนบอร์ด LattePanda ด้วยโปรแกรม Visual Studio Community 2017
– พัฒนาโปรแกรมบนบอร์ด Arduino ด้วย Arduino IDE

การสื่อสารแบบอนุกรมจากระบบปฏิบัติการ Windows ไปยังบอร์ด Arduino
         ในตัวอย่างนี้ ทางฝั่งระบบปฏิบัติการ Windows จะทำหน้าที่ “ส่งข้อมูล” และบอร์ด Arduino จะทำหน้าที่ “รับข้อมูล” จะอธิบายคร่าวๆ ดังภาพด้านล่าง มีตัวอย่างดังนี้


ในส่วนของระบบปฏิบัติการ Windows ในโปรแกรม Visual Studio มีฟังก์ชันหลักๆ ดังนี้

- เรียกใช้โมดูล 	        >> using System.IO.Ports;
- เปิด Serial Port	>> serialPort.Open();
- ส่งข้อมูลผ่าน Serial Port >> serialPort.Write(“DATA”);
- ปิด Serial Port	>> serialPort.Close();

ในส่วนของบอร์ด Arduino ในโปรแกรม Arduino IDE จะมีตัวอย่างการรับ Serial ดังนี้

void setup() {
  Serial.begin(9600);        // กำหนด Hardware Serial Baud Rate เป็น 9600 bps
 while (!Serial) { ; }        // wait for serial port to connect. Needed for native USB port only
}
void loop() { 
  if (Serial.available()) {     // เช็คว่า Serial มี DATA เข้ามาหรือไม่
    char c = Serial.read();   //  อ่านค่า Serial แล้วเก็บในตัวแปร c 
    //  your statement
  }
}

การสื่อสารแบบอนุกรมจากบอร์ด Arduino ไปยังระบบปฏิบัติการ Windows

         ในตัวอย่างนี้ บอร์ด Arduino จะทำหน้าที่ “ส่งข้อมูล” และ ทางฝั่งระบบปฏิบัติการ Windows จะทำหน้าที่ “รับข้อมูล” จะอธิบายง่ายๆ ดังภาพด้านล่าง โดยมีตัวอย่าง ดังนี้


ในส่วนของระบบปฏิบัติการ Windows ในโปรแกรม Visual Studio มีฟังก์ชันหลักๆ ดังนี้

- เรียกใช้โมดูล 	>> using System.IO.Ports;
- เปิด Serial Port	>> serialPort.Open();
- อ่านข้อมูล	        >> serialPort.ReadExisting(); หรือ serialPort.ReadLine(); แล้วแต่กรณี
- ปิด Serial Port	>> serialPort.Close();

ในส่วนของบอร์ด Arduino ในโปรแกรม Arduino IDE จะมีตัวอย่างการส่ง Serial ดังนี้

void setup() {
  Serial.begin(9600);       // กำหนด Hardware Serial Baud Rate เป็น 9600 bps
  while (!Serial) { ; }       // wait for serial port to connect. Needed for native USB port only
}
void loop() { 
  Serial.write(“DATA”);     //  ส่งข้อมูลออกทาง Serial Port
  delay(1000);                 // Delay 1 วินาที
}

ตัวอย่างการสื่อสารระหว่าง Arduino กับ Windows ด้วยโปรแกรม Visual Studio (C#)

         ในตัวอย่างการสื่อสารระหว่าง Arduino กับ Windows ด้วยโปรแกรม Visual Studio (C# Language) จะมีการทำงานเบื้องต้นให้เข้าใจง่ายๆ คือ
         – บอร์ด Arduino มีปุ่มกด 2 ปุ่ม เพื่อส่งข้อมูลไปยัง Windows และรับข้อมูลจากโปรแกรมบนฝั่ง Windows มาประมวลผลเพื่อควบคุมการทำงานของ LED
         – Windows มีปุ่มกด “LED ON”, “LED OFF” จากโปรแกรมที่เขียนด้วย Visual Studio เพื่อส่งข้อมูลไปยังบอร์ด Arduino และรับข้อมูลจากบอร์ด Arduino มาแสดงผลบนโปรแกรม


Arduino
ต่อวงจรเข้ากับขาของบอร์ด Arduino Leonardo ที่อยู่บนบอร์ด LattePanda ดังภาพ

เปิดโปรแกรม Arduino IDE 
– เลือก Tools >> Board (Arduino Leonardo)

– เลือก Tools >> Port (Port ของ Leonardo)

– Copy Code Lattepanda_lab1 >> แล้วกด Upload (CTRL+U)
Code Lattepanda_lab1 มีดังนี้ (หรือดาวน์โหลดที่นี่)

const int led = 7;
const int button1 = 8;
const int button2 = 9;
int buttonState1 = 0;
int buttonState2 = 0;

void setup()
{
  pinMode(led, OUTPUT);                    // กำหนดให้ LED_BUILTIN เป็น Output
  pinMode(button1, INPUT_PULLUP); // กำหนดให้ button1 เป็น Input แบบ Pullup
  pinMode(button2, INPUT_PULLUP); // กำหนดให้ button2 เป็น Input แบบ Pullup
  Serial.begin(9600);                            // กำหนดให้ Hardware Serial Baud Rate เป็น 9600 bps
    while (!Serial);                                   // wait for serial port to connect. Needed for Leonardo only
}
void loop()
{
  buttonState1 = digitalRead(button1);
  buttonState2 = digitalRead(button2);
  if (buttonState1 == LOW)    // ถ้า buttonState1 เป็น LOW Arduino ส่งคำว่า LED ON และ LED ติด
  {
    Serial.write("LED ON");
    digitalWrite(led, HIGH);
       delay(100);
  }
  if (buttonState2 == LOW)   // ถ้า buttonState2 เป็น LOW Arduino ส่งคำว่า LED OFF และ LED ดับ
  {
    Serial.write("LED OFF");
    digitalWrite(led, LOW);
    delay(100);
  }
  if (Serial.available())             // ตรวจสอบว่ามีข้อมูลเข้ามาหรือไม่ ?
  {
    char c = Serial.read();    // อ่าน Serial แล้วเก็บลงในตัวแปร c
    if (c == '1')             // ถ้า c เท่ากับ 1 led ติด ถ้าไม่ใช่ led ดับ
    {
      digitalWrite(led, HIGH);
    }
    else
    {
      digitalWrite(led, LOW);
    }
  }
} 

Visual Studio

         ขั้นตอนนี้จะอธิบายการพัฒนาโปรแกรมที่ใช้ในการสื่อสารระหว่างบอร์ด Arduino กับฝั่งระบบปฎิบัติการ Windows ด้วยโปรแกรม Visual Studio หรือสามารถดาวน์โหลดไฟล์ Test_Visual_Arduino.zip ไปใช้งานได้ทันที

ฟังก์ชันที่จำเป็นสำหรับการสื่อสารระหว่างบอร์ด Arduino กับ Windows ด้วยโปรแกรม Visual Studio จำเป็นต้องมี
– เรียกใช้งานพอร์ตอนุกรม (Serial Port) (ขั้นตอนที่ 3 – 5)
– เปิด Serial Port (ขั้นตอนที่ 6 – 7)
– ส่งข้อมูลผ่าน Serial Port (ขั้นตอนที่ 6 – 7)
– รับข้อมูลผ่าน Serial Port (ขั้นตอนที่ 8 – 9)

ขั้นตอนในการพัฒนาโปรแกรมมีดังนี้
1. เปิดโปรแกรม Visual Studio

2. สร้างโปรเจ็คใหม่ กด New >> Project…

เลือก Visual C# >> Windows Form App >> ตั้งชื่อโปรเจ็ค

3. ขั้นแรก เริ่มต้นจากการเรียกใช้งานพอร์ตอนุกรม มีขั้นตอนคือ 
ในหน้า Design ไปที่เมนู Toolbox >> เรียกใช้โมดูล SerialPort

4. กำหนด Parameter สำหรับการสื่อสารด้วย serialPort ที่จำเป็น เช่น
– BaudRate = 9600
– DataBits = 8
– DtrEnable = True // รอ Serial Port สำหรับ native USB
– Parity = None
– PortName = COM5
*** ในตัวอย่างกำหนดจาก Properties (สามารถกำหนดเพิ่มเติมได้จาก Code)

LattePanda Article 21

5. ไปที่เมนู Toolbox >> สร้าง ComboBox เพื่ออ่านพอร์ตอนุกรมที่เชื่อมต่ออยู่ทั้งหมด (ที่ต้องอ่านพอร์ตอนุกรมทั้งหมดเพราะ อาจจะมีพอร์ตอนุกรมเชื่อมต่ออยู่หลายตัว โปรแกรมจึงต้องออกแบบให้สามารถเลือกพอร์ตอนุกรมที่ต้องการเชื่อมต่อได้)
จากนั้นดับเบิ้ลคลิกช่องว่าง เพื่อสร้างฟังก์ชัน Form_Load (ทำงานเมื่อโปรแกรมถูก run) 

ก่อนจะอ่านพอร์ตอนุกรมที่เชื่อมอยู่ทั้งหมด ต้องเรียกใช้โมดูล

using System.IO.Ports;

และประกาศตัวแปร port เพื่อเก็บชื่อของพอร์ตอนุกรมทั้งหมด

String[] ports;
LattePanda Article 23

จากนั้นไปที่ฟังก์ชัน Form_Load เพิ่มโค้ดโปรแกรมอ่านพอร์ตอนุกรมและเพิ่มชื่อพอร์ตอนุกรมลงใน ComboBox

private void Form1_Load(object sender, EventArgs e)
{
   ports = SerialPort.GetPortNames();   // อ่านค่า Port Name ทั้งหมด
   comboBox1.Items.AddRange(ports);  // เพิ่มชื่อ Port Name ลงใน ComboBox
}
LattePanda Article 24

6. ไปที่เมนู Toolbox >> สร้างปุ่มขึ้นมา 3 ปุ่ม 
จากนั้นไปที่ Properties ของแต่ละปุ่ม >> เปลี่ยน Text ของปุ่มเป็น Connect, LED ON, LED OFF ตามลำดับ

7. ดับเบิ้ลคลิก ที่แต่ละปุ่ม จะมีฟังก์ชัน button_Click() เพิ่มเข้ามา
– ปุ่ม Connect >> เพิ่มโค้ดกำหนด PortName ให้เป็นพอร์ตที่เลือกใน ComboBox แล้วเปิดใช้งานพอร์ตอนุกรม

private void button1_Click(object sender, EventArgs e)
{
 serialPort1.PortName = comboBox1.SelectedItem.ToString();
  serialPort1.Open();
}

– ปุ่ม LED ON >> เพิ่มโค้ดให้พอร์ตอนุกรมส่งข้อมูล

private void button2_Click(object sender, EventArgs e)
{
   serialPort1.Write("1");
}

– ปุ่ม LED OFF >> เพิ่มโค้ดให้พอร์ตอนุกรมส่งข้อมูล

private void button3_Click(object sender, EventArgs e)
{
   serialPort1.Write("0");
}

8. ในหน้า Design ไปที่ Toolbox >> เพิ่ม textbox เพื่อรับข้อมูลจากพอร์ตอนุกรมมาแสดงบนโปรแกรม

9. คลิก serialPort1 >> ไปที่ Properties เลือก Tab Events >> ดับเบิลคลิกที่ช่องว่างของ DataReceived จะมีฟังก์ชัน serialPort1_DataReceived เพิ่มขึ้นมา

ประกาศฟังก์ชัน InvokeDelegate ลงในคลาส (เพื่อให้โปรแกรมทำงานหลายฟังก์ชันพร้อมกัน)

public delegate void InvokeDelegate();

จากนั้นไปที่ฟังก์ชัน serialPort1_DataReceived เพิ่มโค้ดเพื่อให้ฟังชัน InvokeDelegate ทำงานเมื่อพอร์ตอนุกรมมีข้อมูลเข้ามา โดยการทำงานคือเมื่อมีข้อมูลเข้ามาทางพอร์ตอนุกรมจะทำการอ่านข้อมูลและแสดงผลมาทาง textBox

private void serialPort1_DataReceived(object sender, SerialDataReceivedEventArgs e)
{
    textBox1.BeginInvoke(new InvokeDelegate(updateTextbox)); 
}
 void updateTextbox()
{
      string rx = serialPort1.ReadExisting();
    textBox1.Text = rx;
}

เท่านี้การก็เสร็จสิ้นการเขียนโปรแกรม รับ-ส่ง ข้อมูลผ่าน Visual Studio แล้วครับ


ทดสอบการทำงานของโปรแกรม
– คอมไพล์โปรเจคโดยกดปุ่ม Start

– โปรแกรมจะมีหน้าต่าง ดังภาพ

– เลือกคอมพอร์ท >> กดปุ่ม Connect เพื่อเชื่อมต่อโปรแกรมเข้ากับบอร์ด Arduino

              (ซ้าย) กดปุ่ม LED ON                

(ซ้าย) กดสวิตซ์ LED ON    

(ขวา) กดปุ่ม LED OFF

(ขวา) กดสวิตซ์ LED OFF


          จากบทความ เตรียมซอฟต์แวร์สำหรับ LattePanda และการสื่อสารกับบอร์ดเบื้องต้น จะเห็นได้ว่าบอร์ด LattePanda สามารถติดต่อสื่อสารกับบอร์ด Arduino ผ่านทางพอร์ทอนุกรมที่เชื่อมต่อกันอยู่ได้ ดังนั้นจึงสามารถใช้บอร์ด Arduino ให้เป็น Input หรือ Output ของบอร์ด LattePanda ได้ ตัวอย่างการใช้งานเช่น ใช้บอร์ด Arduino รับค่ามาจากเซ็นเซอร์ชนิดต่างๆ แล้วแสดงผลบนระบบปฏิบัติการ Windows, เขียนโปรแกรมจากทางระบบปฏิบัติการ Windows เพื่อสั่งงานให้บอร์ด Arduino ทำงาน เป็นต้น

>> ดูสินค้า LattePanda ทั้งหมด <<

หากท่านสนใจสินค้า LattePanda และสินค้าที่เกี่ยวข้อง ตัวอย่างเช่น จอแสดงผลและแผ่นทัชสกรีน สามารถเข้าชมได้ที่เว็บไซต์ www.ThaiEasyElec.com หรือติดต่อสอบถามได้ทางอีเมล sales@thaieasyelec.com โทรศัพท์ 02-954-2408 และ 089-514-8111 หรือที่ Facebook : www.facebook.com/ThaiEasyElec หรือทางไลน์ LINE : @thaieasyelec