1.第一節課的程式碼
先下載一張圖片然後將圖片拉進到prcessing的框裡面
PImage img = loadImage("aufa.jpg");
size(600,400);
image(img,0,0);
將week03_1另存新檔案week03_2_void_setup_void_draw_fill_rect 才能讓圖片在資料夾裡面
//week03_2_void_setup_void_draw_fill_rect
PImage img;
void setup(){
size(600,400);
img = loadImage("aufa.jpg");
}
void draw(){
image(img,0,0);
noStroke();
fill(200,200,255,128);
rect(mouseX,mouseY,70,60);
}
藉由利用滑鼠來操控一個半透明的長方體來移動，在顏色後面加上128來讓它變半透明
//week03_3_arufa_rect_rect_rect
PImage img;
void setup(){
size(600,400);
img = loadImage("aufa.jpg");
}
void draw(){
image(img,0,0);
noStroke();//不要有邊線
noCursor();//不要有滑鼠游標
fill(200,200,255,128);
rect(mouseX,mouseY-80,70,60);//1
rect(mouseX-30,mouseY-40,70,60);//2
rect(mouseX+30,mouseY-40,70,60);
rect(mouseX,mouseY,70,60);//3
rect(mouseX-60,mouseY,70,60);
rect(mouseX+60,mouseY,70,60);
rect(mouseX-30,mouseY+40,70,60);//4
rect(mouseX-90,mouseY+40,70,60);
rect(mouseX+30,mouseY+40,70,60);
rect(mouseX+90,mouseY+40,70,60);
rect(mouseX,mouseY+80,70,60);//3
rect(mouseX-60,mouseY+80,70,60);
rect(mouseX+60,mouseY+80,70,60);
rect(mouseX-30,mouseY+120,70,60);//2
rect(mouseX+30,mouseY+120,70,60);
rect(mouseX,mouseY+160,70,60);//1
}
將半透明的方塊按照圖片的順序擺放
2.第二節課上課程式碼
//week03_4_arufa_for_for_rect
PImage img;
void setup(){
size(600,400);
img = loadImage("aufa.jpg");
}
void draw(){
image(img,0,0);
noStroke();//不要有邊線
noCursor();//不要有滑鼠游標
fill(200,200,255,128);
for(int i=1;i<=4;i++){
for(int j=0;j<i;j++){
float y = i*40,x=-i/2*60+j*60 + ((i%2==0)?30:0);
rect(mouseX+x,mouseY-80+y,70,60);
}
}
for(int i=3;i>=1;i--){
for(int j=0;j<i;j++){
float y = (4-i)*40+160,x=-i/2*60+j*60 + ((i%2==0)?30:0);
rect(mouseX+x,mouseY-80+y,70,60);
}
}
}
利用for迴圈來簡化程式碼
第一種方法
//week03_5_go_for_line_line
size(450,450);
background(220,179,92);
strokeWeight(2);
for(int i=0;i<9;i++){
line(25,25+i*50,425,25+i*50);
line(25+i*50,25,25+i*50,425);
}
利用畫線來製作棋盤
第二種方法
//week03_5_go_for_for_rect
size(450,450);
background(220,179,92);
strokeWeight(2);
noFill();
for(int i=0;i<8;i++){
for(int j=0;j<8;j++){
rect(25+j*50,25+i*50,50,50);
}
}
用兩個for迴圈來製造多個方形來形成棋盤
//week03_6_go_void_setup_void_draw_ellipse_mouseX_mouseY
void setup() {
size(450, 450);
}
void draw() {
background(220, 179, 92);
strokeWeight(2);
for (int i=0; i<9; i++) {
line(25, 25+i*50, 425, 25+i*50);
line(25+i*50, 25, 25+i*50, 425);
}
ellipse(mouseX,mouseY,45,45);
}
製造出棋子
//week03_7_go_2d_array_void_mousePressed_board_i_j
int [][]board = new int[9][9];//java 2D 陣列
void setup() {
size(450, 450);
}
void draw() {
background(220, 179, 92);
strokeWeight(2);
for (int i=0; i<9; i++) {
line(25, 25+i*50, 425, 25+i*50);
line(25+i*50, 25, 25+i*50, 425);
}
for(int i=0;i<9;i++){
for(int j=0;j<9;j++){
if(board[i][j]==1) ellipse(25+j*50,25+i*50,45,45);
}
}
ellipse(mouseX,mouseY,45,45);
}
void mousePressed(){
int i = mouseY/50,j=mouseX/50;
board[i][j] = 1;
}
利用陣列讓棋子可以落在點上
//week03_8_go_goColor_black_white
int goColor = -1;//-1:黑 +1:白 0:沒有棋子
int [][]board = new int[9][9];//java 2D 陣列
void setup() {
size(450, 450);
}
void draw() {
background(220, 179, 92);
strokeWeight(2);
for (int i=0; i<9; i++) {
line(25, 25+i*50, 425, 25+i*50);
line(25+i*50, 25, 25+i*50, 425);
}
for (int i=0; i<9; i++) {
for (int j=0; j<9; j++) {
if (board[i][j]==0) continue;
if (board[i][j]==1) fill(255);
if (board[i][j]==-1) fill(0);
ellipse(25+j*50, 25+i*50, 45, 45);
}
}
if (goColor==-1) fill(0);
else fill(255);
ellipse(mouseX, mouseY, 45, 45);
}
void mousePressed() {
int i = mouseY/50, j=mouseX/50;
board[i][j] = goColor;
goColor = goColor * -1;
}
//week03_9_arufa_array_for
int []boardX={0,-30,+30,+60,0,-60,-90,-30,+30,+90,+60,0,-60,-30,+30,0};
int []boardY={-80,-40,-40,0,0,0,+40,+40,+40,+40,80,80,80,120,120,160};
PImage img;
void setup() {
size(600, 400);
img = loadImage("aufa.jpg");
}
void draw() {
image(img, 0, 0);
noStroke();//不要有邊線
noCursor();//不要有滑鼠游標
fill(200, 200, 255, 128);
for (int i=0; i<16; i++) {
rect(mouseX+boardX[i], mouseY+boardY[i], 70, 50);
}
}
利用陣列來簡化week03_4的程式碼
沒有留言:
張貼留言