2021年10月28日星期四

Week04

1 使用線條，按照等差遞增排列

2改用for迴圈產生線條

3加入橫向線條

4用陣列表示填色位置

5加入試驗固定的棋子

6原先棋子位置會偏移，修正棋子位置，讓它剛好在兩線正中間

7現在加入可隨滑鼠位置放置的棋子

8加入黑棋，刪除原試驗用固定位置的棋子，並由滑鼠左中右鍵分別控制白棋/吃子/黑棋

--------

9新單元

由浮點數及cos sin計算畫圓

10現在圓圈大小隨滑鼠xy軸改變

11更改背景色，加入noFill()能變成較為完美的圖形

12加入之前課程所學，筆觸顏色隨機生成，並可隨滑鼠xy軸畫出任意圖型，

背景色也能由滑鼠xy位置改變

2021年10月25日星期一

week04課程

1.畫出棋盤

void setup()

{

size(500,500);

}

void draw()

{

background(253,236,180);

for(int i=0;i<9;i++){

line(50,50+50*i, 450,50+50*i);//畫直線

line(50+50*i,50, 50+50*i,450);//畫橫線

}

2.設定方格矩陣和旗子

▲矩陣

int[][]go = {

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,0,0,0,0,0}};

▲棋子

for(int i=0;i<9;i++){

for(int j=0; j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(255);ellipse(x,y,40,40);//畫圓

}else if(go[i][j]==2){

int x=50+50*j,y=50+50*i;

fill(0);ellipse(x,y,40,40);

}

3.建立黑白棋和清除鍵

void mousePressed(){

int j = (mouseX-25)/50;//判斷點擊位置

int i = (mouseY-25)/50;

if(mouseButton==LEFT)go[i][j]=1;//下白棋

if(mouseButton==RIGHT)go[i][j]=2;//下黑棋

if(mouseButton==CENTER)go[i][j]=0;//清除棋子

week04

void setup(){

size(500,500);

}

void draw(){

line(50,50,50,450);

line(100,50,100,450);

line(150,50,150,450);

line(200,50,200,450);

line(250,50,250,450);

line(300,50,300,450);

line(350,50,350,450);

line(400,50,400,450);

line(450,50,450,450);

}

畫棋盤線

但是9行麻煩，用FOR好了

void setup(){

size(500,500);

}

void draw(){

for(int i=1;i<=9;i++){

line(50*i,50,50*i,450);//規律

}

畫出來是一樣的

再來要畫橫線

void setup(){

size(500,500);

}

void draw(){

for(int i=1;i<=9;i++){

line(50*i,50,50*i,450);

line(50,50*i,450,50*i);

}

練習陣列配合迴圈

int [][]c = {

{1,0,0},

{1,0,0}

};

void setup(){

size(300,300);

}

void draw(){

for(int i=0;i<3;i++){

for(int j=0;j<3;j++){

if(c[i][j]==0)fill(128);

else fill(255,0,0);

rect(j*100,i*100,100,100);

}

橫行(x)J,直行(y)I

靠這個做出下棋子的效果

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(255);ellipse(x,y,40,40);

}

接著做出滑鼠下棋動作

void mousePressed(){

int j =(mouseX-50)/50;

int i =(mouseY-50)/50;

go[i][j]=1;

}

但會偏移，要修正成-25

加上黑白分別的棋子，左鍵白右鍵黑中鍵去棋子

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(255);ellipse(x,y,40,40);

}

else if(go[i][j]==2){

int x=50+50*j,y=50+50*i;

fill(0);ellipse(x,y,40,40);

}

void mousePressed(){

int j =(mouseX-25)/50;

int i =(mouseY-25)/50;

if(mouseButton==LEFT) go[i][j]=1;

if(mouseButton==RIGHT) go[i][j]=2;

if(mouseButton==CENTER) go[i][j]=0;

}

void setup(){

size (500,500);

}

float w=30,r=0,g=255,b=0;

void draw(){

stroke(r,g,b);noFill();

r+=random(3); if(r>255)r=0;

g+=random(3); if(g>255)g=0;

b+=random(3); if(b>255)b=0;

ellipse(mouseX,mouseY,w,w);

w+=0.5;

if(w>100)w=30;

}

隨機畫圓

bobycm/2021-mcu (github.com)

把今天寫的專案上傳GITHUB

嗨壓阿 Week04

Week03

1.畫棋盤爆破版

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

line(50,50,50,450);

line(100,50,100,450);

line(150,50,150,450);

line(200,50,200,450);

line(250,50,250,450);

line(300,50,300,450);

line(350,50,350,450);

line(400,50,400,450);

line(450,50,450,450);

}

2.畫棋盤陣列版

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

}

3.畫棋盤完整版

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

line(50,50+50*i,450,50+50*i);

}

4.加陣列

void setup(){

size(500,500);

}

int [][]go={

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,0,0,0,0,0}};

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

