顯示具有 HW04 標籤的文章。 顯示所有文章
顯示具有 HW04 標籤的文章。 顯示所有文章

2014年1月11日 星期六

第四週作業

void setup() { size(800, 600); } void draw() { strokeWeight(10); //background(255, 255, 255); drawrect(0, 0, 255, 0, 0); drawrect(25, 0, 125, 0, 0); drawrect(0, 25, 0, 255, 0); drawrect(25, 25, 0, 125, 0); drawrect(0, 50, 0, 0, 255); drawrect(25, 50, 0, 0, 125); if (mousePressed && mouseX>0 && mouseX<25&& mouseY<25 && mouseY>0)stroke(255, 0, 0); if (mousePressed && mouseX>0 && mouseX<25&& mouseY<50 && mouseY>25)stroke(0, 255, 0); if (mousePressed && mouseX>0 && mouseX<25&& mouseY<75 && mouseY>50)stroke(0, 0, 255); if (mousePressed)point(mouseX, mouseY); } void drawrect(int rx, int ry, int colorr, int colorg, int colorb) { fill(colorr, colorg, colorb); rect(rx, ry, 25, 25); }

2013年10月2日 星期三

WEEK04,課堂作業

由於星期一有事請假,之後我私下請叫同學教我如何完程課堂作業。
第一節
利用滑鼠事件來畫出自己想要的圖案或是字
void setup() {
  size(400, 400); 視窗大小
  background(255);背景顏色
}
void draw() {
}
void mouseDragged() {  滑鼠事件
  line(mouseX, mouseY, pmouseX, pmouseY); 將滑鼠按下去知後可畫出自己想要的圖案
  stroke(204, 102, 0);線的顏色
  strokeWeight(5);線的粗細
}

第二節
void setup(){
  size(600,600);
  background(255);
}
void draw(){
   fill(121,54,54);
   rect(0,0,150,150);
   fill(92,103,198);
   rect(0,150,150,150);
   fill(92,196,198);
   rect(0,300,150,150);
   fill(64,191,102);
   rect(0,450,150,150);
   fill(227,147,218);
   rect(150,450,150,150);
   fill(185,96,36);
   rect(300,450,150,150);
   fill(139,0,255);
   rect(450,450,150,150);
   fill(193,132,8);
   rect(450,300,150,150);
   fill(5,255,253);
   rect(450,150,150,150);
   fill(148,152,147);
   rect(450,0,150,150);
   fill(54,134,75);
   rect(300,0,150,150);
   fill(53,56,134);
   rect(150,0,150,150);
   
}
void mouseDragged(){
  line(mouseX, mouseY, pmouseX, pmouseY); 
  strokeWeight(5);
}
void mouseReleased(){                                                           點選方塊可以換線的顏色,用滑
   if (mouseX<150 && mouseY<150) stroke(121,54,54);      鼠拖曳,線的顏色就是方塊的顏色。
   else if(mouseX<150 && mouseY<300) stroke(92,103,198);
   else if(mouseX<150 && mouseY<450) stroke(96,196,198);
   else if(mouseX<150 && mouseY<600) stroke(64,191,102);
   else if(mouseX<300 && mouseY<150) stroke(53,56,134);
   else if(mouseX<300 && mouseY<600) stroke(227,147,218);
   else if(mouseX<450 && mouseY<150) stroke(54,134,75);
   else if(mouseX<450 && mouseY<600) stroke(185,96,36);
   else if(mouseX<600 && mouseY<150) stroke(148,152,147);
   else if(mouseX<600 && mouseY<300) stroke(5,255,253);
   else if(mouseX<600 && mouseY<450) stroke(193,132,8);
   else if(mouseX<600 && mouseY<600) stroke(139,0,255);
}


第三節
增加了彩色的漸層色塊
void setup() {
  size(600, 600);
  background(255);
  //noStroke();
  colorMode(RGB, 255);
  fill(121, 54, 54);
  rect(0, 0, 150, 150);
  fill(92, 103, 198);
  rect(0, 150, 150, 150);
  fill(92, 196, 198);
  rect(0, 300, 150, 150);
  fill(64, 191, 102);
  rect(0, 450, 150, 150);
  fill(227, 147, 218);
  rect(150, 450, 150, 150);
  fill(185, 96, 36);
  rect(300, 450, 150, 150);
  fill(139, 0, 255);
  rect(450, 450, 150, 150);
  fill(193, 132, 8);
  rect(450, 300, 150, 150);
  fill(5, 255, 253);
  rect(450, 150, 150, 150);
  fill(148, 152, 147);
  rect(450, 0, 150, 150);
  fill(54, 134, 75);
  rect(300, 0, 150, 150);
  fill(53, 56, 134);
  rect(150, 0, 150, 150);

  colorMode(HSB, 100);
  for (int i = 0; i < 150; i++) {
    for (int j = 0; j < 150; j++) {
      stroke(i, j, 150);
      point(i+225, j+225);
    }
  }
}
void draw() {
}
void mouseDragged() {
  line(mouseX, mouseY, pmouseX, pmouseY);
  strokeWeight(5);
}
void mouseReleased() {                    
  if (mouseX<150 && mouseY<150) stroke(#793636);    
  else if (mouseX<150 && mouseY<300) stroke(#5C67C6);
  else if (mouseX<150 && mouseY<450) stroke(#60C4C6);
  else if (mouseX<150 && mouseY<600) stroke(#40BF66);
  else if (mouseX>225 && mouseX<375 && mouseY>225 && mouseY<375) {
    colorMode(HSB, 100);
    stroke(mouseX, mouseY, 100);
    colorMode(RGB, 255);
  }
  else if (mouseX<300 && mouseY<150) stroke(#353886);
  else if (mouseX<300 && mouseY<600) stroke(#E393DA);
  else if (mouseX<450 && mouseY<150) stroke(#36864B);
  else if (mouseX<450 && mouseY<600) stroke(#B96024);
  else if (mouseX<600 && mouseY<150) stroke(#949893);
  else if (mouseX<600 && mouseY<300) stroke(#05FFFD);
  else if (mouseX<600 && mouseY<450) stroke(#C18408);
  else if (mouseX<600 && mouseY<600) stroke(#8B00FF);
}


void setup() {
  size(500, 500);
  background(255);
  noStroke();
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i+2, j+2);
    }
  }

  fill(255);
  rect(398, 0, 100, 100);
  strokeWeight(30);
  stroke(#000000);
  point(450, 50);
}
void draw() {
}

void mouseDragged() {
  line(mouseX, mouseY, pmouseX, pmouseY);
   strokeWeight(7);
}
void mousePressed() {
  if (mouseX<150 && mouseY<150)
  {
    colorMode(HSB, 100);
    stroke(mouseX, mouseY, 100);
  }

}

2013年9月30日 星期一

Week4

##課堂內容
http://2013interaction.blogspot.tw/2013/09/week04_9030.html

##實作

開視窗,做滑鼠畫線





















畫筆顏色





















最後,加上筆粗控制


====程式碼====
void setup()
{
  size(500,500);
  background(255,255,255);
  //色塊
  noStroke();
  colorMode(RGB, 255);
  fill(255,0,0);  rect(50,400,50,50);
  fill(255,255,0);  rect(110,400,50,50);
  fill(0,255,0);  rect(170,400,50,50);
  fill(0,255,255);  rect(230,400,50,50);
  fill(0,0,255);  rect(290,400,50,50);
  fill(255,0,255);  rect(350,400,50,50);
  fill(255,255,255);stroke(0,0,0);rect(410,400,50,50);
  //漸層色
  noStroke();
  colorMode(HSB, 150);
  for (int i = 0; i < 150; i++)
  {    for (int j = 0; j < 150; j++)
    {      stroke(i, j, 150);
           point(i, j);
    }
  }
  //筆的粗細
  fill(255);  rect(425,25,50,50);  strokeWeight(50);  point(450,50);
  strokeWeight(1);//這邊要把筆粗還原不然下一個框框會用筆粗50畫XD
  fill(255);  rect(425,85,50,50);  strokeWeight(30);  point(450,60);
  strokeWeight(1);
  fill(255);  rect(425,145,50,50);  strokeWeight(10);  point(450,170);
}
void draw(){}
void mouseDragged()//滑鼠拖曳
{
  line(mouseX,mouseY,pmouseX,pmouseY);
}
void mousePressed()//滑鼠按下
{
  if(mouseX<100 && mouseY<100)//漸層色選色
  {
    colorMode(HSB,100);
    stroke(mouseX,mouseY,100);
  }
  //一般色塊選色
  else if(50<mouseX && mouseX<100 && 400<mouseY && mouseY<450)stroke(#FF0000);
  else if(110<mouseX && mouseX<160 && 400<mouseY && mouseY<450)stroke(#FFFF00);
  else if(170<mouseX && mouseX<220 && 400<mouseY && mouseY<450)stroke(#00FF00);
  else if(230<mouseX && mouseX<280 && 400<mouseY && mouseY<450)stroke(#00FFFF);
  else if(290<mouseX && mouseX<340 && 400<mouseY && mouseY<450)stroke(#0000FF);
  else if(350<mouseX && mouseX<400 && 400<mouseY && mouseY<450)stroke(#FF00FF);
  else if(410<mouseX && mouseX<460 && 400<mouseY && mouseY<450)stroke(#FFFFFF);
   else if(400<mouseX && mouseX<450 && 25<mouseY && mouseY<75) strokeWeight(50);
    else if(400<mouseX && mouseX<455 && 85<mouseY && mouseY<135)strokeWeight(30);
     else if(400<mouseX && mouseX<450 && 145<mouseY && mouseY<)strokeWeight(10);
}

第四週 課堂作業

課堂目標: 小畫家

程式碼:

void setup() {
  size(800, 800);
  background(255);

  //設定顏色選取方塊
  noStroke();
  fill(#FF0900); //顏色用代碼,不受 RGB或 HSB影響
  rect(0, 0, 100, 100);
  fill(#FF7300);
  rect(0, 100, 100, 100);
  fill(#FFEA00);
  rect(0, 200, 100, 100);
  fill(#36FF00);
  rect(0, 300, 100, 100);
  fill(#00FFE8);
  rect(0, 400, 100, 100);
  fill(#001BFF);
  rect(0, 500, 100, 100);
  fill(#8B00FF);
  rect(0, 600, 100, 100);

  //color Mode調色盤
  noStroke(); //去除邊線
  colorMode(HSB, 100); // (調色盤模式, 最大值MAX) 
  for (int i = 0; i < 100; i++) {
    for (int j = 700; j < 800; j++) {
      stroke(i, j, 100); // (i, j, alpha)
      point(i, j);
    }
  }

  //筆粗
  stroke(0);
  fill(255);
  rect(700, 0, 100, 100);
  fill(0);
  strokeWeight(30);
  stroke(0);
  point(750, 50);

  stroke(0);
  strokeWeight(1);
  fill(255);
  rect(700, 100, 100, 100);
  fill(0);
  strokeWeight(15);
  stroke(0);
  point(750, 150);

  stroke(0);
  strokeWeight(1);
  fill(255);
  rect(700, 200, 100, 100);
  fill(0);
  strokeWeight(3);
  stroke(0);
  point(750, 250);

  //存檔
  strokeWeight(1);
  fill(255);
  rect(700, 300, 100, 100);
  fill(0);
  text("save image", 720, 350);
}
void draw() {
}
void mouseDragged() {
  //畫線
  if (mouseX>100){
    if(mouseX<700 || mouseY>400){
      line( mouseX, mouseY, pmouseX, pmouseY );
    }
  }
}
void mouseClicked() {
  //選擇顏色
  if (mouseX<100 && mouseY<100) stroke(#FF0900);
  else if (mouseX<100 && mouseY<200) stroke(#FF7300);
  else if (mouseX<100 && mouseY<300) stroke(#FFEA00);
  else if (mouseX<100 && mouseY<400) stroke(#36FF00);
  else if (mouseX<100 && mouseY<500) stroke(#00FFE8);
  else if (mouseX<100 && mouseY<600) stroke(#001BFF);
  else if (mouseX<100 && mouseY<700) stroke(#8B00FF);
  else if (mouseX<100 && mouseY<800) stroke(mouseX, mouseY, 100);

  //選擇粗細
  if (mouseX>700 && mouseY<100) strokeWeight(30);
  else if (mouseX>700 && mouseY<200) strokeWeight(15);
  else if (mouseX>700 && mouseY<300) strokeWeight(3);
  else if (mouseX>700 && mouseY<400) save("practice.png");
}



99163116 鄭祥斌

void setup(){
  size(400,400);
  background(255);
}
void draw(){

}
void mouseDragged(){
  line(mouseX, mouseY, pmouseX, pmouseY);  (pmouseX,pmouseY)劃一條線到滑鼠之前的位置
  storke(125,100,0);  筆觸顏色
  strokeWeight(5);   筆觸寬度
}

void setup(){
  size(750,750);
  background(255);
}
void draw(){
   fill(255,0,0);
   rect(0,0,150,150);
   fill(255,111,0);
   rect(0,150,150,150);
   fill(255,226,0);
   rect(0,300,150,150);
   fill(0,255,0);
   rect(0,450,150,150);
   fill(0,0,255);
   rect(0,600,150,150);
   fill(250,0,255);
   rect(150,600,150,150);
   fill(139,0,255);
   rect(300,600,150,150);
   fill(193,132,8);
   rect(450,600,150,150);
   fill(5,255,253);
   rect(600,600,150,150);
}
void mouseDragged(){
  line(mouseX, mouseY, pmouseX, pmouseY);
  strokeWeight(5);
}
void mouseReleased(){
   if (mouseX<150 && mouseY<150) stroke(255,0,0);
   else if(mouseX<150 && mouseY<300) stroke(255,111,0);
   else if(mouseX<150 && mouseY<450) stroke(255,226,0);
   else if(mouseX<150 && mouseY<600) stroke(0,255,0);
   else if(mouseX<150 && mouseY<750) stroke(0,0,255);
   else if(mouseX<300 && mouseY<750) stroke(250,0,255);
   else if(mouseX<450 && mouseY<750) stroke(139,0,255);
   else if(mouseX<600 && mouseY<750) stroke(193,132,8);
   else if(mouseX<750 && mouseY<750) stroke(5,255,253);
}

void setup(){
  size(750,750);
  background(255);
  noStroke();
colorMode(HSB, 100);
for (int i = 0; i < 100; i++) {
  for (int j = 0; j < 100; j++) {
    stroke(i, j, 100);
    point(i, j);
  }
}
}
void draw(){
 
}
void mouseDragged(){
  line(mouseX, mouseY, pmouseX, pmouseY);
  strokeWeight(5);
}
void mouseReleased(){
   if (mouseX<150 && mouseY<150) stroke(mouseX,mouseY,100);
 
}

void setup() {
  size(750, 750);
  background(255);
  noStroke();
  colorMode(RGB, 255);
  fill(255, 0, 0);
  rect(0, 0, 150, 150);
  fill(255, 111, 0);
  rect(0, 150, 150, 150);
  fill(255, 226, 0);
  rect(0, 300, 150, 150);
  fill(0, 255, 0);
  rect(0, 450, 150, 150);
  fill(0, 0, 255);
  rect(0, 600, 150, 150);
  fill(250, 0, 255);
  rect(150, 600, 150, 150);
  fill(139, 0, 255);
  rect(300, 600, 150, 150);
  fill(193, 132, 8);
  rect(450, 600, 150, 150);
  fill(5, 255, 253);
  rect(600, 600, 150, 150);

  colorMode(HSB, 100);
  for (int i = 0; i < 150; i++) {
    for (int j = 0; j < 150; j++) {
      stroke(i, j, 100);
      point(i+600, j);
    }
  }
}
void draw() {
}
void mouseDragged() {
  line(mouseX, mouseY, pmouseX, pmouseY);
  strokeWeight(5);
}
void mouseReleased() {
  if (mouseX<150 && mouseY<150) stroke(#FF0000);
  else if (mouseX<150 && mouseY<300) stroke(#FF6F00);
  else if (mouseX<150 && mouseY<450) stroke(#FFE200);
  else if (mouseX<150 && mouseY<600) stroke(#00FF00);
  else if (mouseX<150 && mouseY<750) stroke(#0000FF);
  else if (mouseX<300 && mouseY<750) stroke(#FA00FF);
  else if (mouseX<450 && mouseY<750) stroke(#8B00FF);
  else if (mouseX<600 && mouseY<750) stroke(#C18408);
  else if (mouseX<750 && mouseY<750) stroke(#05FFFD);
  else if (mouseX<750 && mouseY<150) {
    colorMode(HSB, 100);
    stroke(mouseX, mouseY, 100);
    //colorMode(RGB,255);
  }
}

void setup() {
  size(750, 750);
  background(255);
  noStroke();
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
    }
  }

  fill(255);
  rect(400, 0, 100, 100);
  strokeWeight(30);
  stroke(#000000);
  point(450, 50);
}
void draw() {
}

//void mouseDragged() {
//  line(mouseX, mouseY, pmouseX, pmouseY);
//}
void mousePressed() {
  if (mouseX<150 && mouseY<150)
  {
    colorMode(HSB, 100);
    stroke(mouseX, mouseY, 100);
  } 
  //  else if (mouseX<150 && mouseY<300) {
  //else if (mouseX<150&&mouseY<300)
  
    stroke(#8FF5E8);
  //}
}

廖中遠 HW04




PImage imgBird;
void setup() {
  size(400, 400);
  background(255);
  noStroke();
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
    }
  }  
  //imgBird=loadImage("http://www.uusucai.com/d/file/gif/2013/04/24/14cfda7a5eb86e79690b087366dccd4d.gif");
  imgBird=loadImage("pen1.gif");
  imageMode(CENTER);
  cursor(imgBird);


  stroke(#000000);
  strokeWeight(1);  
  line(330, 20, 380, 20);

  strokeWeight(4);  
  line(330, 40, 380, 40);

  strokeWeight(10);  
  line(330, 70, 380, 70);
}

void draw() {
}
void mousePressed() {
  if (mouseX<100 && mouseY<100) stroke(mouseX, mouseY, 100);
  
  if(mouseX>300 && mouseY<30) strokeWeight(1);
  else if(mouseX>300 && mouseY<50) strokeWeight(4);
  else if(mouseX>300 & mouseY<90) strokeWeight(10);
}
void mouseDragged() {
  line(mouseX, mouseY, pmouseX, pmouseY);
}
void keyPressed() {
    if (key=='s')    save("draw.jpg");
  }



第4周





Week04 謝瑞發



心得:
        這次的課堂作業是製作小畫家並存檔 我認為如果把方塊設定得好的話基本上不會太難
不過要注意的是畫線繪畫的區塊的問題   不過只要設定好if 九可以搞定了 只是筆速太快或者比粗太粗還是會超出去 所以我設定了一個絕對領域給他以避免突破。

第四周課堂作業

作品:



心得:
自己做出一個小畫家真的很好玩!!!
希望可以用Processing做出更多東西XD
謝謝老師!!

黃敦群的第四周作業




其實從網站可以慢慢找出很多方法去做功能
再配合老師教的會讓我們完成許多想呈現的東西
若有時間 希望可以再多做出許多新功能!!

胡凱翔的第四周作業






Week04














2013年9月29日 星期日

Week04 鄭羽婷

Week04-1

void setup(){
  size(500,500);
  background(255);
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
    }
  }
  fill(255);
  rect(400,0,100,100);
  strokeWeight(30);
  stroke(#000000);
  point(450,50);

}
void draw(){
}
void mouseDragged(){
   line(pmouseX, pmouseY, mouseX,mouseY);
}
void mouseClicked(){
  if(mouseX<100 && mouseY<100){
    stroke(mouseX,mouseY,100);
    point(450,50);
  }
}

//加入印章功能
PImage img;
int a=0;
void setup(){
  size(500,500);
  background(255);
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
    }
  }
  fill(255);
  rect(400,0,100,100);
  strokeWeight(30);
  stroke(#000000);
  point(450,50);

  img=loadImage("1.jpg");

  
}
void draw(){   
   image(img,0,100,100,100);
}
void mouseDragged(){
   if(a==0)line(pmouseX, pmouseY, mouseX,mouseY);
}
void mouseClicked(){
  
  if(mouseX<100 && mouseY<100){
    a=0;
    stroke(mouseX,mouseY,100); 
    point(450,50);  
  }
  else {
    if(a==1)image(img,mouseX-50,mouseY-50,100,100);
    else if(mouseX<100 && mouseY<200){
    a=1;
    }
  }
}  

心得

Processing 做 3D Game 應該會很有趣 

陳建勳的第四周作業













Week 04

1. 一開始畫出不同顏色的線條

void setup(){
  size(400,500);
  background(255);
}
void draw(){


}

void mouseDragged(){
  stroke(204,102,0);// 改變筆觸顏色
  line (mouseX,mouseY,pmouseX,pmouseY);
}


2.   5個顏色框框 可以分別劃出不同顏色的線

void setup(){
  size(800,500);
  background(255);
}
void draw(){
  fill(255,0,0);
  rect(0,0 ,100,100); //畫紅色的框框
  fill(255,139,85);
  rect(0,100 ,100,100); //畫橘色的框框
  fill(247,254,36);
  rect(0,200 ,100,100); //畫黃色的框框
  fill(0,255,0);
  rect(0,300 ,100,100); //畫綠色的框框
  fill(0,0,255);
  rect(0,400 ,100,100); //畫藍色的框框
}

void mouseDragged(){
  
  line (mouseX,mouseY,pmouseX,pmouseY);
  
}
/*void mouseClicked(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(0,255,0);
  else if(mouseX<100 && mouseY<300) stroke(0,0,255);
}*/ //CLICKED會有時候出錯
void mousePressed(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(255,139,85);//橘色
  else if(mouseX<100 && mouseY<300) stroke(247,254,36);//黃色
  else if(mouseX<100 && mouseY<400) stroke(0,255,0);//綠色
  else if(mouseX<100 && mouseY<500) stroke(0,0,255);//藍色
} //Pressed比較不會出錯



3.HSB /RGB兩個測試

HSB

void setup(){
  size(800,500);
  background(255);
}
void draw(){
  fill(255,0,0);
  rect(0,0 ,100,100); //畫紅色的框框
  fill(255,139,85);
  rect(0,100 ,100,100); //畫橘色的框框
  fill(247,254,36);
  rect(0,200 ,100,100); //畫黃色的框框
  fill(0,255,0);
  rect(0,300 ,100,100); //畫綠色的框框
  fill(0,0,255);
  rect(0,400 ,100,100); //畫藍色的框框
  fill(80,40,247);
  rect(700,0 ,100,100); //畫靛色的框框
  fill(153,40,247);
  rect(700,100 ,100,100); //畫紫色的框框
  fill(0,0,0);
  rect(700,200 ,100,100); //畫黑色的框框
  fill(255,255,255);
  rect(700,300 ,100,100); //畫白色的框框
  fill(28,249,255);
  rect(700,400 ,100,100); //畫淺藍色的框框
}

void mouseDragged(){
  
  line (mouseX,mouseY,pmouseX,pmouseY);
  
}
/*void mouseClicked(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(0,255,0);
  else if(mouseX<100 && mouseY<300) stroke(0,0,255);
}*/ //CLICKED會有時候出錯
void mousePressed(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(255,139,85);//橘色
  else if(mouseX<100 && mouseY<300) stroke(247,254,36);//黃色
  else if(mouseX<100 && mouseY<400) stroke(0,255,0);//綠色
  else if(mouseX<100 && mouseY<500) stroke(0,0,255);//藍色
  
  else if(mouseX>700 && mouseY<100) stroke(80,40,247);//靛色
  else if(mouseX>700 && mouseY<200) stroke(153,40,247);//紫色
  else if(mouseX>700 && mouseY<300) stroke(0,0,0);//黑色
  else if(mouseX>700 && mouseY<400) stroke(255,255,255);//白色
  else if(mouseX>700 && mouseY<500) stroke(28,249,255);//淺藍色
} //Pressed比較不會出錯

RGB

void setup(){
  size(800,500);
  background(255);
  
  colorMode(RGB, 255);
  //fill(255,0,0);
  //rect(0,0 ,100,100); //畫紅色的框框
  fill(255,139,85);
  rect(0,100 ,100,100); //畫橘色的框框
  fill(247,254,36);
  rect(0,200 ,100,100); //畫黃色的框框
  fill(0,255,0);
  rect(0,300 ,100,100); //畫綠色的框框
  fill(0,0,255);
  rect(0,400 ,100,100); //畫藍色的框框
  fill(80,40,247);
  rect(700,0 ,100,100); //畫靛色的框框
  fill(153,40,247);
  rect(700,100 ,100,100); //畫紫色的框框
  fill(0,0,0);
  rect(700,200 ,100,100); //畫黑色的框框
  fill(255,255,255);
  rect(700,300 ,100,100); //畫白色的框框
  fill(28,249,255);
  rect(700,400 ,100,100); //畫淺藍色的框框
  
  noStroke();
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
  }
}



}
void draw(){
  
}

void mouseDragged(){
  
  line (mouseX,mouseY,pmouseX,pmouseY);
  
}
/*void mouseClicked(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(0,255,0);
  else if(mouseX<100 && mouseY<300) stroke(0,0,255);
}*/ //CLICKED會有時候出錯
void mousePressed(){
  if(mouseX<100 && mouseY<100){
    colorMode(HSB,100);
    stroke(mouseX,mouseY,255);
  }
  else if(mouseX<100 && mouseY<200){
     colorMode(RGB,255);
    stroke(255,139,85);//橘色
}
  else if(mouseX<100 && mouseY<300){
  colorMode(RGB,255); 
  stroke(247,254,36);//黃色
}
  else if(mouseX<100 && mouseY<400){
  colorMode(RGB,255); 
  stroke(0,255,0);//綠色
}
  else if(mouseX<100 && mouseY<500){
  colorMode(RGB,255); 
  stroke(0,0,255);//藍色
}
  
  else if(mouseX>700 && mouseY<100){
  colorMode(RGB,255); 
  stroke(80,40,247);//靛色
}
  else if(mouseX>700 && mouseY<200){
  colorMode(RGB,255); 
  stroke(153,40,247);//紫色
  else if(mouseX>700 && mouseY<300){
  colorMode(RGB,255); 
  stroke(0,0,0);//黑色
}
  else if(mouseX>700 && mouseY<400){
  colorMode(RGB,255);  
  stroke(255,255,255);//白色
else if(mouseX>700 && mouseY<500){
  colorMode(RGB,255);  
  stroke(28,249,255);//淺藍色
}
} //Pressed比較不會出錯

4.最終作品~~小畫家

void setup(){
  size(800,500);
  background(255);
 
 
  colorMode(RGB, 255);
  //fill(255,0,0);
  //rect(0,0 ,100,100); //畫紅色的框框
  fill(255,139,85);
  rect(0,100 ,100,100); //畫橘色的框框
  fill(247,254,36);
  rect(0,200 ,100,100); //畫黃色的框框
  fill(0,255,0);
  rect(0,300 ,100,100); //畫綠色的框框
  fill(0,0,255);
  rect(0,400 ,100,100); //畫藍色的框框

 
  noStroke();
  colorMode(HSB, 100);
  for (int i = 0; i < 100; i++) {
    for (int j = 0; j < 100; j++) {
      stroke(i, j, 100);
      point(i, j);
  }
}
  fill(255);
  rect(700,0,100,100);
  strokeWeight(10);
  stroke(#000000);
  point(750,50);
   fill(255);
 
}
void draw(){
  if (mouseX < 50) {
    cursor(CROSS);
  } else {
    cursor(HAND);
  }
}

void keyPressed(){ //按S就會存檔
  if(key =='s'){
    save("paint.jpg");
  }
}

void mouseDragged(){
 
 if(mouseX>100) line (mouseX,mouseY,pmouseX,pmouseY);//這樣才不會畫到

}
/*void mouseClicked(){
  if(mouseX<100 && mouseY<100) stroke(255,0,0);
  else if(mouseX<100 && mouseY<200) stroke(0,255,0);
  else if(mouseX<100 && mouseY<300) stroke(0,0,255);
}*/ //CLICKED會有時候出錯
void mousePressed(){
  if(mouseX<100 && mouseY<100){
    colorMode(HSB,100);
    stroke(mouseX,mouseY,255);
  }
  else if(mouseX<100 && mouseY<200){
     colorMode(RGB,255);
    stroke(255,139,85);//橘色
}
  else if(mouseX<100 && mouseY<300){
  colorMode(RGB,255);
  stroke(247,254,36);//黃色
}
  else if(mouseX<100 && mouseY<400){
  colorMode(RGB,255);
  stroke(0,255,0);//綠色
}
  else if(mouseX<100 && mouseY<500){
  colorMode(RGB,255);
  stroke(0,0,255);//藍色
}
 


} //Pressed比較不會出錯





5.心得:
終於完成了這次的作品了,我的小畫家有4個格子可以在四格格子換色 然後基本的第一個格子可以隨便選顏色換喜歡的顏色,右上角是線條粗細,很開心的是我可以完成一個特別的程式了,從開始聽到小畫家的時候,其實有點不敢相信自己可以完成類似的程式,非常感謝老師,今天學到怎麼存檔,怎麼樣可以改變滑鼠指標,改變線條粗細,改變顏色,之前的透明度有稍微複習一下,這次沒使用到,但是更加了解了,然後還學到滑鼠指令,CLICK跟PRESSED的差異,開檔案怎麼開,如果想要用在網路上的圖片,要怎麼用,可以只用開檔的指令就可以使用等等...,今天真的收穫很多!學程式因為老師開心的教導我們才能學的這麼開心~~真的謝謝