晚安

 2022互動技術概論   Week_01

上課用軟體在moodle

1. Get started

1-1設定視窗大小  size(  ,  );

1-2設定背景顏色 background(#FFFFFF);

顏色可以在 tool - color selector選取

1-3.繪製矩形 rect(座標,座標,  大小,大小);

1-4.填充色彩 fill(#FFFFFF);

在繪製矩形之前先指定顏色

2.互動程式碼 Active

3.匯出程式至網頁

點開Manage Modes...
安裝P5.js Mode | Adds a simple editor for p5.js code

-在P5.js使用的語言為javaScript
    可以先將程式碼完成後，利用網頁工具https://pde2js.herokuapp.com/翻譯語言

執行後會多出一個html檔， 並開啟瀏覽器

3.小畫家

```

void setup(){

  size(500,500);  ///設定視窗大小

}

void draw(){

  if (mousePressed){  ///滑鼠點擊事件

    line(mouseX,mouseY, pmouseX, pmouseY);  ///畫線

  }

}

```

註:對變數點擊右鍵-參考文件可以查看用法