2020年9月21日 星期一

week0202020202

 

void setup()

{

  size(600,500);

}

void draw()

{

  fill(#ff0000); rect(0,0, 100,100);

  fill(#ffff00); rect(0,100, 100,100);

  fill(#00ff00); rect(0,200, 100,100);

  fill(#0000ff); rect(0,300, 100,100);

  fill(#ff00ff); rect(0,400, 100,100);

  if(mousePressed && mouseX <100 )//調色盤

  {

    if(mouseY<100) stroke(#ff0000);

    else if(mouseY<200) stroke(#ffff00);

    else if(mouseY<300) stroke(#00ff00);

    else if(mouseY<400) stroke(#0000ff);

    else if(mouseY<500) stroke(#ff00ff);

  }

  else if(mousePressed && mouseX >100 )//畫圖區

  {

    line(mouseX,mouseY, pmouseX,pmouseY);

  }

}


void setup()

{

  size(600,500);

  fill(#ff0000); rect(0,0, 100,100);

  fill(#ffff00); rect(0,100, 100,100);

  fill(#00ff00); rect(0,200, 100,100);

  fill(#0000ff); rect(0,300, 100,100);

  fill(#ff00ff); rect(0,400, 100,100);

  strokeWeight(5);//粗

}

void keyPressed()//有按鍵按下去

{

  save("123.png");//存檔

}

void draw()

{

  if(mousePressed && mouseX <100 )

  {

    if(mouseY<100) stroke(#ff0000);

    else if(mouseY<200) stroke(#ffff00);

    else if(mouseY<300) stroke(#00ff00);

    else if(mouseY<400) stroke(#0000ff);

    else if(mouseY<500) stroke(#ff00ff);

  }

  else if(mousePressed && mouseX >100 )

  {

    line(mouseX,mouseY, pmouseX,pmouseY);

  }

}

於 沒有留言:
標籤： ,

:0 week02

1.畫布

size(500,500);
background(#00B9FF);
stroke(255,0,0);
fill(255,255,0);

rect(100,100,300,300);


點一下換色
void setup()
{
  size(500,500);
}
void draw()
{
  if(mousePressed)background(255,0,255);
  else background(0,255,0);
}


 

2.小畫家

void setup()
{
  size(500,500);
}
void draw()
{
  if(mousePressed)
  {
    line(mouseX,mouseY,pmouseX,pmouseY);
  }
}

void setup()
{
  size(600,500);
}
void draw()
{
  fill(#ff0000); rect(0,0,100,100);
  fill(#ffff00); rect(0,100,100,100);
  fill(#00ff00); rect(0,200,100,100);
  fill(#0000ff); rect(0,300,100,100);
  fill(#ff00ff); rect(0,400,100,100);
  if(mousePressed && mouseX<100)
  {
    if(mouseY<100)stroke(#ff0000);
    else if(mouseY<200) stroke(#ffff00);
    else if(mouseY<300) stroke(#00ff00);
    else if(mouseY<400) stroke(#0000ff);
    else if(mouseY<500) stroke(#ff00ff);
  }
  else if(mousePressed && mouseX>100)
  {
    line(mouseX,mouseY,pmouseX,pmouseY);
  }
}

畫筆變粗



void setup()

{

  size(600,500);

  fill(#ff0000); rect(0,0,100,100);

  fill(#ffff00); rect(0,100,100,100);

  fill(#00ff00); rect(0,200,100,100);

  strokeWeight(5);

}

void draw()

{

  if(mousePressed && mouseX<100)

  {

    if(mouseY<100)stroke(#ff0000);

    else if(mouseY<200) stroke(#ffff00);

    else if(mouseY<300) stroke(#00ff00);

  }

  else if(mousePressed && mouseX>100)

  {

    line(mouseX,mouseY,pmouseX,pmouseY);

  }

}






於 沒有留言:
標籤： ,

wendy_week2

 互動技術概論 學習日誌


week2

學習目標:
(一)色彩指令
(二)if & else運用
(三)實作小畫家


語言 → Processing
下載網址  →  https://processing.org/download/

(一)色彩指令

背景顏色:
background(色碼);

線框顏色:
stroke(色碼);

填滿顏色:
fill(色碼);


(二)if & else運用




setup()函式:初始設定


void setup(){

  size(500,500);

}

void draw(){

  if(mousePressed){

    background(#30B5CE);
    stroke(#095462);

    fill(#F5B2BF);
    ellipse(250, 250, 200, 200);

    fill(#BC062A);
    ellipse(250, 250, 150, 150);

    fill(#F5B2BF);
    ellipse(250, 250, 100, 100);

    fill(#BC062A);
    ellipse(250, 250, 50, 50);
  }
  else{

    background(#30B5CE);
    stroke(#095462);

    fill(#BC062A);
    ellipse(250, 250, 200, 200);

  }

}

(三)實作小畫家

功能:
(1)自由劃線
(2)選擇顏色
(3)存檔



void setup(){

  size(600,500);
  background(#FFFFFF);

  fill(#FF0000); rect(0,0,100,100);
  fill(#00FF00); rect(0,100,100,100);
  fill(#0000CD); rect(0,200,100,100);
  fill(#FFFF00); rect(0,300,100,100);
  fill(#800080); rect(0,400,100,100);

  strokeWeight(2);

}
void  keyPressed(){
  save("draw.png");
}

void draw(){
 
  if(mousePressed && mouseX<100){
    stroke(#ff0000);
    if(mouseY<100)stroke(#FF0000);
    else if(mouseY<200)stroke(#00FF00);
    else if(mouseY<300)stroke(#0000CD);
    else if(mouseY<400)stroke(#FFFF00);
    else if(mouseY<500)stroke(#800080);    
  }
  else if(mousePressed && mouseX>100){
  
    line(mouseX,mouseY,pmouseX,pmouseY);
  }

}




於 沒有留言:
標籤： ,

week02

 


上圖先複習上週的

上面那張圖可用滑鼠點一下，然後下面那張圖就會變色
上圖滑鼠點一下會變色

上圖可以用滑鼠畫一張圖

上圖就是小畫家簡化版，但是是自己做的!!

我大約懂老師的寫法，具體來說就是用座標來記他位置，然後就會有顏色了。

void setup(){
  size(500,500);///整個圖的大小
}
void draw(){
  fill(#FF0000);rect(0,0,100,100); ///上圖紅色方位
  fill(#FFFF00);rect(0,100,100,100);   ///黃色
  fill(#00FF00);rect(0,200,100,100);    ///綠色
  fill(#0000FF);rect(0,300,100,100);    ///藍色
  fill(#00FFFF);rect(0,400,100,100);    ///淺藍
  if(mousePressed&&mouseX<100){   ///當滑鼠小於灰色的地方時
    if(mouseY<100) stroke(#FF0000); ///點什麼顏色就變甚麼顏色
    else if(mouseY<200) stroke(#FFFF00);///~~~~~~~
    else if(mouseY<300) stroke(#00FF00);///~~~~~~~
    else if(mouseY<400) stroke(#0000FF);///~~~~~~~
    else if(mouseY<500) stroke(#00FFFF);///同上
  }
    else if(mousePressed&&mouseX>100)///當滑鼠大於有顏色的地方時就可以開始畫圖
    {
        line(mouseX,mouseY, pmouseX,pmouseY);
      }
}




最後加了出度還有存檔

void setup(){
  size(500,500);///整個圖的大小
    fill(#FF0000);rect(0,0,100,100); ///上圖紅色方位
    fill(#FFFF00);rect(0,100,100,100);   ///黃色
    fill(#00FF00);rect(0,200,100,100);    ///綠色
    fill(#0000FF);rect(0,300,100,100);    ///藍色
    fill(#00FFFF);rect(0,400,100,100);    ///淺藍
    strokeWeight(5);///粗度大小
}
void keyPressed(){
  save("yes.png");///存檔
}
void draw(){
  if(mousePressed&&mouseX<100){   ///當滑鼠小於灰色的地方時
    if(mouseY<100) stroke(#FF0000); ///點什麼顏色就變甚麼顏色
    else if(mouseY<200) stroke(#FFFF00);///~~~~~~~
    else if(mouseY<300) stroke(#00FF00);///~~~~~~~
    else if(mouseY<400) stroke(#0000FF);///~~~~~~~
    else if(mouseY<500) stroke(#00FFFF);///同上
  }
    else if(mousePressed&&mouseX>100)///當滑鼠大於有顏色的地方時就可以開始畫圖
    {
        line(mouseX,mouseY, pmouseX,pmouseY);
      }
}



於 沒有留言:
標籤： ,

丹ㄉ中文化和變色 很酷ㄛ

 今天一開始複習了上禮拜的進度



可是我們想打中文怎麼辦
都會變成方塊
這時候我們就去檔案-->偏好設定
去調
這樣就有中文了
但我們上面的簡體字覺得太難看了
今晚我想來點中文化
所以小葉老師就特地幫我們改成繁體中文了
謝謝老師
再來就是今天的重頭戲了
我們想要按一下就變色
這時候我們想要畫畫
所以我們就用那個mousepress的功能
開畫!
可是只有黑白太單調
我們想要有點色彩
我們弄出一個調色盤
然後按到那個顏色就可以畫出顏色
很棒吧
只要打了strokeweight就可以調整line的粗細喔




於 1 則留言:
標籤： ,

WEEK02

 

自己寫出一個小畫家

void setup(){

  size(500,500);

}

void draw(){

fill(#C11D1D); rect(0, 0, 50, 100);

fill(#FAB323); rect(0, 100, 50, 100);

fill(#008B08); rect(0, 200, 50, 100);

fill(#26A0C4); rect(0, 300, 50, 100);

fill(#780BBC); rect(0, 400, 50, 100);

if (mousePressed && mouseX<50){

if(mouseY<100)stroke(#C11D1D);

else if(mouseY<200)stroke(#FAB323);

else if(mouseY<300)stroke(#008B08);

else if(mouseY<400)stroke(#26A0C4);

else if(mouseY<500)stroke(#780BBC);

}

else if(mousePressed && mouseX>50){

line(mouseX, mouseY, pmouseX, pmouseY);}}

改變粗細以及加入存檔功能

void setup(){
  size(600,500);
}
void keyPressed(){
  save("07161090.png");
}
void draw(){
fill(#C11D1D); rect(0, 0, 50, 100);
fill(#FAB323); rect(0, 100, 50, 100);
fill(#008B08); rect(0, 200, 50, 100);
fill(#26A0C4); rect(0, 300, 50, 100);
fill(#780BBC); rect(0, 400, 50, 100);
strokeWeight(5);
if (mousePressed && mouseX<50){
if(mouseY<100)stroke(#C11D1D);
else if(mouseY<200)stroke(#FAB323);
else if(mouseY<300)stroke(#008B08);
else if(mouseY<400)stroke(#26A0C4);
else if(mouseY<500)stroke(#780BBC);
}
else if(mousePressed && mouseX>50){
line(mouseX, mouseY, pmouseX, pmouseY);}}


於 沒有留言:
標籤： ,

Week02

 

基礎

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

background(#00B9FF);///背景顏色

stroke(0,0,255);///線條顏色

fill(255,255,0);///填滿

rect(100,100,300,300);///方形

        左上角    X    Y

ellipse(x圓心座標,y圓心座標,x大小,y大小);



void setup(){

 size(500,500);  

}

void draw(){

if(mousePressed)background(255,0,255);

else background(0,0,255);

}

void setup(){

 size(500,500);  

}

void draw(){

if(mousePressed)

line(mouseX,mouseY,pmouseX,pmouseY);

}

小試身手


void setup(){
 size(500,500);  
}
void draw(){
if(mousePressed){
  float r= random(255);
  float g= random(255);
  float b= random(255);
  stroke(r,g,b);
  line(mouseX,mouseY,pmouseX,pmouseY);
  
  }


小畫家









void setup(){

 size(500,500);  }

void draw(){

  fill(#ff0000); rect(0,0,100,100);

  fill(#ffff00); rect(0,100,100,100);

  fill(#00ff00); rect(0,200,100,100);

  fill(#0000ff); rect(0,300,100,100);

  fill(#ff00ff); rect(0,400,100,100);

  if(mousePressed && mouseX<100)

  {

    if(mouseY<100)stroke(#ff0000);

    else if(mouseY<200)stroke(#ffff00);

    else if(mouseY<300)stroke(#00ff00);

    else if(mouseY<400)stroke(#0000ff);

    else if(mouseY<500)stroke(#ff00ff);

  }

  else if(mousePressed && mouseX>100)

  {

    strokeWeight(3);///線的粗細

    line(mouseX,mouseY,pmouseX,pmouseY);

  }

  

}


新增功能-----存檔

void setup(){

 size(500,500);  

  fill(#ff0000); rect(0,0,100,100);

  fill(#ffff00); rect(0,100,100,100);

  fill(#00ff00); rect(0,200,100,100);

  fill(#0000ff); rect(0,300,100,100);

  fill(#ff00ff); rect(0,400,100,100);

}

void keyPressed()

{

  save("week02.png");

}

void draw(){

  

  if(mousePressed && mouseX<100)

  {

    if(mouseY<100)stroke(#ff0000);

    else if(mouseY<200)stroke(#ffff00);

    else if(mouseY<300)stroke(#00ff00);

    else if(mouseY<400)stroke(#0000ff);

    else if(mouseY<500)stroke(#ff00ff);

  }

  else if(mousePressed && mouseX>100)

  {  

    float r=random(5);

    strokeWeight(r);

    line(mouseX,mouseY,pmouseX,pmouseY);

  }

  

}



於 沒有留言:
標籤： ,
訂閱： 文章 (Atom)