2025年5月15日 星期四

week13

 week13

// week13-1_processing_video

//Sketch - Library - Mange Libraries 安裝video

import processing.video.*;//Java 使用外掛的匯入

//有視訊鏡頭的,用這個版本

Capture video;

Movie movie;// 沒有視訊鏡頭,改用這個

void setup(){

  size(640, 960);//常見的視訊

  video = new Capture(this, 640, 480);

  video.start();// 打開視訊

  movie= new Movie(this, "street.mov");//讀檔案

  movie.loop();

}

void draw(){

  if(video.available()) video.read();

  image(video, 0, 480);

  if(movie.available()) movie.read();

  image(movie, 0, 0);

}


// week13-2_camera_movie_eye_center_up
// 電腦圖學繪圖時,會設定 camera 的 相關係數
import processing.video.*;//要使用影片的外掛
Movie movie; // 要放影片的變數
void setup(){
  size(720, 480, P3D); // 要記得加上P3D 才能有OpenGL 3D 功能
  movie= new Movie(this, "street.mov");
  movie.loop();// 迴圈撥放
}
void draw(){
  background(128);
  camera(mouseX, mouseY, 500, 360, 240, 0, 0, 1, 0);
  //很多參數 eyeX, eyeY, eyeZ, centerX, centerY, centerZ, upX, upY, upZ
  //                                現在把影片中心點當主角
  if(movie.available()) movie.read();// 有新畫面就讀入
  image(movie, 0, 0);// 放影片在 0,0
}


// week13-3_tecture_textureMode_beginShape_vertex_endShape
// 先教「貼圖」,之後再加進去
PImage img;
void setup(){
  size(400, 400, P3D);// 要記得加上P3D 才能有OpenGL 3D 功能
  img = loadImage("chessboard.png");
  textureMode(NORMAL);// 有很多種「貼圖的模式」
  //先用最簡單的 NORMAL 來畫, 要2個三角形, 不像是3D透視的感覺
}
void draw(){
  background(128);// 灰背景
  beginShape(); // 開始畫
    texture(img);// 把圖片當貼圖
    vertex(40, 80, 0, 0);// 4個頂點vertex 的4邊形, 會裁出2個三角形
    vertex(320, 20, 1, 0);
    vertex(380, 360, 1, 1);
    vertex(160, 380, 0, 1);
  endShape();
}

// week13-4_camera_chessboard_texture_front_left
// 把貼圖, 跟 camera 整合在一起
PImage img;
void setup(){
  size(400, 400, P3D);
  img = loadImage("chessboard.png");
  textureMode(NORMAL);
}
void draw(){// 攝影機往前方看,左右、前後移動
  camera(mouseX, 200, mouseY, mouseX, 200, mouseY-10, 0, 1, 0);
  background(128);// 灰背景
  beginShape(); // 正前方, z座標都放0
    texture(img);
    vertex(  0,   0, 0, 0, 0);// x, y, z, u, v
    vertex(400,   0, 0, 1, 0);
    vertex(400, 400, 0, 1, 1);
    vertex(  0, 400, 0, 0, 1);
  endShape();
  beginShape(); // 左方, x座標都放0
    texture(img);
    vertex(0,   0,   0, 0, 0);// x, y, z, u, v
    vertex(0, 400,   0, 1, 0);
    vertex(0, 400, 400, 1, 1);
    vertex(0,   0, 400, 0, 1);
  endShape();
}

// week13-5_camera_keyPressed_keyCode_x_y_z_angle_cos_sin
// 修改自week13-4_camera_chessboard_texture_front_left
// 利用 方向鍵(上下左右鍵)來移動
PImage img;
void setup(){
  size(400, 400, P3D);
  img = loadImage("chessboard.png");
  textureMode(NORMAL);
}
float x= 200, y= 200, z= 200, angle= 180;
void keyPressed(){
  if(keyCode==LEFT) angle--;
  if(keyCode==RIGHT) angle++;
  if(keyCode==UP){
    x += cos(radians(angle));
    z += sin(radians(angle));
  }
  if(keyCode==DOWN){
    x -= cos(radians(angle));
    z -= sin(radians(angle));
  }
}
void draw(){// 攝影機往前方看,左右、前後移動
  if(keyPressed)keyPressed();
  camera(x, y, z, x+ cos(radians(angle)), y, z+sin(radians(angle)), 0, 1, 0);
  background(128);// 灰背景
  beginShape(); // 正前方, z座標都放0
    texture(img);
    vertex(  0,   0, 0, 0, 0);// x, y, z, u, v
    vertex(400,   0, 0, 1, 0);
    vertex(400, 400, 0, 1, 1);
    vertex(  0, 400, 0, 0, 1);
  endShape();
  beginShape(); // 左方, x座標都放0
    texture(img);
    vertex(0,   0,   0, 0, 0);// x, y, z, u, v
    vertex(0, 400,   0, 1, 0);
    vertex(0, 400, 400, 1, 1);
    vertex(0,   0, 400, 0, 1);
  endShape();
}
// week13-6_combine_all_Movie_Capture_PImage_camera_sin_cos_P3D
//把今天教的全部加進來
//street.mov 及 chessboard.png 都加進來
import processing.video.*;
Movie movie;
PImage img;
void setup(){
  size(400, 400, P3D); // 要記得加上P3D 才能有OpenGL 3D 功能
  movie= new Movie(this, "street.mov");
  movie.loop();// 迴圈撥放
  img = loadImage("chessboard.png");
  textureMode(NORMAL);
  video = new Capture(this, 640, 480);
  video.start();
}
Capture video;
void draw(){
  camera(200, 200, 200, 200+ cos(radians(frameCount)), 200, 200+sin(radians(frameCount)), 0, 1, 0);
  background(128);
  if(movie.available()) movie.read();
  beginShape(); // 正前方的牆
    texture(img);
    vertex(  0,   0, 0, 0, 0);// x, y, z, u, v
    vertex(400,   0, 0, 1, 0);
    vertex(400, 400, 0, 1, 1);
    vertex(  0, 400, 0, 0, 1);
  endShape();
  image(movie, 0, 0, 360, 240);
  if(video.available()) video.read(); // 放影片,用2D放圖的方法
  beginShape(); // 左方的牆,直接放視訊
    texture(video);// 把視訊也當成一面牆
    vertex(0,   0,   0, 0, 0);// x, y, z, u, v
    vertex(0, 400,   0, 1, 0);
    vertex(0, 400, 400, 1, 1);
    vertex(0,   0, 400, 0, 1);
  endShape();
}













沒有留言:

張貼留言