Using an Arduino LDR Sensor to switch backgrounds in Processing - arduino

Question

Using a LDR sensor for Arduino, I want to switch between two gif backgrounds in Processing depending on the intensity of light that the LDR senses. My Arduino set-up works and I can see a range of numbers in the Serial Monitor depending on the amount of light shined on the sensor - however I'm having trouble in Processing with making the switch between backgrounds. This is my first project combining Arduino with Processing so please forgive me if I've made any super obvious mistakes.
Arduino Code
int sensorPin = A0; // select the input pin for LDR
int sensorValue = 0; // variable to store the value coming from the sensor
void setup() {
Serial.begin(9600); //sets serial port for communication
}
void loop() {
sensorValue = analogRead(sensorPin); // read the value from the sensor
Serial.println(sensorValue); //prints the values coming from the sensor on the screen
delay(100);
}
Processing Code
//loads gif library for background
import gifAnimation.*;
Gif batmanGotham;
Gif batmanLair;
//loads Arduino
import processing.serial.*;
Serial myPort;
int sensorValue = 0;
void setup() {
size(1067, 800); //size of canvas
batmanGotham = new Gif(this, "background.gif"); //set gif
batmanGotham.play();
batmanLair = new Gif(this, "batman_lab.gif"); //set second gif
batmanLair.play();
String portName = "/dev/cu.usbmodem14201";
myPort = new Serial(this, portName, 9600);
myPort.bufferUntil('\n');
}
void draw() {
}
void serialEvent (Serial myPort) {
if (sensorValue > 300) {
image(batmanLair, 0, 0); //lays down gif background
} else {
image(batmanGotham, 0, 0); //lays down gif background
}
}

Answer 1

You forgot to read data from the serial port, try adding the following line on your serialEvent() routine:
byte[] buffer = new byte[2];
sensorValue = myPort.readBytes(buffer);
at the very beginning.
As you see you have to recover data from the buffer yourself. The event is triggered automatically whenever there is something to read but you have to take is yourself from there and store it or process it.
You should be reading two bytes at a time to account for the size of the int you are sending from your Arduino.

Answer 2

Marcos is right, through you will be sending more than two bytes.
Let's assume you're sending 1023, that is actually 4 characters (bytes) + another new line (from println).
You can draw continuously and simply update the image based on the data read, ideally with some error checking:
//loads gif library for background
import gifAnimation.*;
Gif batmanGotham;
Gif batmanLair;
//loads Arduino
import processing.serial.*;
Serial myPort;
int sensorValue = 0;
void setup() {
size(1067, 800); //size of canvas
batmanGotham = new Gif(this, "background.gif"); //set gif
batmanGotham.play();
batmanLair = new Gif(this, "batman_lab.gif"); //set second gif
batmanLair.play();
String portName = "/dev/cu.usbmodem14201";
try{
myPort = new Serial(this, portName, 9600);
myPort.bufferUntil('\n');
}catch(Exception e){
println("error opening serial port: double check the cable is connected, the portName is right and SerialMonitor anything else trying to access the port is closed");
e.printStackTrace();
}
}
void draw() {
if (sensorValue > 300) {
image(batmanLair, 0, 0); //lays down gif background
} else {
image(batmanGotham, 0, 0); //lays down gif background
}
}
void serialEvent (Serial myPort) {
try{
String rawString = myPort.readString();
if(rawString != null && rawString.length() > 0){
// remove newline
rawString = rawString.trim();
// parse value
sensorValue = int(rawString);
}
}catch(Exception e){
println("error parsing serial data");
e.printStackTrace();
}
}
If you want to keep the Processing Serial part simpler, you can do the threshold logic on arduino and simply send a single byte to Processing, like 1 or 0 depending on which image you want to display:
int sensorPin = A0; // select the input pin for LDR
int sensorValue = 0; // variable to store the value coming from the sensor
void setup() {
Serial.begin(9600); //sets serial port for communication
}
void loop() {
sensorValue = analogRead(sensorPin); // read the value from the sensor
if(sensorValue > 0){
Serial.print('1');
}else{
Serial.print('0');
}
delay(100);
}
Then in Processing:
//loads gif library for background
import gifAnimation.*;
Gif batmanGotham;
Gif batmanLair;
//loads Arduino
import processing.serial.*;
Serial myPort;
boolean showLair;
void setup() {
size(1067, 800); //size of canvas
batmanGotham = new Gif(this, "background.gif"); //set gif
batmanGotham.play();
batmanLair = new Gif(this, "batman_lab.gif"); //set second gif
batmanLair.play();
String portName = "/dev/cu.usbmodem14201";
try{
myPort = new Serial(this, portName, 9600);
}catch(Exception e){
println("error opening serial port: double check the cable is connected, the portName is right and SerialMonitor anything else trying to access the port is closed");
e.printStackTrace();
}
}
void draw() {
// read 1 char
if(myPort != null && myPort.available() > 0){
char fromArduino = myPort.read();
showLair = (fromArduino == '1');
}
// update content
if (showLair) {
image(batmanLair, 0, 0); //lays down gif background
} else {
image(batmanGotham, 0, 0); //lays down gif background
}
}