week03 02161095 陳薇亘 體感互動

Part1:
1.偵測五根手指頭畫出彩色的線(2D)
import de.voidplus.leapmotion.*;//LeapMotion標頭檔
LeapMotion leap;
PVector [][] pt = new PVector[5][50];
//PVector pt1,pt2,pt3,pt4,pt5,pt6,pt7,pt8,pt9,pt10;
void setup(){
  size(640,480,P3D);
  colorMode(HSB, 100);
  for(int f=0;f<5;f++)
    for(int i=0;i<50;i++)
      pt[f][i] = new PVector(0,0,0);
  leap = new LeapMotion(this);//LeapMotion起始值

}
void draw(){
  background(0);
  //stroke(48,191,153);
  stroke(#30BF99);
  for(int f=0;f<5;f++)
    for(int i=49;i>0;i--){pt[f][i].x=pt[f][i-1].x;pt[f][i].y=pt[f][i-1].y;}
  for(Hand hand : leap.getHands()){//抓取手
    for(Finger finger : hand.getFingers()){//抓取手指
      int f=finger.getType();
      PVector now = finger.getPosition();
      pt[f][0].x = now.x;
      pt[f][0].y = now.y;
    }
  }
  for(int f=0;f<5;f++){
    stroke(f*20, 100,100);
    for(int i=1;i<10;i++)
      line(pt[f][i].x,pt[f][i].y,pt[f][i].z,pt[f][i-1].x,pt[f][i-1].y,pt[f][i-1].z);
  }
}

2.開始畫出3D的彩色線條

3.加入程式碼 讓畫面旋轉 讓線條看起來更立體
  translate(width/2,height/2);
  rotateY(radians(frameCount));
   translate(-width/2,-height/2);

****旋轉加上3D線條唷!
import de.voidplus.leapmotion.*;//LeapMotion標頭檔
LeapMotion leap;
PVector [][] pt = new PVector[5][50];
//PVector pt1,pt2,pt3,pt4,pt5,pt6,pt7,pt8,pt9,pt10;
void setup(){
  size(640,480,P3D);
  colorMode(HSB, 100);
  for(int f=0;f<5;f++)
    for(int i=0;i<50;i++)
      pt[f][i] = new PVector(0,0,0);
  leap = new LeapMotion(this);//LeapMotion起始值

}
void draw(){
  background(0);
  stroke(#30BF99);
  for(int f=0;f<5;f++)
    for(int i=49;i>0;i--){pt[f][i].x=pt[f][i-1].x;pt[f][i].y=pt[f][i-1].y;pt[f][i].z=pt[f][i-1].z;}
  for(Hand hand : leap.getHands()){//抓取手
    for(Finger finger : hand.getFingers()){//抓取手指
      int f=finger.getType();
      PVector now = finger.getPosition();
      pt[f][0].x = now.x;
      pt[f][0].y = now.y;
      pt[f][0].z = now.z*5-225;
      if(f==1)println(now);
    }
  }
  translate(width/2,height/2,0);
  rotateY(radians(frameCount/4.0));
   translate(-width/2,-height/2,0);
  for(int f=0;f<5;f++){
    for(int i=1;i<50;i++){
      stroke(f*20, 100,100);
      line(pt[f][i].x,pt[f][i].y,pt[f][i].z,pt[f][i-1].x,pt[f][i-1].y,pt[f][i-1].z);
    }
  }
  stroke(60,100,100);
  for(int i=0;i<640;i+=20)
    for(int j=0;j<480;j+=20){
      noFill();
      rect(i,j,20,20);
  }
}

Part2:

1.做出左手圓形和右手方形!

import de.voidplus.leapmotion.*;//LeapMotion標頭檔

LeapMotion leap;

void setup(){

  size(640,480,P3D);

  leap = new LeapMotion(this);//LeapMotion起始值

}

void draw(){

  background(225);

  for(Hand hand : leap.getHands()){//抓取手

      PVector pos=hand.getPosition();

      if(hand.isLeft()){

        ellipse(pos.x,pos.y,200,100);

      }

      else if(hand.isRight()){

      rect(pos.x,pos.y,10,100);

    }

  }

}

2.做出調色盤和畫筆

import de.voidplus.leapmotion.*;//LeapMotion標頭檔

LeapMotion leap;

void setup(){

  size(640,480,P3D);

  leap = new LeapMotion(this);//LeapMotion起始值

}

color nowColor=color(255,0,0);

PVector leftPos;

void draw(){

  background(225);

  for(Hand hand : leap.getHands()){//抓取手

      PVector pos=hand.getPosition();

      if(hand.isLeft()){

        noFill();

        ellipse(pos.x,pos.y,200,100);

        fill(255,0,0);ellipse(pos.x+150,pos.y,60,50);

        fill(255,255,0);ellipse(pos.x+120,pos.y-40,60,50);

        fill(0,255,0);ellipse(pos.x+90,pos.y-60,60,50);

        fill(0,0,255);ellipse(pos.x+30,pos.y-60,60,50);

        fill(255,0,255);ellipse(pos.x-20,pos.y-60,60,50);

         leftPos=pos;

      }

      else if(hand.isRight()){

      fill(nowColor);rect(pos.x,pos.y,10,100);

      println(leftPos);

      println(pos);

      if(dist(pos.x,pos.y,leftPos.x+120,leftPos.y-40)<30){

      nowColor=color(255,255,0);

      }

    }

  }

}

 

    

week03 預想其中作品
本小組想做出打地鼠遊戲或者是電流急急棒(https://www.youtube.com/watch?v=Dnjt6MdN108)的遊戲，藉由偵測手部的位子，做出有趣的小遊戲!