1b-04 反応させる（マウスからの入力に）

マウスからの入力（移動、クリック）に反応して、画面が変化するプログラムを学ぶ。

mouseX, mouseY マウスポインタの位置（座標）

現在のマウスポインタの位置に円が描かれる。

void setup() {
  size(400, 400);
}

void draw() {
  //background(204);
  //fill(0);
  ellipse(mouseX, mouseY, 60, 60);
}

練習

• マウスポインタの位置に円がくっついて動く
• マウスポインタの位置に「10pxの黒い円」を描く

pmouseX, pmouseY 前フレームのマウスポインタの位置（座標）

前フレームのマウスポインタの位置から現フレームのマウスポインタの位置に線が描かれる。（マウスを動かすと、線が描かれるように見える）

void setup() {
  size(400, 400);
  //strokeWeight(10);
}

void draw() {
  line(mouseX, mouseY, pmouseX, pmouseY);
}

練習

• マウスポインタの位置が、画面の左側のときは線の太さを5, 画面の右側のときは線の太さを10にする

mousePressed マウスボタンが押されている（== true）、押されていない（== false）

マウスボタンを押している間、線が描かれる。

void setup() {
  size(400, 400);
  strokeWeight(10);
}

void draw() {
  if (mousePressed == true){
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

void mousePressed() {...} マウスボタンが押されたときに1回だけ {...} の中を実行する

マウスボタンを押すと、円が描かれる。

void setup() {
  size(400, 400);
}

void draw() {
}

void mousePressed() {
  ellipse(mouseX, mouseY, 60, 60);
}

void mouseReleased() {...} マウスボタンが離されたときに1回だけ {...} の中を実行する

マウスボタンを押している間、線が描かれる。ボタンが離されると線が消える。

void setup() {
  size(400, 400);
  strokeWeight(10);
}

void draw() {
  if (mousePressed == true){
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

void mouseReleased() {
  background(204); //マウスボタンが離されると画面がリセットされる
}

練習：次のような動作をするプログラムを書く

マウスポインタの位置に赤い円が描かれる。マウスボタンを押すと、円の塗り色が変わる。

int h=0;

void setup() {
  size(400, 400);
  colorMode(HSB,100);
  background(99);
  noStroke();
}

void draw() {
  fill(h,99,99);
  ellipse(mouseX, mouseY, 60, 60);
}

void mousePressed(){
  h+=5;
  h%=100;
}

マウスボタンを押すと、前回マウスボタンを押した位置からの折れ線が描ける。

float pX, pY;

void setup() {
  size(400, 400);
  strokeWeight(10);
}

void draw() {
}

void mousePressed() {  
  line(pX, pY, mouseX, mouseY);
}

void mouseReleased() {
  pX = mouseX; //マウスボタンが離されたときのx座標を記憶する
  pY = mouseY; //マウスボタンが離されたときのy座標を記憶する
}