[TUTORIAL] Pemrograman GUI pada Processing (Part - 2)
Pendahuluan
Pada percobaan ini, kita akan mengontrol intensitas nyala LED pada Arduino berdasarkan input nilai Slider pada Processing. Pengguna akan mengatur posisi Slider berdasarkan GUI yang telah kita buat pada Processing. Agar lebih menarik, kita akan mengatur warna pada lingkaran yang kita gambar pada Processing. Semakin terang LED, maka warna lingkaran akan semakin merah.
Konfigurasi Hardware
Sebagai langkah awal, tempatkanlah sebuah LED pada pin 9. Kita dapat menempatkan di pin yang lain, asalkan memiliki fungsi PWM (pin 3,5,6,9,10, dan 11). Pin-in ini ditandai dengan lambang tidle ( ~ ) pada papan Arduino. Jangan lupa untuk menempatkan sebuah resistor untuk mengamankan LED dari kelebihan arus (100 - 1kOhm dirasa cukup). Amatilah Gambar 1.
Gambar 1. Konfigurasi LED pada Arduino
Pemrograman Arduino
Arduino akan menerima data dari Processing berdasarkan posisi Slider. Pada sisi Arduino, buatlah skrip berikut:
// sedikan variabel untuk byte masuk int incomingByte = 0; void setup() { Serial.begin(9600); } void loop() { // jika terjadi komunikasi secara serial: if (Serial.available() > 0) { // baca byte yang masuk incomingByte = Serial.read(); // tulis nilai yang diperoleh dari Slider ke pin 9 analogWrite(9,incomingByte); } }
Data yang masuk memiliki format byte. Byte memiliki rentang nilai sebesar 8-bit, yaitu antara 0 - 255. Karena fungsi analogWrite adalah perintah untuk membangkitkan PWM sebesar 8-bit, maka penggunaan tipe data byte adalah tepat.
Pemrograman Processing
Processing bertugas untuk menangkap data dari Slider dan mengirimkannya ke Arduino. Nilai Slider yang ditangkap juga akan digunakan untuk mengatur warna pada lingkaran. Pada sisi Processing, buatlah skrip berikut:
import g4p_controls.*; import processing.serial.*; Serial portSerial; GCustomSlider sliderku; void setup() { size(600, 400); // atur properti Slider sliderku = new GCustomSlider(this, 100, 300, 400, 50, "red_yellow18px"); sliderku.setShowDecor(false, true, true, true); sliderku.setNbrTicks(5); sliderku.setLimits(0, 0, 255); // sesuikan nomer COM Anda. Disini digunakan COM5 portSerial = new Serial(this, "COM5", 9600); } void draw() { background(#E1F022); // atur tebal garis lingkaran strokeWeight(10); // buat warna putih pada garis lingkaran stroke(255); // atur komposisi warna merah berdasarkan nilai Slider fill(sliderku.getValueI(), 0, 0); // buat objek lingkaran ellipse(300, 160, 255, 255); // kirim nilai Slider ke Arduino portSerial.write(sliderku.getValueI()); delay(100); }
Sambil menggeser-geser Slider, amatilah perubahan intensitas pada LED Arduino dan perubahan warna lingkaran pada Processing.
Gambar 2. GUI pada Processing untuk Mengontrol LED pada Arduino
Demikian tutorial kali ini. Pada tutorial selanjutnya, kita akan mengotrol servo. Semoga bermanfaat
Mari Gabung
Halo
, Ada yang ingin disampaikan? Jangan sungkan untuk gabung diskusi ini. Silahkan Login dulu atau Daftar baru.