Week01 欣儀的課堂筆記

Part1 基礎畫圖-線和方形

官方網頁下載Proccessing

 Code: 

size(300,300);//視窗的大小
line(10,10,90,90);//畫線,起始位置x,y和終點位置x,y
rect(90,90,600,600);//畫長方形

---

Part2 設定背景和圖形顏色

可以使用上方列表的工具->顏色選擇器，選擇喜歡的顏色

顏色可使用16進制的色碼或RGB撰寫

 Code: 

size(300,300);
background(#BF5AAC);//背景顏色

 Code: 

size(300,300);
background(#BF5AAC);//背景顏色
fill(255,255,0);//填充顏色
rect(30,30,100,100);

---

Part3 畫企鵝

 Code: 

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

fill(255);//填充顏色
rect(100,100,300,300);//方形

stroke(127);//線的顏色
circle(185,250,30);//圓形
circle(315,250,30);

noStroke();//取消外框
fill(#FF8902);
ellipse(250,325,150,70);//畫橢圓

stroke(255);//線的顏色
line(175,325,325,325);//畫線

---

Part4 練習

運用今日上課教的程式，繪製出的圖

 Code: 

size(700,700);
background(#8EE9F2);
line(700,0,0,700);
line(0,0,700,700);
fill(#8CF797);
stroke(255);
rect(145,145,410,410);
noStroke();
fill(#FF2E2E);
ellipse(350,350,350,350);
fill(#FFA52E);
ellipse(350,350,300,300);
fill(#FFF92E);
ellipse(350,350,250,250);
fill(#2EFF48);
ellipse(350,350,200,200);
fill(#2EE8FF);
ellipse(350,350,150,150);
fill(#5012FF);
ellipse(350,350,100,100);
fill(#B00BE3);
ellipse(350,350,50,50);

運用迴圈的程式畫出許多圓形

 Code: 

size(500,500);
background(0,0,0);
stroke(255,255,255);
fill(0);

int x, y;
for(x=400,y=400;x>0&&y>0;x-=10,y-=10){
  ellipse(250,250,x,y);
}