Week02

一.點擊滑鼠變換顏色與粗細:

     mousePressed()    滑鼠點擊
     mouseDragged()  滑鼠滑動


void setup(){
  size(800,600);
  colorMode(HSB, 100);
}
void draw(){
  line(mouseX, mouseY, pmouseX, pmouseY);
}
void mouseDragged(){
  if(mouseX<100){   //當滑鼠X座標小於100時,點擊滑鼠改變粗細
    strokeWeight(mouseY/50);
  }
  if(mouseX>700){   //當滑鼠X座標大於700時,點擊滑鼠改變顏色
    stroke(mouseY/6.0 , 100,100);
  }
}

void setup(){
  size(800,600);
  rect(width-100,0, width,height);//畫兩個長方形用來當作粗細與顏色的選擇區塊
  rect(0,0, 100, height);//同上
  colorMode(HSB, 100);//色相 飽和度 亮度
}
void draw(){
  if(mousePressed) line(mouseX, mouseY, pmouseX, pmouseY);//當滑鼠點擊開始畫圖
}
void mouseDragged(){
  if(mouseX<100){
    strokeWeight(mouseY/50);
  }
  if(mouseX>width-100){
    stroke(mouseY/6.0 , 100,100);
  }
}

二.試跑範例

https://www.openprocessing.org/browse#

void setup(){

  size(720,720,P2D);

}

void draw(){

}

void mouseDragged(){

  ellipse(mouseX, mouseY, 100,100);//畫圓

}

void setup(){

  size(720,720,P2D);

}

float pX=-100, pY=-100, r=100;

void draw(){

  ellipse(pX, pY, r, r);

  if(r>3){

    r -= 10;

    pX +=13;

  }

}

void mousePressed(){

  pX=mouseX; pY=mouseY; r=100;

}

三.匯入圖檔


下載圖片

size(500,500);

background(0,235,220);

PImage img=loadImage("dora.png");//檔名要注意

image(img, 0,0, 500,500);

///記得把下載的圖片拖曳到程式中

PImage img1, img2;
void setup(){
  size(500,500);
  img1=loadImage("bird.png");
  img2=loadImage("dora.png");
}
void draw(){
  background(0,255,255);
//PImage img=loadImage("dora.png");
  image(img1, mouseX,mouseY, 100,100);//鳥會跟著滑鼠移動
  image(img2, 200,200, 100,100);
}