12750113-week06

 week06-1_ellipse_translate_push_rotate_box_pop

// week06_1_ellipse_translate_push_rotate_box_pop
// 有點模仿第4週的程式，慢慢建出來
void setup(){
  size(500,500,P3D);
}

void draw(){
  background(142);
  ellipse(width/2,height/2,200,200);
  
  translate(width/2,height/2); // 把東西，放到畫面中心
  pushMatrix(); // 第5週教過的 matrix 保護
  // 改一下，要按下 mouse 才能轉動
  if(mousePressed) rotateZ(radians(frameCount)); // 對著下面中心旋轉
  box(100,30,30); // 橫的棒子
  popMatrix(); // 第5週教過的 matrix 保護
}
初始狀態

要按下mouse才能轉動

week06-2_ellipse_translate_push_rotate_translate_box_pop

// week06_2_ellipse_translate_push_rotate_translate_box_pop
// 再加1個移動，把物體放到「轉盤的中心」
void setup(){
  size(500,500,P3D);
}

void draw(){
  background(142);
  ellipse(width/2,height/2,200,200);
  
  translate(width/2,height/2); // 把東西，放到畫面中心
  pushMatrix(); // 第5週教過的 matrix 保護
  // 改一下，要按下 mouse 才能轉動
  if(mousePressed) rotateZ(radians(frameCount)); // 對著下面中心旋轉
  translate(-50,0,0); // 把棒子往左一半，讓右端放在正中心
  box(100,30,30); // 橫的棒子
  popMatrix(); // 第5週教過的 matrix 保護
}

把棒子往左一半，讓右端放在正中心，像時鐘指針轉動

week06-3_push_translate_rotate_translate_box_pop

// week06_3_push_translate_rotate_translate_box_pop
// 再加1個移動，把物體放到「轉盤的中心」
void setup(){
  size(500,500,P3D);
}

void draw(){
  background(142);
  ellipse(width/2,height/2,200,200);
  
  translate(width/2,height/2); // 把東西，放到畫面中心
  pushMatrix(); // 第5週教過的 matrix 保護
    translate(x,y);
    if(mousePressed && mouseButton == RIGHT){
      rotateZ(radians(frameCount)); // 對著下面中心旋轉
    }
    translate(-50,0,0); // 把棒子往左一半，讓右端放在正中心
    box(100,30,30); // 橫的棒子
  popMatrix(); // 第5週教過的 matrix 保護
}
float x = 0, y = 0;
void mouseDragged(){
  x += mouseX - pmouseX;
  y += mouseY - pmouseY;
}

按左鍵移動方塊

按右鍵旋轉方塊

week06-4_sphere_box_push_T_R_T_box_pop

// week06_4_sphere_box_push_T_R_T_box_pop
// 慢慢組合出機器手臂
void setup(){
   size(500,400,P3D);
}

void draw(){
  background(255); // Step00
  translate(width/2, height/2); // Step00
  sphere(10); // Step04 放個圓球，當世界中心的參考
  
  box(200,50,25); // Step05 手肘
  
  fill(252,131,77);
  pushMatrix(); // Step03
    translate(x,y); // Step06 發現放 100,0 很好
    if(mousePressed) rotateZ(radians(frameCount)); // Step03 
    translate(25,0,0); // Step02 往右推，讓左端放中心
    box(50,25,50); // Step01
  popMatrix(); // Step03
}
float x = 0,y = 0; // Step06 會動的位置
void mouseDragged(){ // Step06
  x += mouseX - pmouseX; // 現在的x - 前一個x
  y += mouseY - pmouseY; // 現在的y - 前一個y
  println("x:" + x + "y:" + y); // Step07 印出來
}

設定mouseDragged去找適合的位置(x,y)

week06-5_push_T_box_push_T_R_T_box_pop_pop

// week06_5_push_T_box_push_T_R_T_box_pop_pop
// 慢慢組合出機器手臂
void setup(){
   size(500,400,P3D);
}

