Recitation Exercise:
For this documentation, we were asked to use Processing and create 3 shapes and create arrays, for loops, and animations with the code. In this exercise, I got to practice with color changing, x and y values, and movements around the screen. Throughout the steps, I did run into some obstacles but soon figured them out just by playing with the code.
Step 1:
For this step, we had to display 3 different shapes on the screen. I made 3 different circles, all the same size, and made them random colors every time the user would run the code.
Step 2:
For this step, I had to use a for loop to tell the code to make 100 different circles. I had trouble with this because I didn’t make another integer “i” so I wasn’t giving the for loop a command to keep making circles until it reached 100 circles. It was also hard because I didn’t know whether or not to put the color command in the setup() or the draw() function. In the end, I figured it out and declared an integer “i” and put the color function in the setup() function.
Step 3:
For this step, it was basically the same thing as the previous step except I used an array. This was hard for me because I was really confused as to how many different arrays I needed to make. At the same time, I was also confused as to where I needed to put my arrays. Turns out, I declare the arrays outside of everything and then fill them in the setup() and draw() functions.
Step 4:
In this step, all I had to do is make the circles move a certain way and then I used an if statement to ensure that if the circles hit the sides of the screen, that it would bounce. This was really simple for me to do since I already had the basics down so all I needed to do was to add an if statement.
Question 1:
The difference between having my for loop in setup() and draw() is that in setup() I would only be telling it to run once and then it would stop. But when I put the for loop in draw(), it constantly repeats itself. I’m not sure if this is exactly why but I found that it worked when I was testing my code out and figuring out where to put the for loop.
Question 2:
Using arrays is beneficial when you have to store multiple values at once in an array. I find that using arrays will be make coding a lot simpler especially if you are using a lot of numbers and have to store them. I might use arrays in a project when I have to assign different values to certain shapes, or make them move without having to declare each variable.
Code:
int circle = 100;
float[] x = new float[circle];
float[] y = new float[circle];
float[] speedX = new float[circle];
float[] speedY = new float[circle];
float[] size = new float[circle];
color[] c = new color[circle];
void setup() {
size(600,500);
background(255);
for (int i=0; i < 100; i++) {
x[i] = random(width);
y[i] = random(height);
speedX[i] = random(-2, 2 );
speedY[i] = random( -2, 2 );
size[i] = random(10,500);
c[i] = color(random(255),random(255),random(255));
drawCircle(50,50,color((255),color(255),color(255)));
print("y["+i+"] = ");
println(y[i]);
}
}
//void display(float x, float y, color c) {
//}
void draw() {
background(255);
for (int i=0; i< 100; i++){
drawCircle(x[i], y[i], c[i]);
x[i] = x[i] + speedX[i];
y[i] = y[i] + speedY[i];
if (x[i] > width || x[i]< 0) {
speedX[i] = -speedX[i];
}
if (y[i] > height || y[i]< 0) {
speedY[i] = -speedY[i];
}
}
}
//drawCircle(150, width*0.25, height*0.25, color(91,246,250));
//drawCircle(50, width*0.45, height*0.45, color(255));
//drawCircle(200, width*0.75, height*0.75, color(0,0,255));
void drawCircle(float u, float v, color c) {
noStroke();
fill(c);
ellipse(u,v,50,50);
}