鯉魚week01

 1.調整視窗大小

    size(500,500);

2.設背景顏色

    background(#EEF7CA);

3.畫四邊形,填充顏色

    fill(#AAD8FF);

    rect(100,100,100,150);    位置,大小

4.互動active

    void setup(){

        size(500,500);

}

    void draw(){

         background(#FFF7AA);

         fill(#AAD8FF);

         rect(100,100,100,150);

         rect(mouseX,mouseY,100,150);    滑鼠移動四邊形

}

5.下載p5.js

6.選p5.js    (網頁互動)

    pricessing to js https://pde2js.herokuapp.com/

   從 java翻譯成javaScript

    網頁互動

7.小畫家

    void setup(){

      size(500,500); 

}

    void draw(){

      if(mousePressed){        滑鼠點擊的情況下

      line(mouseX,mouseY,pmouseX,pmouseY);         位置:滑鼠的位置   pmouse:滑鼠之前的位置

  }

}

8.小畫家進階

    void setup(){    只執行一次

      size(500,500); 

      background(#FFFFF2);

      stroke(255,0,0);    筆觸紅色

}

    void draw(){    每秒60次

      if(mousePressed){

       line(mouseX,mouseY,pmouseX,pmouseY); 

  }

}

    void keyPressed(){    如果有按下按鍵

      if( key == '1' ) stroke(#FA0834);

      if( key == '2' ) stroke(#FACA08);

      if( key == '3' ) stroke(#FAF208);

}