12750432

 //week10-1-postman-head-body

先放入基礎郵差的完整圖當背景描圖,在準備一個半透明的背景蓋上去,讓郵差圖不會太顯眼,接下來將以劃分的圖head.png放進去,後面的(0,0)是對準圖片左上角,在畫入身體

//week10-2-postman-head-body-push-trt-pop
把PImage宣告,整合成一條程式碼,從頭開始調旋轉位置,(把圖片放入小畫家,用滑鼠移到要旋轉的位置),並記下位置,
這個位置就是旋轉位置離(0,0)相隔的距離,先把頭的旋轉中心放到(0,0),並進行旋轉,
再移回正確位置,要用pushMatrix()跟popMatrix()框起來,最後畫身體

//week10-3-postman-head-body-uparm1-hand1-push-trt-pop

接下來把uparm1,hand1加進來,由下往上讀,所以頭要最後畫,身體也是,因為uparm1是整個的
所以先用一個pushMatrix()框起來,然後因為uparm1旋轉時,hand1也會改變位置,所以也包含在
此pushMatrix()裡,再用一個pushMatrix()將hand1框起來並進行旋轉


//week10-4-postman-head-body-uparm1-hand1-uparm2-hand2-push-trt-pop
將膝蓋以上的部分畫完




---------------------------------------------------------------
用ID控制關節
先準備20個關節,預設0為要處理的關節,用keyPressed()函數決定按哪一個鍵時id會轉換
            void mouseDragged(){angle[ID] += mouseX-pmouseX;}//計算滑鼠的移動
            rotate(radians(angle[1]));按下數字鍵1時,uparm1會旋轉
//week10-5-postman-many-angle-ID-mouseDragged
PImage postman, head,body,uparm1,hand1,uparm2,hand2;
float [] angle = new float[20];//prepare 20 關節的變數
int ID = 0;//現 在要處理的關節
void mouseDragged(){
  angle[ID] += mouseX-pmouseX;
}
void keyPressed(){
  if(key=='1') ID = 1;//leftarm
  if(key=='2') ID = 2;//lefthand
  if(key=='3') ID = 3;//rightarm
  if(key=='4') ID = 4;//righthand
  if(key=='5') ID = 5;
  if(key=='6') ID = 6;
  if(key=='0') ID = 0;//head
}
void setup(){
  size(560,560);
  postman = loadImage("postman.png");
  head = loadImage("head.png");
  body = loadImage("body.png");
  uparm1 = loadImage("right-arm.png");
  hand1 = loadImage("right-hand.png");
  uparm2 = loadImage("left-arm.png");
  hand2 = loadImage("left-hand.png");
  
}
void draw(){
  background(#FFFFF2);
  image(postman,0,0);//基礎郵差
  fill(255,0,255,128);//半透明紫色
  rect(0,0,560,560);//蓋上去
  pushMatrix();
    translate(+197,+262);//放回正確位置
    rotate(radians(angle[1]));
    translate(-197,-262);//arm的旋轉中心放到(0,0)
    image(uparm1,0,0);
    pushMatrix();
      translate(+119,+265);//放回正確位置
      rotate(radians(angle[2]));
      translate(-119,-265);//arm的旋轉中心放到(0,0)
      image(hand1,0,0);
    popMatrix();
  popMatrix();
   pushMatrix();
    translate(+289,+260);//放回正確位置
    rotate(radians(angle[3]));
    translate(-289,-260);//arm的旋轉中心放到(0,0)
    image(uparm2,0,0);
    pushMatrix();
      translate(+355,+258);//放回正確位置
      rotate(radians(angle[4]));
      translate(-355,-258);//arm的旋轉中心放到(0,0)
      image(hand2,0,0);
    popMatrix();
  popMatrix();
  pushMatrix();
    translate(+233,+230);//放回正確位置
    rotate(radians(angle[0]));
    translate(-233,-230);//頭的旋轉中心放到(0,0)
    image(head,0,0);//在畫頭
  popMatrix();
  image(body,0,0);//在畫身體
}

//week10-6-postman-many-angle-ID-saveStrings-loadString先放入圖片圖片

先建一個lines陣列儲存位置資訊,把 lines 轉成字串陣列,建一個now字串放現在全部關節轉動的值,

now字串加進現有的 lines（ArrayList）按s時會存一組現在的位置資訊在angles.txt裡

  if(key=='s'){//begin here每按一次 就存一組
    String now = "";//要放現在全部關節的值
    for(int i=0;i<20;i++){
      now+=angle[i]+" ";//全部塞到now 裡
    }
    lines.add(now);//這行加到line 裡
    String [] arr = new String[lines.size()];
    lines.toArray(arr);
    saveStrings("angles.txt",arr);
  }
  if(key=='r'){//讀入
      if(R<lines.size()){//判斷是否有資料可讀
          float[]now = float(split(lines.get(R),' '));
          for(int i=0;i<20;i++) angle[i] = now[i];
          R=(R+1)%lines.size();
      }
  }
}
int R=0;
ArrayList<String> lines = new ArrayList<String>();//put the result of move