processing #7 オブジェクト指向Image

最近は、コードを書いて終わりというのが少し増えてしまいnoteをかけていないので最近やっとオブジェクト指向のイメージがついてきたので自分なりにまとめていきたいなと思います。

１　オブジェクト指向の定義

オブジェクト指向（object-oriented）の言葉を生み出した計算機科学者アラン・ケイは、1972年に発表した論文の中でその設計構想を六つの要約で説明している[1]。
1.EverythingIsAnObject.
2.Objects communicate by sending and receiving messages (in terms of objects).
3.Objects have their own memory (in terms of objects).
4.Every object is an instance of a class (which must be an object).
5.The class holds the shared behavior for its instances (in the form of objects in a program list).
6.To eval a program list, control is passed to the first object and the remainder is treated as its message.

なかなかわかりづらい...

自分的には”処理のBOX化”みたいなものかなって思ってたりして、どうゆうことかっていうと、例えば、スーパーのレジをイメージして、商品の読み込み→値段の出力→合計金額の出力→払ったお金の入力→お釣りの出力って流れがあったら、BOXは２つくれて

１つはある商品（くだもの）の名前を入力すると値段を出力
もう１つは払った値段に対してのお釣りの出力

っていうBOXがつくれて、この２つのBOXは相互独立していて、ブロックみたいにつけたりはずしたり自分でカスタムできるようになってて、もし１つ目のBOXをくだものじゃなくて、おもちゃにしたかったら、おもちゃ用のBOXをつくって、くだものBOXと交換すればよくて、このときお釣りBOXは作り直す必要が無くて、このBOX化のイメージがオブジェクト指向の雰囲気なのかなって思ってる。

それに気づいてうれしくて作ったのが次（汚くてすいません）

２　今回のコード

creatturn cre1;

void setup(){
  size(600,600);
  background(40);
  cre1 = new creatturn(120,300);
}

void draw(){
  background(40);
  cre1.upDate();
}

class creatturn {
  miniturn tel1 = new miniturn(1);
  miniturn tel2 = new miniturn(2);
  miniturn tel3 = new miniturn(3);
  miniturn tel4 = new miniturn(4);
  float wx, wy;
  float r;
  int tt=0;
  creatturn(float a, float b) {
    r=a;
    wx=a;
    wy=b;
  }
  void upDate() {
    wx=(width/2-r)*cos(radians(tt))+width/2;
    wy=(width/2-r)*sin(radians(tt))+height/2;
    tel1.upwalk(wx, wy);

    wx=(width/2-r)*cos(radians(tt+90))+width/2;
    wy=(width/2-r)*sin(radians(tt+90))+height/2;
    tel2.upwalk(wx, wy);

    wx=(width/2-r)*cos(radians(tt+180))+width/2;
    wy=(width/2-r)*sin(radians(tt+180))+height/2;
    tel3.upwalk(wx, wy);

    wx=(width/2-r)*cos(radians(tt+270))+width/2;
    wy=(width/2-r)*sin(radians(tt+270))+height/2;
    tel4.upwalk(wx, wy);

    tt++;
  }
}

class miniturn {
  float x;
  float y;
  int t=0;
  int d;
  float zx, zy;
  miniturn(int c) {
    x=0;
    y=0;
    d=c;
  }
  void upwalk(float wx, float wy) {
    zx=wx;
    zy=wy;
    pushMatrix();
    translate(zx, zy);
    x=40*cos(radians(t));
    y=40*sin(radians(t));
    fill(120, 193, 196);
    noStroke();
    ellipse(x, y, 25, 25);

    fill(90, 193, 196);
    noStroke();
    x=40*cos(radians(t+45));
    y=40*sin(radians(t+45));
    ellipse(x, y, 25, 25);

    fill(90, 193, 196);
    noStroke();
    x=40*cos(radians(t+90));
    y=40*sin(radians(t+90));
    ellipse(x, y, 25, 25);

    fill(90, 193, 196);
    noStroke();
    x=40*cos(radians(t+135));
    y=40*sin(radians(t+135));
    ellipse(x, y, 25, 25);

    fill(60, 193, 196);
    noStroke();
    x=40*cos(radians(t+180));
    y=40*sin(radians(t+180));
    ellipse(x, y, 25, 25);

    fill(249, 122, 197);
    noStroke();
    x=40*cos(radians(t+225));
    y=40*sin(radians(t+225));
    ellipse(x, y, 25, 25);

    fill(243, 138, 238);
    noStroke();
    x=40*cos(radians(t+270));
    y=40*sin(radians(t+270));
    ellipse(x, y, 25, 25);

    fill(210, 123, 245);
    noStroke();
    x=40*cos(radians(t+315));
    y=40*sin(radians(t+315));
    ellipse(x, y, 25, 25);

    fill(130, 134, 245);
    noStroke();
    x=40*cos(radians(t+360));
    y=40*sin(radians(t+360));
    ellipse(x, y, 25, 25);

    popMatrix(); 
    t+=d;
  }
}

３　作品ギャラリー

４　今回の製作イメージ

もう見た目から、かなりかわいくていつまでも見れるようなふんわりさをだしたんです！（今回の話と離れていく（笑））

流れとしては、

小さな〇を８こ円に沿って作ってそれを円の中心を基準に回るクラスminiturnを作って、そのひと固まりを４つ画面の中心を基準に回るように作ったクラスcreatturnという風に、BOX化した箱をさらにBOX化するイメージで作りました。

８この〇が回る塊で、表示や移動ができるのでふつうにコードを書くよりも、自由度が増したなって思います。

細かいことを言うと、階層的には

でっかい箱
creattrun↓
miniturn↓

って感じになってて、コードを読んでもらうと分かるのですが、でっかい箱からcreatturnへのデータ移動は、”画面の中心の数値”で、creatturnからminiturnへのデータ移動は、”各８この〇の中心の数値”に流れていて、１対１でデータが動いているので、中のコードを知らなくても例えば、miniturnクラスに、ある座標を入れたインスタンスを生成すれば、その座標を中心にして、８個の〇が回る図形が表示されるというツールとして使える（便利！）

オブジェクト指向のこのイメージがあると、ちょっとだけコードを読むのが楽しくなるし、ほかの人のコードの一部分だけ切り取って遊んだりできるから、ちょっとだけ聞いてほしかった！！

聞いていただきありがとうございます！！