Week 03 蕭阿火筆記

本日上課內容

-Zuvio回顧進度
-協同合作軟體(Google文件，Evennote)
-課程Blog(作品集)
-實作
-本日體驗：水墨畫
-本日實作：小畫家



Zuvio

Zuvio可建立不同的題目讓使用者作答
Google Doc →Google word使用合作編輯，可以開不同的權限給他人編輯
(事先若有用FB跟LINE的群組，即可以快速傳連結給他人)
可以把Blog的經營包裝成一種"品牌"概念的經營。
建立標籤↓
60408026E_蕭豪軒, Week03,




Processing

運用Processing(MIT的程式設計軟體)來開發手機使用的小畫家。

Step1:上Processing.org
Step2:選擇不donation Free下載
Step3:按照系統選擇下載

安裝軟體後可以使用Processing程式




小畫家程式設計

size(400,600);  //手機畫面的大小
background(150,200,100);//R 0-255 ,G:0-255,B:0-255 三原色的內容
line(10,200, 350,500);  //畫一條線


               //線跟著滑鼠畫出來
void setup(){
size(400,600);//cellphone size
background(150,200,100);//R 0-255 ,G:0-255,B:0-255
}
void draw(){

  line(mouseX,mouseY, pmouseX,pmouseY)
}

              //會發現線不會斷，很難以繪畫，因此新增if判斷，增加讓滑鼠按下才可以有線段
              //mouseX,mouseY 得到滑鼠的x,y座標(電腦中的x為右向為正、y為下向為正)
              //pmouseX,pmouseY則得到上一個滑鼠的x,y座標


void draw(){
  if(mousePressed)
  line(mouseX,mouseY, pmouseX,pmouseY)
}

               //stroke→筆觸(調整顏色)  strokeWeight→筆寬(調整寬度)
               //strokeCap改筆觸的前後形狀;→strokeCap(ROUND)圓的 strokeCap(SQUARE);方的
void draw(){
  if(mousePressed){
  stroke(255,0,0);
  strokeWeight(24);
  strokeCap(SQUARE);
  line(mouseX,mouseY, pmouseX,pmouseY);}
}

              //新增顏色方塊

rect(0,10, 50,50);
fill(255,0,0);

rect(0,60, 50,50);
fill(0,255,0);

rect(0,110, 50,50);
fill(0,0,255);


              //滑鼠點到顏色方塊中，更改筆觸顏色

if(mousePressed && mouseX<50 && mouseY<60) stroke(150,200,100);
  else if(mousePressed && mouseX<50 && mouseY<110) stroke(255,0,0);
  else if(mousePressed && mouseX<50 && mouseY<160) stroke(0,255,0);
  else if(mousePressed && mouseX<50 && mouseY<210) stroke(0,0,255);
  else if(mousePressed && mouseX<50 && mouseY<260) stroke(200,100,50);
  else if(mousePressed && mouseX<50 && mouseY<310) stroke(100,100,50);

              //最後程式
void setup(){
size(400,600);//cellphone size
background(150,200,100);//R 0-255 ,G:0-255,B:0-255
rect(0,10, 50,50);
fill(255,0,0);

rect(0,60, 50,50);
fill(0,255,0);

rect(0,110, 50,50);
fill(0,0,255);

rect(0,160, 50,50);
fill(200,100,50);

rect(0,210, 50,50);
fill(100,100,50);
}
void draw(){
  if(mousePressed && mouseX<50 && mouseY<60){ stroke(150,200,100);strokeWeight(100);}
  else if(mousePressed && mouseX<50 && mouseY<110) stroke(255,0,0);
  else if(mousePressed && mouseX<50 && mouseY<160) stroke(0,255,0);
  else if(mousePressed && mouseX<50 && mouseY<210) stroke(0,0,255);
  else if(mousePressed && mouseX<50 && mouseY<260) stroke(200,100,50);
  else if(mousePressed && mouseX<50 && mouseY<310) stroke(100,100,50);

  else if(mousePressed){
  strokeWeight(10);
  strokeCap(SQUARE);
  line(mouseX,mouseY, pmouseX,pmouseY);}
}