☆。week03開始的互動技術。★

★筆記☆
工具->顏色選擇器。
size() //畫面的大小。
line()//劃一條線，從開始點的XY座標，到結束點的XY座標。
rect()//畫一個長方形，從開始點的XY座標，到結束點的XY座標。
fill()//方格填色，A(RGBA)方式ORB(#??????)色碼填色。
background()//背景填色，A(RGBA)方式ORB(#??????)色碼填色。
ellipse()//橢圓形(起點(XY)座標，長，寬。)
void setup(){} //大約等於Strat()
void draw(){} //大約等於Update()
PImage img;增加圖片近來，先進行宣告
img=loadImage("dora.jpg");讀入圖片
image(img,0,0,width,height);顯示圖片
if (mousePressed&& mouseButton == RIGHT) { //如果是右鍵，那就把格子填白
int nowX=mouseX/16*16 , nowY=mouseY/30*30; //偵測在哪個位置，將小數消掉之後讓方格基點在左上角
mouseDragged()//滑鼠移動函式
key//用來偵測鍵盤的按鍵
keyCode//用來偵測沒辦法直接打出來的按鍵 UP RIGHT ALT CTRL ENTER 之類的
可以使用PRINT來偵測KEY OR KEYCODE//可能會因為系統差異而有不同編碼












★☆
void draw(){
  if (mousePressed&& mouseButton == LEFT)
  {
    line(mouseX,mouseY,pmouseX,pmouseY);
  }
}

★☆
void setup() {
  size(600, 800);
  fill(255, 120, 100);
  rect(90, 90, 90, 90);
  fill(120, 255, 100);
  rect(180, 90, 90, 90);
  fill(120, 120, 255);
  rect(270, 90, 90, 90);
}
void draw() {
  if (mousePressed&& mouseButton == LEFT)
  {
    strokeWeight(20);
    line(mouseX, mouseY, pmouseX, pmouseY);
  }

  if (mouseX>90&&mouseX<180&&mouseY>90&&mouseY<180) {
    if (mousePressed&& mouseButton == LEFT)
    {
      stroke(255, 120, 100);
    }
  }
  if (mouseX>180&&mouseX<270&&mouseY>90&&mouseY<180) {
    if (mousePressed&& mouseButton == LEFT)
    {
      stroke(120, 255, 100);
    }
  }
  if (mouseX>270&&mouseX<360&&mouseY>90&&mouseY<180) {
    if (mousePressed&& mouseButton == LEFT)
    {
      stroke(120, 120, 255);
    }
  }
}

★☆

void setup() {
  size(600, 800);
  fill(255, 120, 100);
  rect(90,90,90,90);
  fill(120, 255, 100);
  rect(180, 90, 90, 90);
  fill(120, 120, 255);
  rect(270, 90, 90, 90);
  strokeWeight(20);
  line(300, 360, 400, 360);
  strokeWeight(10);
  line(200, 360, 300, 360);
  strokeWeight(30);
  line(100, 360, 200, 360);
  strokeWeight(10);
}

void draw() {
  if(mouseY>350&&mouseY<370&&mousePressed){
  if (mouseX>280&&mouseX<420) {
    strokeWeight(20);
  }
  if (mouseX>180&&mouseX<320) {
    strokeWeight(10);
  }
  if (mouseX>80&&mouseX<220) {
    strokeWeight(30);
  }
}

  if(mouseY>90&&mouseY<180&&mousePressed){
  if (mouseX>90&&mouseX<180) {
      stroke(255, 120, 100);
  }
  if (mouseX>180&&mouseX<270) {
      stroke(120, 255, 100);
  }
  if (mouseX>270&&mouseX<360) {
      stroke(120, 120, 255);
  }
  }
  if (key=='0') {
    strokeWeight(2);
  }
  if (key=='1') {
    strokeWeight(5);
  }
  if (key=='2') {
    strokeWeight(20);
  }
  if (key=='3') {
    strokeWeight(40);
  }
  if (mousePressed&& mouseButton == LEFT)
  {
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

★☆分類

void setup() {
  size(600, 800);
  fill(255, 120, 100);
  rect(90, 90, 90, 90);
  fill(120, 255, 100);
  rect(180, 90, 90, 90);
  fill(120, 120, 255);
  rect(270, 90, 90, 90);
  strokeWeight(20);
  line(300, 360, 400, 360);
  strokeWeight(10);
  line(200, 360, 300, 360);
  strokeWeight(30);
  line(100, 360, 200, 360);
  strokeWeight(10);
}
void draw() {
}
void mousePressed() {
  if (mouseY>350&&mouseY<370&&mousePressed) {
    if (mouseX>280&&mouseX<420) {
      strokeWeight(20);
    }
    if (mouseX>180&&mouseX<320) {
      strokeWeight(10);
    }
    if (mouseX>80&&mouseX<220) {
      strokeWeight(30);
    }
  }

  if (mouseY>90&&mouseY<180&&mousePressed) {
    if (mouseX>90&&mouseX<180) {
      stroke(255, 120, 100);
    }
    if (mouseX>180&&mouseX<270) {
      stroke(120, 255, 100);
    }
    if (mouseX>270&&mouseX<360) {
      stroke(120, 120, 255);
    }
  }
}
void mouseDragged() {
  line(mouseX, mouseY, pmouseX, pmouseY);
}
void keyPressed() {
  if (key=='0') {
    strokeWeight(2);
  }
  if (key=='1') {
    strokeWeight(5);
  }
  if (key=='2') {
    strokeWeight(20);
  }
  if (key=='3') {
    strokeWeight(40);
  }
  if (keyCode==UP) {
  }
  if (keyCode==DOWN) {
  }
  if (keyCode==LEFT) {
  }
  if (keyCode==RIGHT) {
  }
}

★☆