Processing using bare conductive

Processing Electronics (Arduino, etc.)
1

Hello,

I’m French, my english is poor. But I can try.

I use Processing, as a librarian.

I also use Bare Conductive. I have Arduino.

So I can plug the Bare Conductive in Processing. With this sketch, I can see which electrode is touched or released.

import processing.serial.*;

final int baudRate = 57600;
final int numElectrodes = 12;

Serial inPort;  // the serial port
String inString; // input string from serial port
String[] splitString; // input string array after splitting
int[] status, lastStatus;

void updateArraySerial(int[] array) {
  if (array == null) {
    return;
  }

  for(int i = 0; i < min(array.length, splitString.length - 1); i++){
    try {
      array[i] = Integer.parseInt(trim(splitString[i + 1]));
    } catch (NumberFormatException e) {
      array[i] = 0;
    }
  }
}

void setup() {
  status = new int[numElectrodes];
  lastStatus = new int[numElectrodes];
  
  println((Object[])Serial.list());
  // change the 1 below to the number corresponding to the output of the command above
  inPort = new Serial(this, Serial.list()[0], baudRate); 
  inPort.bufferUntil('\n');
}

void draw() {
  size(100, 100);
background(0);
}

void serialEvent(Serial p) {
  inString = p.readString();
  splitString = splitTokens(inString, ": ");
  
  if (splitString[0].equals("TOUCH")) {
    updateArraySerial(status);
  }
    
  for (int i = 0; i < numElectrodes; i++) {
    if (lastStatus[i] == 0 && status[i] == 1) {
      // touched
      println("Electrode " + i + " was touched");
      lastStatus[i] = 1;
    } 
    else if(lastStatus[i] == 1 && status[i] == 0) {
      // released
      println("Electrode " + i + " was released");
      lastStatus[i] = 0;
    }
  }
}

How can I make a sketch using the input of Bare Conductive to interact with text, for example?

Something like:

Electrode 0 touched one word appears on the screen

Electrode 0 released the word goes off

And so it goes until electrode 11

Does anybody has an idea?

Thank you!

beginner

1 Like
2

You can create an array of words, then loop over the status array in the draw loop and if the status is 1, draw the corrosponding word to the screen.

Here is a tutorial on how to draw text to the screen: https://processing.org/tutorials/text/

As a side note, it is better to put the call to size inside setup as opposed to draw. This is because draw is called each frame, and calling size might cause the code to run slowly.

Please feel free to let me know if you need any more help.

final String[] WORDS = {
	"Electrode 0",
	"Electrode 1",
	"Electrode 2",
	"Electrode 3",
	"Electrode 4",
	"Electrode 5",
	"Electrode 6",
	"Electrode 7",
	"Electrode 8",
	"Electrode 9",
	"Electrode 10",
	"Electrode 11",
};

void setup() {
	size(100, 100);
	
	// choose your font and size
	PFont f = createFont("Arial", 16, true);
	textFont(f);
	
	status = new int[numElectrodes];
	lastStatus = new int[numElectrodes];
	
	println((Object[])Serial.list());
	// change the 1 below to the number corresponding to the output of the command above
	inPort = new Serial(this, Serial.list()[0], baudRate); 
	inPort.bufferUntil('\n');	
}

void draw() {
	background(0);
	fill(255);
	stroke(175);

	textAlign(LEFT);
	for (int i = 0; i < numElectrodes; i++) {
		if (status[i] == 1) {
			text(WORDS[i], width/numElectrodes * i, height/2);
		}
	}
}
1 Like
3

Hello,

I replaced some code to create simulated data.

An example to get you started:

final int numElectrodes = 12;

String inString; // input string from serial port
String[] splitString; // input string array after splitting
int[] status, lastStatus;

void updateArraySerial(int[] array) {
  if (array == null) {
    return;
  }

  for (int i = 0; i < min(array.length, splitString.length - 1); i++) {
    try {
      array[i] = Integer.parseInt(trim(splitString[i + 1]));
    } 
    catch (NumberFormatException e) {
      array[i] = 0;
    }
  }
}

void setup() {
  size(440, 100);
  status = new int[numElectrodes];
  lastStatus = new int[numElectrodes];
  textSize(48);
}

String s = "TOUCH:0:0:0:0:0:0:0:0:0:0:1:0:0"; // Initialized otherwise null

void draw() 
{ 
  background(0);

  // Creates some random data
  if (frameCount%30 == 0)
  {
    s = "TOUCH";  
    for (int i = 0; i < 12+1; i++)
    {
      s = s + ":" + int(random(0, 2));
    }
    println(s);
    printArray(splitString);
  }

  // Call serialevent if s is not null
  if (s != null)
    mySerialEvent(s);

  // Display text and change color depending on state
  for (int i = 1; i < 12+1; i++)
  {
    if (splitString[i].equals("1"))
      fill(255, 0, 0);
    else
      fill(0, 255, 0);

    text(splitString[i], 30*i, height/2 + 10);
  }
}

void mySerialEvent(String in) {
  inString = in;
  splitString = splitTokens(inString, ": ");

  if (splitString[0].equals("TOUCH")) {
    updateArraySerial(status);
  }

  for (int i = 0; i < numElectrodes; i++) {
    if (lastStatus[i] == 0 && status[i] == 1) {
      // touched
      println("Electrode " + i + " was touched");
      lastStatus[i] = 1;
    } else if (lastStatus[i] == 1 && status[i] == 0) {
      // released
      println("Electrode " + i + " was released");
      lastStatus[i] = 0;
    }
  }
}

image

:)

1 Like