Hi,
Welcome to the forum!
Please note that you can format your code using the </>
button when editing your message on the forum or enclose your code with backticks : ``` your code ``` → your code
There’s some errors in your code, I don’t know if it’s the copy pasting stuff but you rather want : x--;
instead of x-;
line 35
I think that you are doing too much conditions here and if you want the ellipse to go back, it’s going to add even more complexity. You have 4 conditions for switching before one direction to the other and 4 conditions to move the ball depending on it’s direction.
What I would do is : create a t
variable representing the time of your animation between 0
and 1
. So if I say 0.5
, then it’s representing the ball at half the animation.
Also you manually specified the values of the border of the window (270
, 30
for example) but what if I want the window size to change? And the ball size?
I would go like this :
// Ball parameters
float ballSize = 60;
float ballRadius = ballSize / 2;
// Time parameters
float t = 0;
float timeOffset = 0.005;
// The direction of the ball
boolean forward = true;
void setup() {
size(300, 300);
}
void draw() {
background(0);
float x, y;
// Test for each portions
if (t >= 0 && t < 0.25) { // Up
x = map(t, 0, 0.25, ballRadius, width - ballRadius);
y = ballSize / 2;
} else if (t >= 0.25 && t < 0.5) { // Right
x = width - ballRadius;
y = map(t, 0.25, 0.5, ballRadius, height - ballRadius);
} else if (t >= 0.5 && t < 0.75) { // Down
x = map(t, 0.5, 0.75, width - ballRadius, ballRadius);
y = height - ballRadius;
} else { // Left
x = ballRadius;
y = map(t, 0.75, 1, height - ballRadius, ballRadius);
}
// Display the circle
circle(x, y, ballSize);
// Move forward or backward in the animation
if (forward) {
t += timeOffset;
} else {
t -= timeOffset;
}
// If the animation is finished, invert the direction
if (t > 1 || t < 0) {
forward = !forward;
}
}
Since the window is a square, I am dividing the animation in 4 steps for the sides. 1 / 4 = 0.25
so each time I check if the time is between [0, 0.25[
or [0.25, 0.5[
or [0.5, 0.75[
… then based on that I use the map()
function to get the x and y location of the ball based on the time.
I made a little sketch to explain that :
Hope it helps!