# Bouncing ellipses
**URL:** https://discourse.processing.org/t/bouncing-ellipses/12525
**Category:** Coding Questions
**Tags:** homework
**Created:** [July 5, 2019, 2:35pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525 "2019-07-05T14:35:49Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@sileo](https://discourse.processing.org/u/sileo)
#### Post date: [July 5, 2019, 2:35pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/1 "2019-07-05T14:35:49Z")
Hi everybody! I’m a new user in this forum and I’d like to know if someone could help me with this:
A red ellipse that bounces vertically when you press “A”
A blue ellipse that bounces horizontally when pressing “B”
A green ellipse that bounces diagonally when pressing “C”.
“D” stops all the movement.
I’ve tried with a code but there are some fails. : roll\_eyes:
---
### Author:  [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [July 5, 2019, 2:36pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/2 "2019-07-05T14:36:50Z")
Is this homework? This sounds a bit like homework.
Can you share the code you wrote that failed, and give what the error message was that got you stuck?
---
### Author:  [@sileo](https://discourse.processing.org/u/sileo)
#### Post date: [July 5, 2019, 2:46pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/3 "2019-07-05T14:46:55Z")
Yes, this is homework. But i think it doesn’t matter. Here is the code:
```auto
float circleX;
float xspeed = 1;
float circleY;
float yspeed = 1;
float circleXY;
float xyspeed = 1;
void setup() {
size(640, 360);
circleX = 0;
}
void draw() {
background(51);
fill(48, 90, 206);
stroke(255);
ellipse(circleX, 180, 32, 32);
if(key == 'a') {
circleX = circleX + xspeed;
if(circleX > width || circleX < 0)
xspeed = xspeed * -1.0;
}
fill(255,0,2);
ellipse(300, circleY, 32, 32);
if(key == 'b') {
circleY = circleY + yspeed;
if(circleY > height || circleY < 0)
yspeed = yspeed * -1.0;
}
fill(0,400,0);
ellipse(circleXY, circleXY, 32, 32);
if(key == 'c') {
circleXY = circleXY + xyspeed;
if(circleXY > height || circleXY < 0)
xyspeed = xyspeed * -1.0;
}
}
```
The problem with this code is that it doesn’t keep the 3 balls moving at the same time and I don’t know how to use the D to stop the whole movement.
---
### Author:  [@WeinSim](https://discourse.processing.org/u/WeinSim)
#### Post date: [July 5, 2019, 5:26pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/4 "2019-07-05T17:26:49Z")
Ok nice try for a beginner. There is just one major mistake you made:
The `key` variable stores the key that was most recently pressed. So when A is pressed, the first circle starts moving, but then when you press B, the `key`variable now holds ‘b’ and not ‘a’ anymore. So the first circle stops moving.
A way to fix this problem (and also the other one that d stops all circles) is to give each each ball a variable that tells wether they are currently moving or not. The datatype we’d use for this is `boolean`, since it is either `true` or `false`. You can name those for example
```auto
boolean circlexMoving;
boolean circleyMoving;
boolean circlexyMoving;
```
These will automatically be set to `false` when the sketch is started. (Btw, the second line in your code in `void setup()` is actually not necessary, since floats and ints always start at a value of 0).
The next change you need to make is that when the buttons a, b or c are being pressed, instead of moving the balls in the corresponding direction, you set the corresponding boolean to true.
For example:
```auto
if (key == 'a') {
circlexMoving = true;
}
```
Now you shouldn’t delete the code that makes the balls move. Instead you should replace the condition in the if statements with the corresponding booleans.
For example:
```auto
if (circlexMoving) {
circleX = circleX + xspeed;
if(circleX > width || circleX < 0) {
xspeed = xspeed * -1.0;
}
}
```
Just so that you know, `if (circlexMoving)` is the same as `if (circlexMoving == true)`
And finally, it’s time to implement the last feature. This is now very simple, as you can just add a condition that checks if D is being pressed and if it is, then set all ballMoving variables to false.
This should look something like this:
```auto
if (key == 'd') {
circlexMoving = false;
circleyMoving = false;
circlexyMoving = false;
}
```
Here’s what the final code looks like:
```auto
float circleX;
float xspeed = 1;
boolean circlexMoving;
float circleY;
float yspeed = 1;
boolean circleyMoving;
float circleXY;
float xyspeed = 1;
boolean circlexyMoving;
void setup() {
size(640, 360);
}
void draw() {
background(51);
fill(48, 90, 206);
stroke(255);
ellipse(circleX, 180, 32, 32);
if (key == 'a') {
circlexMoving = true;
}
if (circlexMoving) {
circleX = circleX + xspeed;
if (circleX > width || circleX < 0) {
xspeed = xspeed * -1.0;
}
}
fill(255, 0, 2);
ellipse(300, circleY, 32, 32);
if (key == 'b') {
circleyMoving = true;
}
if (circleyMoving) {
circleY = circleY + yspeed;
if (circleY > height || circleY < 0) {
yspeed = yspeed * -1.0;
}
}
fill(0, 400, 0);
ellipse(circleXY, circleXY, 32, 32);
if (key == 'c') {
circlexyMoving = true;
}
if (circlexyMoving) {
circleXY = circleXY + xyspeed;
if (circleXY > height || circleXY < 0) {
xyspeed = xyspeed * -1.0;
}
}
if (key == 'd') {
circlexMoving = false;
circleyMoving = false;
circlexyMoving = false;
}
}
```
---
### Author:  [@sileo](https://discourse.processing.org/u/sileo)
#### Post date: [July 5, 2019, 6:07pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/5 "2019-07-05T18:07:35Z")
Well, I just took a bit minutes to read the code to compare with the other I did and now I clearly understand why it wasn’t doing what I looked for. Despite the fact that my code is wrong, I’ll save it as a sample of my first mistake because I think I must learn from them. Thanks!
---
### Author:  [@WeinSim](https://discourse.processing.org/u/WeinSim)
#### Post date: [July 5, 2019, 6:24pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/6 "2019-07-05T18:24:56Z")
Ok I think that’s not even a bad idea
You’re welcome!
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [July 5, 2019, 7:41pm UTC](https://discourse.processing.org/t/bouncing-ellipses/12525/7 "2019-07-05T19:41:05Z")
Sharing a trimmed down version with keyPressed() function.
This will also toggle state with a **single** key press.
[https://processing.org/reference/keyPressed\_.html](https://processing.org/reference/keyPressed_.html)
[https://processing.org/reference/keyPressed.html](https://processing.org/reference/keyPressed.html)
```auto
float circleX;
float xspeed = 1;
boolean moveX;
void setup()
{
size(640, 360);
circleX = 0;
}
void draw()
{
background(51);
fill(48, 90, 206);
// Update based on keyPressed states
if (moveX)
{
circleX = circleX + xspeed;
if(circleX > width || circleX < 0)
xspeed = xspeed * -1.0;
}
// Draw
stroke(255);
ellipse(circleX, 180, 32, 32);
}
void keyPressed()
{
if(key == 'a') moveX = !moveX;
if(key == 'd') moveX = false;
}
```
You won’t be able to toggle state so easily if checking for keyPressed in draw().
Run code below to see behaviour of these.
```auto
//Observe console output:
void setup()
{
size(200, 200);
background(255, 255, 0);
}
void draw()
{
if (keyPressed)
println(frameCount, key);
}
```
```auto
//Observe console output:
void setup()
{
size(200, 200);
background(255, 255, 0);
}
void draw()
{
}
void keyPressed()
{
println(frameCount, key);
}
```
A similar discussion came up in another topic with mousePressed variable and mousePressed() function so just sharing for future consideration to anyone reading these posts.
🙂