line(50,50+50*i,450,50+50*i);

}

5.for 陣列

int [][]c={

{1,0,0},

{1,0,0}};

void setup(){

size(300,300);

}

void draw(){

for(int i=0;i<3;i++){

for(int j=0;j<3;j++){

if(c[i][j]==0) fill(128);

else fill(255,0,0);

rect(j*100,i*100,100,100);

}

6.加棋子

void setup(){

size(500,500);

}

int [][]go={

{1,0,0,0,0,0,0,0,1},

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,1,0,0,0,0},

{0,0,0,0,0,0,0,0,0},

{1,0,0,0,0,0,0,0,1}};

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

line(50,50+50*i,450,50+50*i);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j, y=50+50*i;

fill(255); ellipse(x,y,40,40);

}

7.用滑鼠下棋

void setup(){

size(500,500);

}

int [][]go={

{1,0,0,0,0,0,0,0,1},

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,1,0,0,0,0},

{0,0,0,0,0,0,0,0,0},

{1,0,0,0,0,0,0,0,1}};

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

line(50,50+50*i,450,50+50*i);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j, y=50+50*i;

fill(255); ellipse(x,y,40,40);

}

void mousePressed(){

int i=(mouseY-50)/50;

int j=(mouseX-50)/50;

go[i][j]=1;

}

8.白，黑子&消除

void setup(){

size(500,500);

}

int [][]go={

{1,0,0,0,0,0,0,0,1},

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,1,0,0,0,0},

{0,0,0,0,0,0,0,0,0},

{1,0,0,0,0,0,0,0,1}};

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line(50+50*i,50,50+50*i,450);

line(50,50+50*i,450,50+50*i);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j, y=50+50*i;

fill(255); ellipse(x,y,40,40);

}

else if(go[i][j]==2){

int x=50+50*j, y=50+50*i;

fill(0); ellipse(x,y,40,40);

}

void mousePressed(){

int i=(mouseY-25)/50;

int j=(mouseX-25)/50;

if(mouseButton==LEFT) go[i][j]=1;

if(mouseButton==RIGHT) go[i][j]=2;

if(mouseButton==CENTER) go[i][j]=0;

}

9.畫圓

void setup(){

size(500,500);

}

