# Processing and Arduino standard Firmata: switching PShape with another PShape pressing a button on Arduino

**URL:** <https://discourse.processing.org/t/processing-and-arduino-standard-firmata-switching-pshape-with-another-pshape-pressing-a-button-on-arduino/35162>\
**Category:** Coding Questions\
**Created:** [February 14, 2022, 1:07pm UTC](https://discourse.processing.org/t/processing-and-arduino-standard-firmata-switching-pshape-with-another-pshape-pressing-a-button-on-arduino/35162 "2022-02-14T13:07:34Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![ata](https://avatars.discourse-cdn.com/v4/letter/a/5fc32e/32.png) [@ata](https://discourse.processing.org/u/ata)\
**Post date:** [February 14, 2022, 1:07pm UTC](https://discourse.processing.org/t/processing-and-arduino-standard-firmata-switching-pshape-with-another-pshape-pressing-a-button-on-arduino/35162/1 "2022-02-14T13:07:34Z")

</div>

hello. i am creating an arduino machine. it is talking to processing using the library standardFirmata(arduino). in this arduino there are three elements: two buttons and a joystick. a Pshape can be moved in the sketch with the joystick. the action of pressing the first button will stamp the Pshape on the sketch. these elements are working. now i want to add a second button, to change the Pshape with another different pshape( and then everytime i am pressing a button i want a third and a fourth phshape to appear instead of the first one … and so on and then starting againg with the first pshape in a loop) i dont know how to code this latter button.

this is my code

PShape rectangle;  
PShape triangle;  
PShape circle;  
PShape s;  
PShape n;  
PShape iletter;  
PShape e;  
PShape o;  
PShape u;  
PShape v;

IntList cx = new IntList();  
IntList cy = new IntList();  
int xpos = 250;  
int ypos = 250;  
int counter=0;

import processing.serial._;  
import cc.arduino._;  
Arduino arduino;  
//PShape square, circle, tri;

int count = 0;

void setup() {  
size(500, 500);  
smooth();  
// Prints out the available serial ports.  
println(Arduino.list());  
arduino = new Arduino(this, Arduino.list()[0], 57600);

// Alternatively, use the name of the serial port corresponding to your  
// Arduino (in double-quotes), as in the following line.  
// arduino = new Arduino(this, “/dev/tty.usbmodem621”, 57600);

// Set the Arduino digital pins as inputs.

arduino.pinMode(3, Arduino.INPUT);  
arduino.pinMode(2, Arduino.INPUT);

//square=createShape(RECT, width/2, height/2, 50, 50);  
//circle=createShape(ELLIPSE, width/2, height/2, 50, 50);  
//tri = createShape(TRIANGLE, 300, 275, 325, 225, 275, 225);

rectangle = loadShape(“rectangle.svg”);  
triangle = loadShape(“triangle.svg”);  
circle = loadShape(“circle.svg”);  
s = loadShape(“s.svg”);  
n = loadShape(“n.svg”);  
iletter = loadShape(“iletter.svg”);  
e = loadShape(“e.svg”);  
o = loadShape(“o.svg”);  
u = loadShape(“u.svg”);  
v = loadShape(“v.svg”);  
}

void draw() {

if (arduino.digitalRead(2)==Arduino.HIGH) {  
counter++;  
}  
if (counter == 1) {

```
//draw shape1

```

} else if (counter == 2) {

```
//draw shape2

```

} else if (counter == 3) {

```
//draw shape3

```

} else if (counter == 4) {

```
//draw shape1

```

} else if (counter == 5) {

```
counter=1;

```

}

// println(cx.size());  
// println(arduino.analogRead(0));

if (arduino.analogRead(0)\<300) {  
xpos-=5;  
} else if (arduino.analogRead(0)\>700) {  
xpos+=5;  
}  
if (arduino.analogRead(1)\>700) {  
ypos-=5;  
} else if (arduino.analogRead(1)\<300) {  
ypos+=5;  
}

//resize = map(arduino.analogRead(2),0,1023,0.1,2);

background(255);  
fill(127);  
for (int i = 0; i \< cx.size(); i++) {  
int px = cx.get(i);  
int py = cy.get(i);

```
fill(px, py, 200);
//this one is the stamp
shape(v, px, py, 150, 150);
// shape(iletter, px, py, 150, 150);
// shape(u, px, py, 150, 150);
// shape(o, px, py, 150, 150);
// //rect(px, py, 100, 100);

```

}

fill(mouseX, mouseY, 200);

//this one is the cursor  
shape(v, xpos, ypos, 50, 50);  
// shape(iletter, xpos, ypos, 50, 50);  
// shape(u, xpos, ypos, 50, 50);  
// shape(o, xpos, ypos, 50, 50);  
//ellipse(xpos, ypos, 50, 50);

if (arduino.digitalRead(3)==Arduino.HIGH) {  
cx.append(xpos);  
cy.append(ypos);  
}  
}

if (arduino.digitalRead(2) == Arduino.HIGH) {

count++;  
delay(250);  
if (count==1) {  
fill(255, 0, 0);  
shape(square);  
}  
if (count==2) {  
shape(circle);  
}

if (count==3) {

```
fill(0, 0, 255);
shape(tri);

```

}  
if (count==4) {  
count=1;  
}  
}

// Draw a circle whose size corresponds to the value of an analog input.  
//noFill();  
//for (int i = 0; i \<= 2; i++) {  
// ellipse(280 + i \* 30, 240, arduino.analogRead(i) / 16, arduino.analogRead(i) / 16);  
//}

\*/

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [February 16, 2022, 3:33pm UTC](https://discourse.processing.org/t/processing-and-arduino-standard-firmata-switching-pshape-with-another-pshape-pressing-a-button-on-arduino/35162/2 "2022-02-16T15:33:41Z")

</div>

Hello ata!

Welcome to the forum!

> [@ata](#):
>
> add a second button, to change the Pshape with another different pshape( and then everytime i am pressing a button i want a third and a fourth phshape to appear instead of the first one …

you are almost there

you have implemented a variable counter and when the button is pressed you say `counter++` :

```auto
if (arduino.digitalRead(2)==Arduino.HIGH) {
    counter++;
}

```

You evaluate counter with if… - just draw the different cursor types there:

```auto
 //this one ARE the cursors
 if (counter == 1) {

//draw shape1
 shape(v, xpos, ypos, 50, 50);

} else if (counter == 2) {

//draw shape2
 shape(iletter, xpos, ypos, 50, 50);

} else if (counter == 3) {

//draw shape3
 shape(u, xpos, ypos, 50, 50);

} else if (counter == 4) {

//draw shape 4
 shape(o, xpos, ypos, 50, 50);

...

```

* * *

**And with the stamp situation:**

When placing a stamp, you add data to cx,cy.

For the stamp make a 3rd IntList “cShapeType” to hold the counter (the shape type):

```auto

 //this one ARE the STAMPS
if (arduino.digitalRead(3)==Arduino.HIGH) {

cx.append(xpos);
cy.append(ypos);

//append shape type
cShapeType.append(counter); // !!!!!!!!!!!!!!!

```

* * *

**We change how you evaluate cx,cy**

Here you display all old stamps in a for-loop.

This is your for-loop:

```auto
background(255);
fill(127);
for (int i = 0; i < cx.size(); i++) {
int px = cx.get(i);
int py = cy.get(i);

fill(px, py, 200);
//this one is the stamp
shape(v, px, py, 150, 150);
// shape(iletter, px, py, 150, 150);
// shape(u, px, py, 150, 150);
// shape(o, px, py, 150, 150);
// //rect(px, py, 100, 100);

}

```

I suggest something like (very similar to how we did the cursor above!)

```auto
background(255);
fill(127);

for (int i = 0; i < cx.size(); i++) {

    int xpos= cx.get(i);
    int ypos= cy.get(i);

    fill(xpos, ypos, 200);

    //this one is the stamp
     if (cShapeType.get(i) == 1) {

    //draw shape1
     shape(v, xpos, ypos, 50, 50);
    
    } else if (cShapeType.get(i)== 2) {

//draw shape2
 shape(iletter, xpos, ypos, 50, 50);

} else if (cShapeType.get(i)== 3) {

//draw shape3
 shape(u, xpos, ypos, 50, 50);

} else if (cShapeType.get(i)== 4) {

//draw shape 4
 shape(o, xpos, ypos, 50, 50);

...

}

// shape(v, px, py, 150, 150);
// shape(iletter, px, py, 150, 150);
// shape(u, px, py, 150, 150);
// shape(o, px, py, 150, 150);
// //rect(px, py, 100, 100);

}

```

_(not tested)_

Warm regards,

Chrisir 😉
