12750794-week02

  week02

//week02-1-fill-noStroke-rect
size(400,400);
background(255);
fill(238);
noStroke();
rect(0,0,20,20);
rect(0,40,20,20);
rect(0,80,20,20);

//week02_2_for_for_if_rect
size(400,400);
background(255);
fill(238);
noStroke();
int s = 400/14;//計算每個格子的大小
for(int i=0; i<14; i++){//左手i對應y座標
  for(int j=0;j<14;j++){//右手j對應x座標
  //rect(0, i*s*2, s, s);
  if((i+j)%2==0)  rect(i*s, j*s, s, s);
  }
}

//week02-3_void_setup_void_draw_stroke_if_mousePressed
void setup(){//一開始，設定1次(貼上week02-2的程式)
  size(400,400);
  background(255);
  fill(238);
  noStroke();
  int s = 400/14;//計算每個格子的大小
  for(int i=0; i<14; i++){//左手i對應y座標
    for(int j=0;j<14;j++){//右手j對應x座標
    //rect(0, i*s*2, s, s);
    if((i+j)%2==0)  rect(i*s, j*s, s, s);
    }
  }
}
void draw(){//每秒畫60次
  stroke(255,0,0);//紅色的線
  if(mousePressed) line(mouseX,mouseY,pmouseX,pmouseY);
}//如果mouse按下去，就畫線，給兩個座標: 現在mouse 和 之前的mouse

//week02-4_PImage_loadImage_background_fill_println
//新的開始， 要描圖
PImage img;
void setup(){
  size(400,400);
  img = loadImage("cute.png");
}//記得把圖片檔，(像上周一樣)拉到程式裡
void draw(){
  background(img);
  fill(255,mouseX);//半透明的色彩 白色，alpha值是128
  println(mouseX);//把mouseX的值，在下面(小黑)印出來
  rect(0,0,400,400);//畫超大的四邊形，全部蓋住
}


//week02-5_ArrayList_Integer_new_for_size_get_add_mouseDragged
//要利用資料結構，把歷史軌跡 記起來
ArrayList<Integer> x = new ArrayList<Integer>();
ArrayList<Integer> y = new ArrayList<Integer>();
PImage img;
void setup(){
  size(400,400);
  img = loadImage("cute.png");
}//記得把圖片檔，(像上周一樣)拉到程式裡
void draw(){
  background(img);
  fill(255,200);//半透明的色彩 白色，alpha值是128
  rect(0,0,400,400);//畫超大的四邊形，全部蓋住
  //上面是week02-4， 下面用迴圈，從資料結構取出來
  for(int i=1;i<x.size();i++){
    line(x.get(i), y.get(i), x.get(i-1), y.get(i-1));
  }
}


//week02_6_ArrayList_ArrayList_Integer_for_for_mousePressed_new_add
//想樣很多段 不要(一筆畫)一直接著畫
ArrayList<Integer> x, y; // 先有2個(還沒準備好)的(小的)資造結構，等mousePressed再新增準備
ArrayList<ArrayList<Integer>> xx = new ArrayList<ArrayList<Integer>>();//大的資料結構
ArrayList<ArrayList<Integer>> yy = new ArrayList<ArrayList<Integer>>();
PImage img;
void setup(){
  size(400,400);
  img = loadImage("cute.png");//每次新的檔案，要再把圖片(拉進來)
}//記得把圖片檔，(像上周一樣)拉到程式裡
void draw(){
  background(img);
  fill(255,200);//半透明的色彩 白色，alpha值是128
  rect(0,0,400,400);//畫超大的四邊形，全部蓋住
  //上面是week02-4， 下面用迴圈，從資料結構取出來
  for(int I=0; I<xx.size(); I++){//大寫I對應大的資料結構
    ArrayList<Integer> x = xx.get(I);//取出裡面的小的資料結構
    ArrayList<Integer> y = yy.get(I);
    for(int i=1; i<x.size(); i++){//小的，在照舊畫
      line(x.get(i), y.get(i), x.get(i-1), y.get(i-1));
    }
  }
}
void mouseDragged(){
  x.add(mouseX);
  y.add(mouseY);
}
void mousePressed(){//滑鼠按下去時，建(新的)資料結構
  x = new ArrayList<Integer>(); xx.add(x);
  y = new ArrayList<Integer>(); yy.add(y);
}


描畫座標
//week02-7_
ArrayList<Integer> x, y; // 先有2個(還沒準備好)的(小的)資造結構，等mousePressed再新增準備
ArrayList<ArrayList<Integer>> xx = new ArrayList<ArrayList<Integer>>();//大的資料結構
ArrayList<ArrayList<Integer>> yy = new ArrayList<ArrayList<Integer>>();
PImage img;
void setup(){
  size(400,400);
  img = loadImage("cute.png");//每次新的檔案，要再把圖片(拉進來)
}//記得把圖片檔，(像上周一樣)拉到程式裡
void draw(){
  background(img);
  fill(255,200);//半透明的色彩 白色，alpha值是128
  rect(0,0,400,400);//畫超大的四邊形，全部蓋住
  //上面是week02-4， 下面用迴圈，從資料結構取出來
  for(int I=0; I<xx.size(); I++){//大寫I對應大的資料結構
    ArrayList<Integer> x = xx.get(I);//取出裡面的小的資料結構
    ArrayList<Integer> y = yy.get(I);
    for(int i=1; i<x.size(); i++){//小的，在照舊畫
      line(x.get(i), y.get(i), x.get(i-1), y.get(i-1));
    }
  }
}
void keyPressed(){//小心，注音輸入法，會卡住按鍵，要換成英文輸入
  if(key=='s'||key=='S'){//如果按下英文的小寫or大寫s想save存檔的話
    for(int I=0; I<xx.size(); I++){//大寫I對應大的資料結構
    ArrayList<Integer> x = xx.get(I);//取出裡面的小的資料結構
    ArrayList<Integer> y = yy.get(I);
    println("beginShape();"); //beginShape();
    for(int i=1; i<x.size(); i++){//小的，在照舊畫
     println("vertex("+ x.get(i) +", " + y.get(i) +");");
      }//改在keyPressed()按下s或S時，再全部印!
      println("endShape();"); //endShape();
    }
  }
}
void mouseDragged(){
  //println("vertex(mouseX, mouseY);");
  println("vertex("+ mouseX +", " + mouseY +");");
  x.add(mouseX);
  y.add(mouseY);
}
void mousePressed(){//滑鼠按下去時，建(新的)資料結構
  x = new ArrayList<Integer>(); xx.add(x);
  y = new ArrayList<Integer>(); yy.add(y);
}