|

Panduan Joystick Arduino Uno dan Processing Software

Joystick dan Processing

Joystick Dengan Arduino dan Processing – Pada projek kita akan membuat sebuah interface Joystick pada aplikasi Processing. Jika teman-teman ingin mengetahui lebih dalam tentang aplikasi Processing, bisa langsung akses ke website resminya dis.

Alur dari projek di ilustrasikan seperti pada gambar dibawah.

Cara mengontrol titik Joystick ke Aplikasi Processing

Pada Tutorial Joystick Menggunakan Arduino telah dibahas bagaimana cara mendapatkan nilai ADC dari Joystick. Sekarang bagaimana data tersebut kita visual kan dengan menggunakan aplikasi Processing. Ada beberapa langkah, yaitu membuat kode Processing, membuat Kode Arduino, dan membuat kode Arduino Smooth.

Kode Processing

Gambaran umum hasil dari kode yang akan kita buat adalah meletakkan sebuah titik hitam pada latar halaman berwarna biru, dimana letak titik tersebut sesuai dengan koordinat X dan Y dari nilai ADC Joystick.
Jika joystick di dimainkan, maka titik akan bergerak sesuai arah tuas joystick. Ketika tombol ditekan, maka warna latar akan berubah menjadi kuning. Perhatikan program berikut:

//hamboelektronik.com //
//--------------------//

import processing.serial.*; //masukkan class untuk mengirim dan menerima data menggunakan komunikasi serial
Serial get; //tetapkan kata "get" sebagai bagian dari Serial

int x = 0;
int y = 0;
int b = 0;
PFont huruf;

void setup()
{
size(1023, 1023); //buat kanvas dengan ukuran 1023*1023px
get = new Serial(this, "COM6", 250000); //Ubah COM6 sesuai dengan port arduino.
get.bufferUntil('n');

huruf = createFont("Arial", 16, true); //Buat font untuk informasi korrdinat di kanvas
textFont(huruf, 16); //Pilih ukuran font 16px
}
void draw()
{
clear(); //bersihkan layar, berguna ketika program lopp dijalankan
fill(0); //buat warna text dan objek lingkaran menjadi warna hitam
background(0, 191, 255); //atur warna biru untuk latar belakang kanvas

if (b == 1) { //jika tombol di tekan
background(255, 255, 21); //maka ubah warna latar belakang kanvas menjadi kuning
circle(x, y, 25); //buat lingkaran
} else
{
circle(x, y, 25); //buat lingkaran
}

text("Hambo Elektronik",+ 10, 20); //buat text disebelah kiri atas kanvas
text("Nilai X = "+(1023-x),+ 10, 40); //tampilkan text koordinat X disebelah kiri atas kanvas
text("Nilai Y = "+(1023-y),+ 10, 60); //tampilkan text koordinat Y disebelah kiri atas kanvas
}
void serialEvent (Serial get)
{
String a = get.readStringUntil('n'); //Dapatkan data String Arduino Serial
String[] vals = splitTokens(a, ", "); //Data String di pisah berdasarkan koma dan dimasukkan kedalam array

x = int(vals[0]); //ambil array pertama sebagai korrdinat X
y = int(vals[1]); //ambil array kedua sebagai korrdinat Y
b = int(vals[2]); //ambil array ketiga untuk kondisi tombol, jika 1 artinyatombol ditekan

}

Kode Arduino

Di s arduino akan mengirimkan data ke serial port dengan format data “xxx, xxx, x, “. Data akan dibaca dan akan dipilah oleh processing. Berikut adalah programnya.

//hamboelektronik.com//
//-------------------//
int adc_x = 0;
int adc_y = 0;
int tombol = 0;

void setup()
{
Serial.begin(250000);
pinMode(2, INPUT);
}

void loop()
{
adc_x = analogRead(A0);
adc_y = analogRead(A1);
tombol = digitalRead(2);

Serial.print(adc_x, DEC);
Serial.print(", ");
Serial.print(adc_y, DEC);
Serial.print(", ");
Serial.print(!tombol, DEC);
Serial.println(", ");

}

Silahkan upload ke Arduino dengan program diatas. Kemudian jalankan aplikasi Processing. Silahkan gerakkan tuas Joystick, maka titik hitam pada tampilan processing akan bergerak searah dengan pergerakan tuas.

Kode Arduino Smooting Joystick

Jika teman-teman menggunakan program arduino diatas, data bisa diterima oleh processing, namun jika di perhatikan lebih fokus ke titik pada layar kanvas, titik hitam akan bergetar.
Ini sebabnya adalah nilai ADC yang terus berubah pada angka terakhir. Untuk mengatasi dan nilai ADC lebih tenang tidak cepat berubah nilainya, maka kita gunakan program smooting atau halus, perhatikan program berikut.

//hamboelektronik.com//
//-------------------//

int adc_x = 0;
int adc_y = 0;
int tombol = 0;
const int jumlah_baca = 10;
int xBaca[jumlah_baca];
int yBaca[jumlah_baca];
int jumlahArrayX = 0;
int jumlahArrayY = 0;
int xNilai = 0;
int yNilai = 0;

void setup()
{
Serial.begin(250000);
pinMode(2, INPUT);
}

void loop()
{
xNilai = xNilai - xBaca[jumlahArrayX];
yNilai = yNilai - yBaca[jumlahArrayY];

xBaca[jumlahArrayX] = analogRead(A0);
yBaca[jumlahArrayY] = analogRead(A1);

xNilai = xNilai + xBaca[jumlahArrayX];
yNilai = yNilai + yBaca[jumlahArrayY];

jumlahArrayX = jumlahArrayX + 1;
jumlahArrayY = jumlahArrayY + 1;

if (jumlahArrayX >= jumlah_baca) {
jumlahArrayX = 0;
}
if (jumlahArrayY >= jumlah_baca) {
jumlahArrayY = 0;
}

adc_x = xNilai / jumlah_baca;
adc_y = yNilai / jumlah_baca;
tombol = digitalRead(2);


Serial.print(adc_x, DEC);
Serial.print(", ");
Serial.print(adc_y, DEC);
Serial.print(", ");
Serial.print(!tombol, DEC);
Serial.println(", ");

}

Silahkan teman-teman upload ke arduino, kemudian jalankan processing. Teman-teman dapat melihat pergerakan yang lebih halus dari titik koordinat.

Semoga bermanfaat.

Similar Posts