Week12-唐門外系弟子-林活修行互動技術秘笈

 week12_01_libraries_sound_SoundFile_sound_isPlaying

複習一下上次學習到Sound資料庫函式

//官網-Documentaion-Libraries函式庫(圖書館)-Sound聲音部分
//https://processing.org/reference/libraries/sound/index.html
//我們教過 play() stop() pause()
import processing.sound.*;
SoundFile sound1, sound2;
int playing = 1;
void setup(){
  size(640,360);
  background(255);
  sound1 = new SoundFile(this, "Intro Song_Final.mp3");
  sound2 = new SoundFile(this, "In Game Music.mp3");  
}
void draw(){
  if(sound1.isPlaying()){
    playing=1;
  }else if(sound2.isPlaying()){
    playing=2;
  }else{
    if(playing==1) sound2.play();
    else sound1.play();
 }
}

week12-02_bezier-sample

貝茲函式 麻煩的取線

//按右鍵, 找bezier() 函式的網站文件
size(500,500);
noFill();
stroke(255, 102, 0);
line(340, 80, 40, 40);
line(360, 360, 60, 320);
stroke(0, 0, 0);
bezier(340, 80, 40, 40, 360, 360, 60, 320);

week12_03_bezier_1_3_3_1_equation_mouseDragged_change-t
讓球體可以跑在取線上面， 用數學公式去繪製
void setup() {
  size(500, 500);
}
PVector p0 =new PVector(340, 80);
PVector p1 =new PVector(40, 40);
PVector p2 =new PVector(360, 360);
PVector p3 =new PVector(60, 320);
float t = 0.0;
void draw() {
  background(255);
  noFill();
  stroke(255, 102, 0);
  line(340, 80, 40, 40);
  line(360, 360, 60, 320);
  stroke(0, 0, 0);
  bezier(340, 80, 40, 40, 360, 360, 60, 320);
  float x = p0.x*(1-t)*(1-t)*(1-t)+3*p1.x*t*(1-t)*(1-t)+3*p2.x*t*t*(1-t)+p3.x*t*t*t;
  float y = p0.y*(1-t)*(1-t)*(1-t)+3*p1.y*t*(1-t)*(1-t)+3*p2.y*t*t*(1-t)+p3.y*t*t*t;
  ellipse(x, y, 10, 10);
}
void mouseDragged(){
  t += 0.01 * (mouseX-pmouseX);
}

week12_04_bezier_for_t_t0_0_many_t
讓球體沿著取線，取得大量球體。
void setup() {
  size(400, 400);
}
PVector p0 =new PVector(120, 80);
PVector p1 =new PVector(320, 20);
PVector p2 =new PVector(320, 300);
PVector p3 =new PVector(120, 300);
float t0 = 0.0;
void draw() {
  background(255);
  noFill();
  stroke(255, 102, 0);
  line(340, 80, 40, 40);
  line(360, 360, 60, 320);
  stroke(0, 0, 0);
  bezier(120, 80, 320, 20, 320, 300, 120, 300);
  for (float t = t0; t>=0; t-=0.025) {
    float x = p0.x*(1-t)*(1-t)*(1-t)+3*p1.x*t*(1-t)*(1-t)+3*p2.x*t*t*(1-t)+p3.x*t*t*t;
    float y = p0.y*(1-t)*(1-t)*(1-t)+3*p1.y*t*(1-t)*(1-t)+3*p2.y*t*t*(1-t)+p3.y*t*t*t;
    ellipse(x, y, 10, 10);
  }
}
void mouseDragged() {
  t0 += 0.01 * (mouseX-pmouseX);
}
week12_05_bezier_ArrayList_class_Ball_draw_ArrayList_add
讓球體可以沿著曲線，自動增加數量。裡面利用物件導向的結構，
但球停不下來。
void setup() {
  size(400, 400);
}
PVector p0 =new PVector(120, 80);
PVector p1 =new PVector(320, 20);
PVector p2 =new PVector(320, 300);
PVector p3 =new PVector(120, 300);
float t0 = 0.0;
ArrayList<Ball> balls = new ArrayList<Ball>();
void draw() {
  background(255);
  noFill();
  stroke(255, 102, 0);
  line(340, 80, 40, 40);
  line(360, 360, 60, 320);
  stroke(0, 0, 0);
  bezier(120, 80, 320, 20, 320, 300, 120, 300);
  for (Ball ball : balls) {
    ball.draw();
  }
  if (frameCount%20==0) balls.add(new Ball(p0, p1, p2, p3) );
}
void mouseDragged() {
  t0 += 0.01 * (mouseX-pmouseX);
}
class Ball {
  PVector p0, p1, p2, p3;
  float t =0.0;
  Ball(PVector _p0, PVector _p1, PVector _p2, PVector _p3) {
    p0 = _p0;
    p1 = _p1;
    p2 = _p2;
    p3 = _p3;
  }
  void draw() {
    float x = p0.x*(1-t)*(1-t)*(1-t)+3*p1.x*t*(1-t)*(1-t)+3*p2.x*t*t*(1-t)+p3.x*t*t*t;
    float y = p0.y*(1-t)*(1-t)*(1-t)+3*p1.y*t*(1-t)*(1-t)+3*p2.y*t*t*(1-t)+p3.y*t*t*t;
    ellipse(x, y, 10, 10);
    t +=0.001;
  }
}



week12_06_bezier_ArrayList_balls_size_get_remove
我們解決了球無限增加的問題。
void setup() {
  size(400, 400);
}
PVector p0 =new PVector(120, 80);
PVector p1 =new PVector(320, 20);
PVector p2 =new PVector(320, 300);
PVector p3 =new PVector(120, 300);
float t0 = 0.0;
ArrayList<Ball> balls = new ArrayList<Ball>();
void draw() {
  background(255);
  noFill();
  stroke(255, 102, 0);
  line(340, 80, 40, 40);
  line(360, 360, 60, 320);
  stroke(0, 0, 0);
  bezier(120, 80, 320, 20, 320, 300, 120, 300);
  for (Ball ball : balls) {
    ball.draw();
  }
  if (frameCount%20==0){
    balls.add(new Ball(p0, p1, p2, p3) );
    println(balls.size());
  }
  if(balls.size()>0 && balls.get(0).t>1.0) balls.remove(0);
}
void mouseDragged() {
  t0 += 0.01 * (mouseX-pmouseX);
}
class Ball {
  PVector p0, p1, p2, p3;
  float t =0.0;
  Ball(PVector _p0, PVector _p1, PVector _p2, PVector _p3) {
    p0 = _p0;
    p1 = _p1;
    p2 = _p2;
    p3 = _p3;
  }
  void draw() {
    float x = p0.x*(1-t)*(1-t)*(1-t)+3*p1.x*t*(1-t)*(1-t)+3*p2.x*t*t*(1-t)+p3.x*t*t*t;
    float y = p0.y*(1-t)*(1-t)*(1-t)+3*p1.y*t*(1-t)*(1-t)+3*p2.y*t*t*(1-t)+p3.y*t*t*t;
    ellipse(x, y, 10, 10);
    t +=0.001;
  }
}