Recitation 7: Functions and Arrays by Jiahui Zhang

Overview:

This week our recitation focused on the codings like functions and arrays which we learned in class. It is quite similar to the codes we had in our classes so that this time it is not hard.

Step 1:

The first step is just drawing a new graphic of my own design.  By including parameters such as x position, y position, and color to display the graphic, the graphic can run in the following steps. But for now, it is still. I use ellipses, rectangles, and triangles to create a cute rabbit. 

Step 2 & 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().

For step 2, create arrays to contain 100 x, y, color, and size for the rabbit. It will be still, countable, 100 rabbits on the canvas. 

But if we move the same function to the draw loop, it will repeat so that 100 rabbits keep appearing on the canvas. 

Step3 & 4:

Actually I did not understand what was the third step about so I directly went to the fourth step. I feel like the third step (which is already included in step two) is just building up the foundation for later use steps by steps. 

Step 4 is adding the speed to make the rabbit move. It is essential to add new arrays to contain different speeds for x and y so that those rabbits will move in different directions at different speeds. 

float[] x = new float [100];
float[] y = new float [100];
float[] speedX = new float [100];
float[] speedY = new float [100];
float[] size = new float[100];
float red[] =new float[100];
float blue[] =new float[100];
float green[] = new float[100];

void setup() {
  size(800, 800); 
  background(255);
  for (int n=0; n<x.length; n++) {
    x[n]=random(width);
    y[n]=random(height);
    speedX[n]=random(-15, 15);
    speedY[n]=random(-15, 15);
    size[n]=random(5, 60);
    red[n]=random(0, 255);
    blue[n]=random(0, 255);
    green[n]=random(0, 255);

  }
}

void draw() {
    background(255);
    for (int n=0; n<x.length; n++) {
      display(x[n], y[n], size[n], color(red[n], green[n], blue[n]));
    x[n] = x[n] + speedX[n];
    y[n] = y[n] + speedY[n];


    //// check the edges
    if (x[n] > width || x[n]< 0) {
      speedX[n] = -speedX[n];
    }
    if (y[n] > height || y[n]< 0) {
      speedY[n] = -speedY[n];
    }
    }
}

void display(float x, float y, float size, color c) {
  //Use these parameters to create your graphics
  noStroke();
  fill(c);
  rect(x, y, size, size*3, 50);
  rect(x+size*1.6, y, size, size*3, 50);
  ellipse(x+size*4/3, y+size*3.5, size*4, size*3);
  fill(255);
  ellipse(x+size/3, y+size*3.5, size*0.35, size*0.35);
  ellipse(x+size*5/3, y+size*3.5, size*0.35, size*0.35);
  triangle(x+size, y+size*3.8, x+size*2/3, y+size*4.2, x+size*4/3, y+size*4.2);
}

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

The benefit of using arrays is to contain large amounts of variables and avoid using the same functions repeatedly. Once the arrays are used in the codings, it will be quite clean and direct. It also makes the revision easier. 

I think I may use it to set up the background of my instruction and let it be interactive when people trying to respond by pressing the mouse. For instance, letting lots of butterflies flying out when the user presses the keys. (I am not so sure about the project yet).

Optional Step:

I added some interactive functions when the key or the mouse is pressed.

    if (mousePressed) {
      if (x[n] > mouseX) {
        speedX[n] = -10;
      }
      if (x[n] < mouseX) {
        speedX[n] = 10;
      }
      if (y[n] > mouseY) {
        speedY[n] = -10;
      }
      if (y[n] < mouseY) {
        speedY[n] = 10;
      }
    }

    //// check the edges
    if (x[n] > width || x[n]< 0) {
      speedX[n] = -speedX[n];
    }
    if (y[n] > height || y[n]< 0) {
      speedY[n] = -speedY[n];
    }
  }
  if (keyPressed) {
    if (key == 'b' || key == 'B') {
      for (int n=0; n<x.length; n++) {

        red[n]=random(0, 255);
        blue[n]=random(0, 255);
        green[n]=random(0, 255);
      }

    }
    if (key == 'v' || key == 'V') {
        for (int n=0; n<x.length; n++) {
    x[n]=random(width);
    y[n]=random(height);
    speedX[n]=random(-15, 15);
    speedY[n]=random(-15, 15);
    size[n]=random(5, 60);
    
  }
  }
  }