Recitation 006

In this recitation，I decided to make something that can move with the mouse position inspired by this example.

However, I decided to make some changes to the example. I’d like to make a circle with a “vanishing tail” moving with the mouse

CODE:

int r1=10;
int count = 0;
int num = 60;
float mx[] = new float[num];
float my[] = new float[num];

void setup() {
  size(1000, 1000);
  //background(255);
}

void draw() {
  background(255);
  if (mousePressed== true) {
    
    if (frameCount % 10 == 0) {
      
      if (count < 40 ) {
        noStroke();
        fill(random(0,255),random(0,255),random(0,255),random(0,255));
        circle(mouseX, mouseY, r1);
        r1 = 10+ 5*count;
        count ++;
      } else if(count>40) {
       count-=1;
       r1 = 10+ 10*(20-count) ;
  } else{
    count=0;
    r1=10;
  }
    }
  }
  
  int which = frameCount % num;
  mx[which] = mouseX;
  my[which] = mouseY;
  
  for (int i = 0; i < num; i++) {
    // which+1 is the smallest (the oldest in the array)
    int index = (which+1 + i) % num;
    noStroke();
    fill(random(0,255),random(0,255),random(0,255),random(0,255));
    ellipse(mx[index], my[index], i, i);
  }
}

The greatest thing I learned from today’s recitation is to set an array to store the previous position so that the drawing can keep its trail. I think the array function is super useful and can be applied to a lot of situations as it serves as a basic storage, which will help the manipulation of shapes and images.

Homework:

CODE:

int b = 0;
int R = 0;
int g = 0;
int stepB = 5;
int stepR = 5;
int stepG = 5;
int steps = 10;
int r = 100;
int stepr = 5;
int stepX = 10;
int stepY = 10;
int x = width/2;
int y = height/2;

void setup(){
  size(600, 600);
  background(0);
}

void draw(){
  background(255);
  b = b + stepB*3;
  R = R + stepR;
  g = g + stepG*2;
  strokeWeight(20);
  stroke(R, g, b);
  noFill();

  if(b > 255 || b < 0){
    stepB = -stepB;
  }
  if(R > 255 || R < 0){
    stepR = -stepR;
  }
  if(g > 255 || g < 0){
    stepG = -stepG;
  }
  
  circle(x, y, r);
  r = r + stepr;
  if(keyPressed){
  if(keyCode == UP && y>0){
    y = y - stepY;
  }
  else if(keyCode == DOWN && y<height){
    y = y + stepY;
  }
  else if(keyCode == LEFT && x>0){
    x = x - stepX;
  }
  else if(keyCode == RIGHT && x<width){
    x = x + stepX;
  }
  }
  if(r > 300 || r < 80){
    stepr = -stepr;
  }
}