ตอนที่ 4 : พูดคุยกับ Arduino บน PC กันก่อนดีกว่า

ตามที่ได้เกริ่นไว้แต่แรกว่า เราจะทำการเชื่อมต่อไปยัง Arduino ด้วยสาย USB แบบ OTG ส่วนการจะเชื่อมต่อด้วยวิธีอื่นๆ ผมเองไม่มีตัว Module อื่นๆ อยู่ แต่ถ้าจะมีใครใจดีช่วยจัดหาให้ ก็ยินดีที่จะทดลองการเชื่อมต่อแบบอื่นๆ

บทความตอนนี้จะทดลองเชื่อมต่อผ่านทาง PC เพื่อให้เห็นการเตรียมการต่างๆ ก่อน จากนั้นก็จะสามารถนำไปใช้ตอนที่จะเชื่อมต่อกับ Android ได้

เริ่มกันเลย โดยเปิดโปรแกรม Arduino ก่อน เพื่อสร้างโปรแกรมสำหรับโต้ตอบกับ Processing ได้ พิมพ์โปรแกรมตามนี้


void setup(){
  pinMode(11,OUTPUT);
  digitalWrite(11,LOW);
  Serial.begin(9600);
}

void loop(){
  Serial.println(random(255));
  delay(100);
  if(Serial.available()){
    while(Serial.available()){
      if(Serial.read() == 'B')
        digitalWrite(11, !digitalRead(11));
    }
  }
}

ที่บอร์ดต่อ LED ที่ Pin 11 กับ Gnd จากนั้นทดลอง Run โปรแกรม และเปิด Serial Monitor สังเกตุให้ค่า Baudrate เท่ากับ 9600 นะครับ

ตอนนี้จะเห็นหน้าจอแสดงตัวเลขแบบแรนดอม ที่ออกจากคำสั่ง Serial.println(random(255));

ให้พิมพ์ตัว B ลงในช่องรับข้อมูล ตามด้วยการเคาะ Enter จะเห็นว่า LED ที่ต่อไว้ติดสว่าง พิมพ์ B ตามด้วย Enter อีกครั้ง จะเห็นว่า LED ดับลง ตามคำสั่งเปรียบเทียบการอ่านค่าด้วย Serial.read ว่าเท่ากับตัวอักษร B หรือไม่ ถ้าเงื่อนไขถูกต้องก็ไปทำคำสั่ง 

digitalWrite(11, !digitalRead(11));

ก็คือถ้า LED ติดอยู่ก็ให้ดับ ถ้าดับอยู่ก็ให้ติด สลับไปมา

ถ้าได้ตามนั้นแล้วก็ทำในส่วนของ Processing ต่อไป ถ้าไม่ได้ก็ลองดูว่า มีตรงไหนที่พิมพ์ผิดไปบ้าง

เปิดโปรแกรม Processing ตามสะดวกนะครับ ว่าจะใช้ Mode ไหน ใช้ได้ทั้ง Java และ PDE X ครับ พิมพ์โค๊ดตามนี้ครับ


import controlP5.*;
import processing.serial.*;

ControlP5 cp5;
Serial port;

String inData="";

void setup(){
  size(600,600);
  
  println(Serial.list());
  port = new Serial(this, Serial.list()[1], 9600);
  port.clear();
  port.bufferUntil('\n');
  
  cp5 = new ControlP5(this);
  
  cp5.addTextfield("text1")
     .setPosition(100,100)
     .setSize(100,20)
     .setCaptionLabel("Data")
     .setFont(createFont("Verdana", 16))
     ;
  
  cp5.addButton("button1")
     .setValue(0)
     .setPosition(250, 100)
     ;
     
  cp5.addSlider("slider1")
     .setPosition(150,200)
     .setValue(100)
     .setMax(255)
     .setMin(0)
     ;
     
  cp5.addKnob("knob1").setSize(100,200)
     .setPosition(150,250)
     .setMax(255)
     .setMin(0)
     .setValue(100)
     ;
}

void draw(){
  Textfield t = (Textfield) cp5.getController("text1");
  t.setText(inData);
  cp5.getController("slider1").setValue(int(inData));
  cp5.getController("knob1").setValue(int(inData));
}

void button1(int value)
{
  println("Button pressed");
  port.write("B");
}

void serialEvent(Serial port){
  inData = port.readStringUntil('\n');
  inData = trim(inData);
}

ทดลอง Run เลยครับ ก่อน Run ให้ปิดจอ Serial monitor ก่อน ไม่งั้นจะเกิด Error ได้

ให้ดูในช่องด้านล่างจะเห็นรายการ COM ในภาพเห็นอยู่ 2 บรรทัด ของผมเลือก [1] เพราะ Arduino ต่ออยู่กับ COM4 ถ้าของใครต่อกับคอมอื่น ก็ให้ดูว่าตัวเลขในวงเล็บเป็นหมายเลขใดก็เอาหมายเลขนั้นไปใส่ในโปแกรม ตรงส่วนนี้ครับ

port = new Serial(this, Serial.list()[1], 9600);

ตัวอย่างถ้าตัวเลขในวงเล็บหน้า COM ที่ต่ออเป็น 10 ก็เปลี่ยน [1] เป็น [10]

                   port = new Serial(this, Serial.list()[10], 9600);

ตามนี้ครับ 

กด Stop หรือ ปิดหน้าต่าง แล้วทดลอง Run อีกครั้ง จะได้ผลการทดสอบตามนี้

ถ้าทั้งหมดทำงานถูกต้อง จะเห็นมีการเปลี่ยนของตัวเลขและการเลื่อนไปมาของแถบสีในช่อง แล้วเสี้ยวในวงกลมก็จะขยับไปมา ทั้งหมดเป็นการนำเอาตัวเลขที่ Arduino ส่งมา มาปรับค่า

คราวนี้ทดลองเลื่อนเม้าส์ไปที่ BUTTON แล้วกดปุ่มที่เม้าส์ จะเห็นว่า LED ที่ Arduino จะติด-ดับ เหมือนตอนป้อนตัวอักษร B ใน Serial monitor

ผมเดาว่าตอนนี้ถ้าได้อ่านใน Source code ก็พอจะเดาได้ว่า ส่วนไหนทำอะไร

เพื่อไม่ให้หน้านี้ยาวเกินไป ขอยกยอดไปพูดถึงรายละเอียดในหน้าต่อไป

อ้อ คราวนี้ เราได้เพิ่มการใช้งาน library 2 ตัว คือ ControlP5 และ Serial สังเกตุจากคำสั่ง import ด้านบนสุดของโค๊ด

//-----------------------------------------------------------------

เพิ่มเติมครับ ต้องขอโทษผมลืมส่วนสำคัญมากๆ คือการเอา ControlP5 มาใช้งาน ไม่งั้นก็จะคอมไฟล์ไม่ผ่าน 

การนำ ControlP5 เข้ามา ให้เข้าที่
Sketch -> Import Library... -> Add Library แล้วเลือก ControlP5 กดปุ่ม Install เมื่อติดตั้งเสร็จก็เปิดปิดโปรแกรมครั้งหนึ่ง

//------------------------------------------------------------------

ตัวช่วย ของ ตัวช่วย

ControlP5