Processing 基本繪圖 part4

老實講...我自己也搞不太懂這些順序編排的方式
感覺上有點類似想到什麼就寫啥
畫面的色彩變化遠大於畫面美感
未必是會變越多顏色就越厲害
這是資工？設計？還是藝術？

class1
畫出三個圖形
當滑鼠移動時將改變顏色
可參考官方color函式、mouseMoved函式



//class 1
//定義一個值
int nowColor = 100;

void setup(){
//設定畫面大小
size(400, 300);
//不要有邊框
noStroke();
}

void draw(){
//填入顏色(R, G, B)
fill(nowColor, nowColor/2, 0);
//畫出方形
rect(0, 0, 100, height);

//填入顏色(R, G, B)
fill(nowColor/4, 0, nowColor);
//畫圓
ellipse(200, 100, 50, 50);

//填入顏色(R, G, B)
fill(0, nowColor/3, 0);
//畫出三角形
triangle(230, 175, 380, 290, 286, 275);
}

//當滑鼠移動時執行其內容
void mouseMoved(){
//開始時定義的職增加
nowColor += 5;
//當值大於255(上限值)改變為於100
if(nowColor > 255){
nowColor = 100;
}
}



class2
改變視窗大小



//class 2
//定義增加的大小
int myX = 0;
int myY = 0;

void setup(){
//設定視窗大小
size(300, 300);
//取消邊框
noStroke();
}

void draw(){
//當滑鼠移動到靠近視窗的10%範圍時邊框擴大
if(mouseX > width*0.9){
myX += 10;
setMyStage(width + myX, height);
}
//當滑鼠移動到靠近視窗的10%範圍時邊框擴大
if(mouseY > height*0.9){
myY += 10;
setMyStage(width, height + myY);
}

//當視窗大於設定大小 改變為原來大小
if(width > 600){
setMyStage(300, height);
myX = 0;
}
//當視窗大於設定大小 改變為原來大小
if(height > 600){
setMyStage(width, 300);
myY = 0;
}
}

//自行定義一個函式
void setMyStage(int X,int Y){
//設定視窗大小
frame.setSize(X, Y);
size(X, Y);
}



class3
測試滑鼠左右鍵
可參考官方函式mouseButton、mousePressed、mouseReleased



//class 3
void setup(){
//設定視窗大小
size(250, 250);
//背景色為白色
background(255);
}

void draw(){
//當按下滑鼠左鍵
if(mousePressed == true && mouseButton == LEFT){
//背景色改為深灰色
background(50);
//列印出"LEFT"
println("LEFT");
}
//當按下滑鼠右鍵
if(mousePressed == true && mouseButton == RIGHT){
//背景色改為淺灰
background(150);
//列印出"RIGHT"
println("RIGHT");
}
}

//當滑鼠放開
void mouseReleased(){
//背景色改為白色
background(255);
}




class4



PImage a,b,c;
//class 4
void setup(){
size(600, 400);
a = loadImage("a.jpg");
b = loadImage("b.png");
c = loadImage("c.png");
background(255);
}

void draw(){
if( key == 'a' || key == 'A'){
image(a, 0, 0);
}

if( key == 'b' || key == 'B'){
image(b, 0, 0);
}

if( key == 'c' || key == 'C'){
image(c, 0, 0);
}

}

void keyReleased() {
background(255);
}



資料來源
processing官方網站

更多Processing教學