Recitation 7: Functions and Arrays by Xueping

Question 1:

In your own words, please explain the difference between having your for loop from Step 2 in setup() as opposed to in draw().

The above video shows the result when the loop is placed in setup().

It is clear that when the for loop is in setup(), the monkeys show up with random color and position and will not move or change. But when the loop is in draw(), since every function in draw() will be looped, the monkeys will continuously change their position, size and color. The following video shows the result when the for loop is placed in draw().

Question 2:

What is the benefit of using arrays?  How might you use arrays in a potential project?

The benefit of using arrays is that it makes coding a lot easier with neat/tidy looks of shorter coding sentences if we want to run the same function with different variables. For instance, if we want to have photos of different people all showing and doing similar moves on the screen, it is easier to use arrays when we code them to do the same moves. When the variables are like color, size, or position and especially when we want to use random variables, using array avoids repetitive work and saves our time.

The main problem I met in doing this recitation work is how to draw the ears for the monkey face, which needs semi-circles. I’m still struggling with the last two parameters used in arc( ) function…..

int monkeys = 50;
float[] x = new float [monkeys];
float[] y = new float [monkeys];

float[] speedX =  new float [monkeys];
float[] speedY =  new float [monkeys];

float[] size =  new float [monkeys];
//float[] Color =  new float [monkeys];
color[] c = new color[monkeys];


void setup() {
  pixelDensity(2); 
  size(800, 800);
  background(254);
  for(int i=0; i<x.length; i++){
    x[i] = random(width);
    y[i] = random(height);
    speedX[i] = random(-10,10);
    speedY[i] = random(-10,10);
    size[i] = random(30,200);
    c[i] = color(random(255),random(255),random(255));
  }
}

void draw() {
  background(254);
  for (int i=0; i<x.length; i++){
  display(x[i], y[i], size[i], c[i]);
  //move the monkey
  x[i] = x[i] + speedX[i];
  y[i] = y[i] + speedY[i];
  // check the edges
  if (x[i] > width || x[i] < 0) {
    speedX[i] = - speedX[i];
  }
  if (y[i] > height || y[i] < 0) {
    speedY[i] = - speedY[i];
  }
 }
}

void keyPressed(){
  if(keyPressed){
    for(int i=0; i<x.length; i++){
    c[i] = color(random(255),random(255),random(255));
    speedX[i] = random(-10,10);
    speedY[i] = random(-10,10);
  }
  }
}
void mousePressed(){
  if(mousePressed){
    for(int i=0; i<x.length; i++){
    size[i] = random(30,200);
  }
}
 }
 
void display(float u, float v, float size, color c) {
  // display 
  noStroke();
  fill(c);
  ellipse(u, v, size, size);
  fill(255);
  ellipse(u-0.2*size, v-0.1*size, 0.5*size, 0.5*size);
  ellipse(u+0.2*size, v-0.1*size, 0.5*size, 0.5*size);
  ellipse(u, v+0.1*size, 0.6*size, 0.6*size);
  fill(c);
  triangle(u, v+0.15*size, u-0.08*size, v+0.1*size, u+0.08*size, v+0.1*size);
  rect(u-0.3*size, v-0.12*size, 0.2*size, 0.07*size);
  rect(u+0.1*size, v-0.12*size, 0.2*size, 0.07*size);
  arc(u-0.5*size, v-0.01*size, 0.25*size, 0.5*size, 0, PI+QUARTER_PI);
  arc(u-0.5*size, v-0.01*size, 0.25*size, 0.5*size, PI+QUARTER_PI, 2*PI);
  arc(u+0.5*size, v-0.01*size, 0.25*size, 0.5*size, PI+QUARTER_PI, 2*PI+QUARTER_PI);
  arc(u+0.5*size, v-0.01*size, 0.25*size, 0.5*size, 2*PI, 3*PI);
  arc(u, v+0.2*size, 0.25*size, 0.25*size, 0, PI);
}

Leave a Reply