void draw(){
  background(255); 
  translate(width/2, height/2); 
  sphere(10); 
  
  fill(252,131,77);
  pushMatrix(); // Step04新的一組
    translate(x,y); // Step05 新的轉動
    // Step03 把程式往右縮排
    box(200,50,25); // Step05 手肘
    
    pushMatrix(); // Step03 把程式往右縮排 
      translate(100,0); // Step01 把前一步發現的 100,0 放好
      // if(mousePressed) // 把剛剛的 if(mousePressed) 刪掉
      rotateZ(radians(frameCount)); // Step02 只轉動
      translate(25,0,0); // 往右推，讓左端放中心
      box(50,25,50); // 小手腕 
    popMatrix(); // Step03 把程式往右縮排
  popMatrix(); // Step04新的一組
}
float x = 0,y = 0; // 會動的位置
void mouseDragged(){ 
  x += mouseX - pmouseX; // 現在的x - 前一個x
  y += mouseY - pmouseY; // 現在的y - 前一個y
  println("x:" + x + "y:" + y); // 印出來
}

一開始的狀態(圓再橘色方塊後)

可以讓大手肘&小手肘移動

week06-6_push_box_push_TRT_box_pop_pop_pop

// week06_6_push_box_push_TRT_box_pop_pop_pop
// 慢慢組合出機器手臂
void setup(){
   size(500,400,P3D);
}

void draw(){
  background(255); 
  translate(width/2, height/2); 
  sphere(10); 
  
  fill(252,131,77);
  pushMatrix(); // Step04:push
    // Step05: 裡面要往右縮一個TAB
    box(50,200,25); // Step03: 手臂
    
    pushMatrix(); 
      translate(0,-100); // Step03: 掛到手臂上面，觀察到 0-100
      if(mousePressed) rotateZ(radians(frameCount)); // Step02: 把旋轉放入
      translate(100,0); // Step01:把手肘的移動量 100,0 移入
      box(200,50,25); // 手肘
      
      pushMatrix();
        translate(100,0); 
       
        rotateZ(radians(frameCount));
        translate(25,0,0); 
        box(50,25,50); // 小手腕 
      popMatrix();
    popMatrix(); 
  popMatrix();// Step04:pop
}
float x = 0,y = 0; 
void mouseDragged(){ 
  x += mouseX - pmouseX; 
  y += mouseY - pmouseY; 
  println("x:" + x + "y:" + y);
}

因為push/pop

小手臂跟手腕可以一起移動

也都可以旋轉

week06-7_push_RRT_many_TRT_inside_pop

// week06_7_push_RRT_many_TRT_inside_pop
// 慢慢組合出機器手臂
void setup(){
   size(500,800,P3D); // Step00: 把視窗變長一點，看比較完整
}

void draw(){
  background(255); 
  translate(width/2, height/2); 
  sphere(10); 
  
  fill(252,131,77);
  pushMatrix(); 
    if(mousePressed && mouseButton == RIGHT) rotateY(radians(frameCount)); // Step03:右鍵旋轉
    if(mousePressed && mouseButton == RIGHT) rotateZ(radians(frameCount)); // Step02:右鍵旋轉

    translate(0,-100); //translate(x,y); // Step01:要往上抬升0,100，把「關節」移到中心
    box(50,200,25); // 手臂
    pushMatrix(); 
      translate(0,-100); // Step00: 掛到手臂上面，觀察到 0-100
      // if(mousePressed) // Step00: 把if(mousePressed)刪掉，讓它一直轉
      rotateZ(radians(frameCount)); 
      translate(100,0); // 
      box(200,50,25); // 手肘
      
      pushMatrix();
        translate(100,0); 
       
        rotateZ(radians(frameCount));
        translate(25,0,0); 
        box(50,25,50); // 小手腕 
      popMatrix();
    popMatrix(); 
  popMatrix();
}
float x = 0,y = 0; 
void mouseDragged(){ 
  x += mouseX - pmouseX; 
  y += mouseY - pmouseY; 
  println("x:" + x + "y:" + y);
}

可以將大手臂移到圓球中心，按右鍵旋轉

增加y軸旋轉