じょりじょり日記

JavaScript100サイトチャレンジを記録するブログです。

JavaScriptチャレンジ Processing vol3

今日はProcessingでクラスヘアのような描画を学びました。
mousePressedされた時にoutlineの色を変えるだけで格好良くなるものですね〜。

それはそうと寝る前のExampleを写経する習慣、ぜひともルーチン化できるよう頑張ります!

ちょっとリアル話ですが、今日始めての免許更新に行ってきました。
まる1日覚悟で行ったのですが、意外にすんなり出来たので良かったです。
しかし埼玉県の初回免許更新は、鴻巣という片田舎に出向く必要があり、片道1時間半という・・・。しかも講習時間が2時間と結構長かったので眠くなりそうでした、が、先生のお話がとても面白かったのでワクワクしながら受講できました。

僕もイベントの際にあれくらい流暢に話せるようになると聞き手を惹きつけられるんだろうなぁ・・・。



f:id:zyoryzyory:20170903234753p:plain

//https://processing.org/examples/mousepress.html

void setup() {
  size(640, 360);
  //アンチエイリアス処理をオフにする。高速で描画したいときはnoSmooth()にしたほうがよい
  //DefaultはSmooth()なので重たい処理をする時はnoSmooth()と記述しておく
  noSmooth();
  //このfillの役割が上手く説明できない
  fill(126);
  background(102);
}

void draw() {
  //mousePressedの返り値がBoolean型
  if (mousePressed) {
    //outlineを白で塗る
    stroke(255);
  } else {
    stroke(0);
  }
  //横線を描く
  //マウスポインタのある位置から左に66px分ずらし右にも66px分ずらす
  //合わせて132px分横線を取る
  //一瞬考え方に詰まったが、line(x1, y1, x2, y2)を意識したら納得した
  line(mouseX-66, mouseY, mouseX+66, mouseY);
  
  //縦線も要領は一緒
  line(mouseX, mouseY-66, mouseX, mouseY+66); 
}