09160111互動技術概論week01

 1-1製作大小(500,500)的視窗

 1-2background進行視窗顏色的更改

2-1 透過rect(100,100,100,150);做出一框框

 運用fill(#1B8BDE);在框框中添加上顏色

2-2   rect(mouseX,mouseY,100,150);方塊和滑鼠一起移動

2-3  把互動的程式碼複製到https://pde2js.herokuapp.com/這個網頁上

貼上轉換過後的程式碼，就可以執行了

執行後能夠直接在網頁上呈現出來

3-1
變成小畫家，可以用滑鼠畫畫

void setup(){

size(500,500);

}

void draw(){

 if(mousePressed){

   line(mouseX,mouseY,pmouseX,pmouseY);

 }

3-2
小畫家筆的顏色能夠透過鍵盤換色

void setup(){

size(500,500);

background(#F0950C);

stroke(255,0,0);

}

void draw(){

 if(mousePressed){

   line(mouseX,mouseY,pmouseX,pmouseY);

 }

}

void keyPressed(){

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

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

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

}