Arduino to processing, ultrasonic sensor and pushbutton

Using Arduino Interfacing w/ Software on the Computer
#1

Hi all,

I’m busy with a project in processing where I made a rogram which I can control with the arrow keys.

int maxImages = 5; // Total number of images

int i = 0;
int firstImage = i; // First image defined

int p = 1;
int pixelImage = p;

int pixelSize;

PImage[] img = new PImage[maxImages]; // Array of images

void setup() {
  size(500, 500);
}

void draw() {
  for (int firstImage = i; firstImage < img.length; firstImage++) {
    img[firstImage] = loadImage(firstImage + ".jpg");

    pixelateImage(p);    // Change pixel size
  }
}

void pixelateImage(int pixelSize) {

  // use ratio of height/width...
  float ratio;
  if (width < height) {
    ratio = height/width;
  } else {
    ratio = width/height;
  }

  // ... to set pixel height
  int pixelHeight = int(pixelSize * ratio);

  noStroke();
  for (int x=0; x<width; x+=pixelSize) {
    for (int y=0; y<height; y+=pixelHeight) {
      fill(img[firstImage].get(x, y));
      //rectMode(CENTER);
      rect(x, y, pixelSize, pixelHeight);
    }
  }
}

void keyPressed() {
  if (key == CODED) {
    if (keyCode == LEFT) {
      // Next image when mouse is clicked
      // Note the index to the array must be an integer!
      firstImage ++;

      if (firstImage > 4) {
        firstImage = 0;
      }
    }

    if (keyCode == RIGHT) {

      firstImage --;

      if (firstImage < 0) {
        firstImage = 4;
      }
    }

    if (keyCode == UP) {
      p = (p+10);

      if (p > 250) {
        p = 250;
      }
    }

    if (keyCode == DOWN) {
      p = (p-10);

      if (p < 1) {
        p = 1;
      }
    }
  }
}

As you can see with the right and left arrow you can scroll through the different images and with the up and down arrow you can change the pixel size.

Now I want to connect the program with Arduino and use one pushbutton to scroll through the images so when you push the button you go to the next image and when you’re at the last image you go back to the first image and start over again. Further I want to connect the pixel size to a ultrasonic sensor. So when you hand is close to the sensor the image should be scharp (1 px x 1 px) and when you are further away like 50 cm the image schould be pixelated (250 px x 250 px). I think the values should be like:

… - 10 cm → 1px x 1px
10 - 20 cm → 50 px x 50 px
20 - 30 cm → 100 px x 100 px
30 - 40 cm → 150 px x 150 px
40 - 50 cm → 200 px x 200 px
50 - … cm → 250 px x 250 px

Can anybody help me with connecting arduino and processing and get the right data input.

Thanks MB

#2

I already connected the pixel size to the ultrasonic sensor. Still have to define the different ranges. After that I’m going to built int the button.

Code now looks like this.

import processing.serial.*;
String comPortString;
Serial myPort;

int maxImages = 5; // Total number of images

int i = 0;
int firstImage = i; // First image defined

int p = 1;
int pixelImage = p;

int pixelSize;

PImage[] img = new PImage[maxImages]; // Array of images

void setup() {
  size(500, 500);

  myPort = new Serial(this, "COM3", 9600);
  myPort.bufferUntil('\n'); // Trigger a SerialEvent on new line
}

void draw() {
  for (int firstImage = i; firstImage < img.length; firstImage++) {
    img[firstImage] = loadImage(firstImage + ".jpg");

    pixelateImage(p);    // Change pixel size
  }
}

void pixelateImage(int pixelSize) {

  // use ratio of height/width...
  float ratio;
  if (width < height) {
    ratio = height/width;
  } else {
    ratio = width/height;
  }

  // ... to set pixel height
  int pixelHeight = int(pixelSize * ratio);

  noStroke();
  for (int x=0; x<width; x+=pixelSize) {
    for (int y=0; y<height; y+=pixelHeight) {
      fill(img[firstImage].get(x, y));
      //rectMode(CENTER);
      rect(x, y, pixelSize, pixelHeight);
    }
  }
}

void serialEvent(Serial cPort) {
  comPortString = cPort.readStringUntil('\n');
  if (comPortString != null) {
    comPortString=trim(comPortString);

    p = int(map(Integer.parseInt(comPortString), 1, 200, 1, 250));
    if (p<5) {

      p = 1;
    }
    if (p>50) {

      p = 250;
    }
  }
}
#3 
  for (int firstImage = i; firstImage < img.length; firstImage++) {

There are several problems with this statement. First, using i as the name of a global variable is not a trait of the sharpest crayon in the box. Using longer names for global variables makes it far less likely that you will inadvertently overwrite the value in the variable.

Second, the firstImage variable in this statement is NOT the same as the global firstImage variable.

Third, using first in the name of a loop variable is silly. When the loop iterates, it’s no longer the first time.

Finally, iterating through all of the images in the array on every pass through draw conflicts with using the arrow keys (or a switch connected to the Arduino) to move through the images.

#4