void draw(){

for(float a=0;a<360;a++){

float x=250+250*cos(radians(a));

float y=250+250*sin(radians(a));

ellipse(x,y,4,4);

}

10.滑鼠畫圈圈

void setup(){

size(500,500);

}

float w=30;

float r=0,g=255,b=0;

void draw(){

stroke(r,g,b); noFill();

r+=random(3);if(r>255)r=0; //顏色到255變回0

g+=random(3);if(g>255)g=0;

b+=random(3);if(b>255)b=0;

ellipse(mouseX,mouseY,w,w);

w+=0.5;

if(w>100) w=30; //放大到100變回30

}

我與天文社與漢堡排_week05

211025 week05

💛🔔

自製黑白棋

先畫出棋盤的直線

👉程式碼

void setup(){

size(500,500);

}

void draw()

{

background(253,236,180);

line( 50,50, 50,450);

line(100,50,100,450);

line(150,50,150,450);

line(200,50,200,450);

line(250,50,250,450);

line(300,50,300,450);

line(350,50,350,450);

line(400,50,400,450);

}

J個是棋盤參考圖

什麼？你說一條一條畫太費時了嗎？

試試使用for迴圈看看吧！

直線PART（紅色及黃色為比較）

👉程式碼（更改部分為豆沙粉色　　　）

void setup(){

size(500,500);

}

void draw()

{

background(253,236,180);

for(int i=0;i<9;i++)

{

line( 50+i*50,50, 50+i*50,450);

}

橫線PART（粉色及紫色為比較）

👉程式碼（更改部分為豆沙粉色　　　）

void setup(){

size(500,500);

}

void draw()

{

background(253,236,180);

for(int i=0;i<9;i++)

{

line( 50+i*50,50, 50+i*50,450);

line( 50, 50+i*50, 450, 50+i*50);

}

進入陣列PART

👉程式碼（更改部分為豆沙粉色　　　）

//int go[9][9];C

//int [][]go=new int[9][9];Java

int [][]go={

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,0,0,0,0,0} };

void setup(){

size(500,500);

}

void draw()

{

background(253,236,180);

for(int i=0;i<9;i++)

{

line( 50+i*50,50, 50+i*50,450);

line( 50, 50+i*50, 450, 50+i*50);

}

為"1"會變色

👉程式碼

int [][]c = {

//i j

{1,0,0},

{1,0,0} };

void setup(){

size(300,300);

}

void draw(){

for(int i=0;i<3;i++){

for(int j=0;j<3;j++){

if(c[i][j]==0) fill(255,170,170);

else fill(152,115,242);

rect(j*100,i*100,100,100);

}

放上棋子(固定)

👉程式碼

(由陣列PART第一格程式碼更改即可)

int [][]go={

{0,0,0,0,0,0,0,0,0},

{0,0,0,1,1,1,0,0,0},

{0,0,0,0,0,0,0,0,0},

{1,1,1,0,0,0,0,0,0} };

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line( 50+i*50,50, 50+i*50,450);

line( 50, 50+i*50, 450, 50+i*50);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(152,115,242);ellipse(x,y,40,40);

}

放上棋子(自訂，但會有些誤差)

👉程式碼（更改部分為豆沙粉色　　　）

int [][]go={

{0,0,0,0,0,0,0,0,0},

{0,0,0,1,1,1,0,0,0},

{0,0,0,0,0,0,0,0,0},

{1,1,1,0,0,0,0,0,0} };

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line( 50+i*50,50, 50+i*50,450);

line( 50, 50+i*50, 450, 50+i*50);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(152,115,242);ellipse(x,y,40,40);

}

void mousePressed(){

int j=(mouseX-50)/50;

int i=(mouseY-50)/50;

go[i][j]=1;

}

放上棋子(自訂，正解)

👉程式碼（只要更改下面部分）（更改部分為豆沙粉色　　　）

void mousePressed(){

int j=(mouseX-25)/50;

int i=(mouseY-25)/50;

go[i][j]=1;

是北斗七星✨

五子棋(變回顏色了)

👉程式碼（更改部分為豆沙粉色　　　）

int [][]go={

{0,0,0,0,0,0,0,0,0},

{0,0,0,0,0,0,0,0,0} };

void setup(){

size(500,500);

}

void draw(){

background(253,236,180);

for(int i=0;i<9;i++){

line( 50+i*50,50, 50+i*50,450);

line( 50, 50+i*50, 450, 50+i*50);

}

for(int i=0;i<9;i++){

for(int j=0;j<9;j++){

if(go[i][j]==1){

int x=50+50*j,y=50+50*i;

fill(255);ellipse(x,y,40,40);

}else if(go[i][j]==2){

int x=50+50*j,y=50+50*i;

fill(0);ellipse(x,y,40,40);

}

void mousePressed(){

int j=(mouseX-25)/50;

int i=(mouseY-25)/50;

if(mouseButton==LEFT) go[i][j]=1;

if(mouseButton==RIGHT) go[i][j]=2;

if(mouseButton==CENTER) go[i][j]=0;

}//1黑 2白0消除

這是一個圈⚇

👉程式碼

void setup(){

size(500,500);

}

void draw(){

for(float a=0;a<360;a++){

float x =250+250*cos(radians(a));

float y =250+250*sin(radians(a));

ellipse(x,y,4,4);

}

小葉老師推薦網站：👉👉網址openprocessing.org

裡面有好玩遊戲🎮😂

蚯蚓是甜甜圈🍩

👉程式碼（更改部分為豆沙粉色　　　）

void setup(){

size(500,500);

}

void draw(){

background(128);

for(float a=0;a<360;a+=1){

float x =250+mouseX*cos(radians(a));

float y =250+mouseY*sin(radians(a));

ellipse(x,y,mouseY,mouseY);

}

真的甜甜圈🍩

👉程式碼（只要增加一行程式碼）

noFill();

各種夢幻色甜甜圈🍩

👉程式碼（只要增加一行程式碼）

stroke(mouseX,mouseY,255);

畫各種大小的圈圈甜

👉程式碼

void setup(){

size(500,500);

}

float w =30;

float r=0,g=255,b=0;

void draw(){

stroke(r,g,b);noFill();

r+=random(3);if(r>255)r=0;

g+=random(3);if(g>255)g=0;

b+=random(3);if(b>255)b=0;

ellipse(mouseX,mouseY,w,w);

w+=0.5;

if(w>100) w=30;

}

如果喜歡我的部落格的話

請幫我按右上角的愛心(根本按不下去)

也可以按右上角的小鈴鐺(這也按不下去)

才不會錯過我的更新哦！😉

訂閱：意見 (Atom)

2021年10月28日 星期四

Week04

2021年10月25日 星期一

week04課程

week04

嗨壓阿 Week04

Week03

我與天文社與漢堡排_week05

2021年10月28日星期四

2021年10月25日星期一