2017互動技術: Week05

顯示具有 Week05 標籤的文章。顯示所有文章

2017年10月23日星期一

WEEK5 課堂der筆記筆記

課堂作業1~~~爆爆王

1.

程式碼：

void setup(){

size(850,500);

}

int userJ=0,userI=5;

float userX,userY;

int waterN=0;

int []waterJ=new int[100];

int []waterI=new int[100];

int []waterS=new int[100];

int []waterT=new int[100];

void draw(){

background(#92AD28);

noStroke();

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

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

if((j-i)%2==0)fill(#7E9819);

else fill(#92AD28);

rect(j50,i50,50,50);

}

}

fill(255,0,0); ellipse(userJ50+25,userI50+25,50,50);

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

if(waterT[i]>0){

fill(#93E1F7); ellipse(waterJ[i]50+25,waterI[i]50+25,30,30);

waterT[i]--;

if(waterT[i]==0) waterT[i]=-60;

}

if(waterT[i]<0){

for(int k=-waterS[i]; k<=waterS[i]; k++){

fill(255); rect((waterJ[i]+k)50,(waterI[i])50,50,50);

fill(255); rect((waterJ[i])50,(waterI[i]+k)50,50,50);

}

waterT[i]++;

}

}

}

void keyPressed(){

if(keyCode==LEFT) userJ--;

if(keyCode==RIGHT) userJ++;

if(keyCode==UP) userI--;

if(keyCode==DOWN) userI++;

if(key==' '){

waterI[waterN]=userI;

waterJ[waterN]=userJ;

waterS[waterN]=5;

waterT[waterN]=120;

waterN++;

}

}

課堂作業2~~~鱷魚

1.

程式碼：

void setup(){

size(500,500);

}

void draw(){

background(255);

fill(0,155,0); ellipse(250,250,300,300);

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

fill(255); rect(110+i30,200,30,30);

if(110+i30<mouseX && mouseX<110+i30+30 && 200<mouseY && mouseY<200+30){

fill(0); rect(100+i30,200,30,30);

}

}

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

fill(255); rect(110+i30,300,30,30);

if(110+i30<mouseX && mouseX<110+i30+30 && 300<mouseY && mouseY<300+30){

fill(0); rect(100+i30,300,30,30);

}

}

}

一: 會動的眼睛

眼珠會隨著箭頭移動
程式碼
void setup(){
size(800,800);
}
void draw(){
background(128);
strokeWeight(20);
ellipse(100,200,180,360);
ellipse(300,200,180,360);

float angle1 = atan2((mouseY-200)/2,mouseX-300);
float newX1 = 300+100*cos(angle1)/2;
float newY1 = 200+200*sin(angle1)/2;
ellipse(newX1,newY1,10,10);
float angle2 = atan2((mouseY-200)/2,mouseX-100);
float newX2 = 100+100*cos(angle2)/2;
float newY2 = 200+200*sin(angle2)/2;
ellipse(newX2,newY2,10,10);
}

二: 砲塔射擊遊戲
滑鼠發射砲彈，限制10個

程式碼
void setup(){
size(400,800);
}
float [] ballx=new float[10];
float [] bally=new float[10];
float [] ballvx=new float[10];
float [] ballvy=new float[10];
float [] angle=new float[10];
int now=0;
void draw(){
background(0,128,0);
fill(#F20C0C);ellipse(200,600,100,100);
for(int i=0;i<10;i++){
fill(#F2740C); ellipse(ballx[i],bally[i],30,30);
ballx[i]+=ballvx[i]; bally[i]+=ballvy[i];
}
angle[now]= atan2(mouseY-600,mouseX-200);

}
void mouseMoved(){
ballx[now]=200+50*cos(angle[now]);
bally[now]=600+50*sin(angle[now]);
}
void mousePressed(){
ballvx[now]=cos(angle[now]);
ballvy[now]=sin(angle[now]);
now++;
}

2017年10月16日星期一

week05 3D的互動筆記

一、製作xeyes (會移動的眼睛)

1.先畫出眼眶，以及眼球與滑鼠間的線條焦點。

void setup(){
size(400,400);
}
void draw(){
background(128);
strokeWeight(20);
ellipse(100,200,180,360);
ellipse(300,200,180,360);

ellipse(100,200,10,10);
ellipse(300,200,10,10);
line(mouseX,mouseY,100,200);
line(mouseX,mouseY,300,200);

float angle1 = atan2( (mouseY-200)/2 , mouseX-300 );
float newX1 = 300 + 100*cos(angle1)/2;
float newY1 = 200 + 200*sin(angle1)/2;
ellipse(newX1,newY1,10,10);
float angle2 = atan2( (mouseY-200)/2 , mouseX-100 );
float newX2 = 100 + 100*cos(angle2)/2;
float newY2 = 200 + 200*sin(angle2)/2;
ellipse(newX2,newY2,10,10);
}

3.最後把原始眼球以及線條移除掉(完成)

void setup(){
size(400,400);
}
void draw(){
background(128);
strokeWeight(20);
ellipse(100,200,180,360);
ellipse(300,200,180,360);

//ellipse(100,200,10,10);
//ellipse(300,200,10,10);
//line(mouseX,mouseY,100,200);
//line(mouseX,mouseY,300,200);

float angle1 = atan2( (mouseY-200)/2 , mouseX-300 );
float newX1 = 300 + 100*cos(angle1)/2;
float newY1 = 200 + 200*sin(angle1)/2;
ellipse(newX1,newY1,10,10);
float angle2 = atan2( (mouseY-200)/2 , mouseX-100 );
float newX2 = 100 + 100*cos(angle2)/2;
float newY2 = 200 + 200*sin(angle2)/2;
ellipse(newX2,newY2,10,10);
}

二、製作氣球射擊(bubble shooter)

1.製作發射台，運用三角函數讓球在發射台旋轉

void setup(){
size(400,800);
}
void draw(){
background(0,128,0);
fill(#FA9703);ellipse(200,600,100,100);
line(mouseX,mouseY,200,600);
float angle = atan2(mouseY-600,mouseX-200);
fill(#F9FA03);ellipse(200+50*cos(angle),600+50*sin(angle),30,30);
}

2.點擊左鍵可以發射球球

void setup(){
size(400,800);
}
float ballX=200,ballY=600;
float ballVX=0,ballVY=0;
float angle=0;
void draw(){
background(0,128,0);
fill(#FA9703);ellipse(200,600,100,100);
line(mouseX,mouseY,200,600);
fill(#F9FA03);ellipse(ballX,ballY,30,30);
angle = atan2(mouseY-600,mouseX-200);

ballX+=ballVX;
ballY+=ballVY;
}
void mouseMoved(){
ballX=200+50*cos(angle);
ballY=600+50*sin(angle);
}
void mousePressed(){
ballVX=cos(angle);
ballVY=sin(angle);
}

3.產生多顆分別設條件的球，移動滑鼠不會被影響

void setup(){
size(400,800);
}
float [] ballX = new float[10];
float [] ballY = new float[10];
float [] ballVX = new float[10];
float [] ballVY = new float[10];
float [] angle = new float[10];
int now = 0; //now which ball is it
void draw(){
background(0,128,0);
fill(#FA9703);ellipse(200,600,100,100);
line(mouseX,mouseY,200,600);
for(int i=0;i<10;i++){
fill(#F9FA03);ellipse(ballX[i],ballY[i],30,30);
ballX[i]+=ballVX[i];
ballY[i]+=ballVY[i];
}
angle[now] = atan2(mouseY-600,mouseX-200);
}
void mouseMoved(){
ballX[now]=200+50*cos(angle[now]);
ballY[now]=600+50*sin(angle[now]);
}
void mousePressed(){
ballVX[now]=cos(angle[now]);
ballVY[now]=sin(angle[now]);
now++;
if(now>=10) now=0; ///為了不超過陣列
}

4.產生會飛向發射台的敵人，並出現Game Over

第五週

WEEK5 課堂der筆記筆記

課堂作業1~~~

1.

程式碼：

void setup(){

size(400,400);

}

void draw(){

background(128);

strokeWeight(20);

ellipse(100,200,180,360);

ellipse(300,200,180,360);

ellipse(100,200,10,10);

ellipse(300,200,10,10);

line(mouseX,mouseY,100,200);

line(mouseX,mouseY,300,200);

}

2.

程式碼：

void setup(){

size(800,800);

}

void draw(){

background(128);

strokeWeight(20);

ellipse(100,200,180,360);

ellipse(300,200,180,360);



/ellipse(100,200,10,10);

ellipse(300,200,10,10);

line(mouseX,mouseY,100,200);

line(mouseX,mouseY,300,200);/



float angle1=atan2((mouseY-200)/2,mouseX-300);

float newX1=300+100cos(angle1)/2;

float newY1=200+200sin(angle1)/2;

ellipse(newX1,newY1,10,10);



float angle2=atan2((mouseY-200)/2,mouseX-100);

float newX2=100+100cos(angle2)/2;

float newY2=200+200sin(angle2)/2;

ellipse(newX2,newY2,10,10);

}

課堂作業2~~~

1.

程式碼：

void setup(){

size(400,800);

}

float ballX=200,ballY=600;

float ballVX=0,ballVY=0;

float angle=0;

void draw(){

background(0,128,0);

fill(#F9FA62); ellipse(200,600,100,100);

line(mouseX,mouseY,200,600);

fill(#62FAD3); ellipse(ballX,ballY,30,30);

angle=atan2(mouseY-600,mouseX-200);

ballX+=ballVX;

ballY+=ballVY;

}

void mouseMoved(){

ballX=200+50cos(angle);

ballY=600+50sin(angle);

}

void mousePressed(){

ballVX=cos(angle);

ballVY=sin(angle);

}

2.

程式碼：

void setup(){

size(400,800);

}

float [] ballX=new float[10];

float [] ballY=new float[10];

float [] ballVX=new float[10];

float [] ballVY=new float[10];

float [] angle=new float[10];

int now=0;

void draw(){

background(0,128,0);

fill(#F9FA62); ellipse(200,600,100,100);

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

fill(#62FAD3); ellipse(ballX[i],ballY[i],30,30);

ballX[i]+=ballVX[i];

ballY[i]+=ballVY[i];

}

angle[now]=atan2(mouseY-600,mouseX-200);

}

void mouseMoved(){

ballX[now]=200+50cos(angle[now]);

ballY[now]=600+50sin(angle[now]);

}

void mousePressed(){

ballVX[now]=cos(angle[now]);

ballVY[now]=sin(angle[now]);

now++;

}

3.

程式碼：

void setup(){

size(400,800);

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

badDead[i]=false;

badX[i]=random(0-300,400+300);

badY[i]=random(-2000,0);

badVX[i]=-(badX[i]-200)/300;

badVY[i]=-(badX[i]-600)/300;

}

}

float[]ballX=new float[10];

float[]ballY=new float[10];

float[]ballVX=new float[10];

float[]ballVY=new float[10];

float[]angle=new float[10];

float[]badX=new float[20];

float[]badY=new float[20];

float[]badVX=new float[20];

float[]badVY=new float[20];

int now=0;

void draw(){

background(0,128,0);

fill(#F9FA62); ellipse(200,600,100,100);

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

fill(#62FAD3); ellipse(ballX[i],ballY[i],30,30);

ballX[i]+=ballVX[i];

ballY[i]+=ballVY[i];

}

angle[now]=atan2(mouseY-600,mouseX-200);

}

void mouseMoved(){

ballX[now]=200+50cos(angle[now]);

ballY[now]=600+50sin(angle[now]);

}

void mousePressed(){

ballVX[now]=cos(angle[now]);

ballVY[now]=sin(angle[now]);

now++;

}

Week 05 邱

#第05週
-------------------------------------------------------------------------------------------------------------------------
◎眼珠跟滑鼠轉

程式碼：

void setup(){
size(400,400);
}
void draw(){
background(128);
strokeWeight(20);
ellipse(100,200,180,360);
ellipse(300,200,180,360);

float angle1=atan2((mouseY-200)/2,mouseX-300);
float newX1=300+100*cos(angle1)/2;
float newY1=200+200*sin(angle1)/2;
ellipse(newX1,newY1,10,10);

float angle2=atan2((mouseY-200)/2,mouseX-100);
float newX2=100+100*cos(angle2)/2;
float newY2=200+200*sin(angle2)/2;
ellipse(newX2,newY2,10,10);

}

◎球跟著線發射

程式碼：

void setup(){
size(400,800);
}
float ballX=200,ballY=600;
float ballVX=0,ballVY=0;
float angle=0;
void draw(){
background(157,223,249);
fill(#F0F8FF); ellipse(200,600,100,100);
line(mouseX,mouseY,200,600);
fill(#FFFDD0); ellipse(ballX,ballY,30,30);
angle = atan2(mouseY-600,mouseX-200);

ballX += ballVX;
ballY += ballVY;
}
void mouseMoved(){
ballX = 200+50*cos(angle);
ballY = 600+50*sin(angle);
}
void mousePressed(){
ballVX = cos(angle);
ballVY = sin(angle);

}

◎連續發射10顆球(超過10顆會當掉)

程式碼：

void setup(){
size(400,800);
}
float [] ballX = new float[10];
float [] ballY = new float[10];
float [] ballVX = new float[10];
float [] ballVY = new float[10];
float [] angle = new float[10];
int now=0;//now which ball is it

void draw(){
background(157,223,249);
fill(#F0F8FF); ellipse(200,600,100,100);
for(int i=0;i<10;i++){
fill(#FFFDD0); ellipse(ballX[i],ballY[i],30,30);
ballX[i]+=ballVX[i];
ballY[i]+=ballVY[i];
}

angle[now] = atan2(mouseY-600,mouseX-200);

}
void mouseMoved(){
ballX[now] = 200+50*cos(angle[now]);
ballY[now] = 600+50*sin(angle[now]);
}
void mousePressed(){
ballVX[now] = cos(angle[now]);
ballVY[now] = sin(angle[now]);
now++;

}

◎連續發射10顆球(保持在10顆不會當掉)

程式碼：

void setup(){
size(400,800);
}
float [] ballX = new float[10];
float [] ballY = new float[10];
float [] ballVX = new float[10];
float [] ballVY = new float[10];
float [] angle = new float[10];
int now=0;//now which ball is it

void draw(){
background(157,223,249);
fill(#F0F8FF); ellipse(200,600,100,100);
for(int i=0;i<10;i++){
fill(#FFFDD0); ellipse(ballX[i],ballY[i],30,30);
ballX[i]+=ballVX[i];
ballY[i]+=ballVY[i];
}

angle[now] = atan2(mouseY-600,mouseX-200);

}
void mouseMoved(){
ballX[now] = 200+50*cos(angle[now]);
ballY[now] = 600+50*sin(angle[now]);
}
void mousePressed(){
ballVX[now] = cos(angle[now]);
ballVY[now] = sin(angle[now]);
now++;
if(now>=10)now=0;//protect the array not bigger than 10
}

Ｗｅｅｋ０５　Ｎｏｔｅｅｅｅｅ！

-------------------------------------------------------------------------------------------------------------------------

Ｗｅｅｋ０５

-------------------------------------------------------------------------------------------------------------------------

➣大大欸目啾

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

➣點點欸目啾

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

➣伸長你欸繩索

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

➣伸長你欸繩索，球球對勒造，可是球球會亂跑就重新again一次

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

➣射出你欸球球，可以射１０粒，太多就壞掉

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

找筆記?

week05

void setup(){

size(400,800);

}

float ballX=200,ballY=600;

float ballVX=0,ballVY=0;

float angle=0;

void draw(){

background(0,128,0);

fill(#FA9703);ellipse(200,600,100,100);

line(mouseX,mouseY,200,600);

fill(#F9FA03);ellipse(ballX,ballY,30,30);

angle=atan2(mouseY-600,mouseX-200);

ballX+=ballVX;

ballY+=ballVY;

}

void mouseMoved(){

ballX=200+50*cos(angle);

ballY=600+50*sin(angle);

}

void mouseMovePressed(){

ballVX=cos(angle);

ballVY=sin(angle);

}

Week05_謝紹勳的上課筆記

第一部分：

做出Xeyes

第二部分：

作泡泡發射器：

用腺先判別求要飛出去的部分

訂閱：文章 (Atom)

2017互動技術

2017年10月23日星期一

第六週

WEEK5 課堂der筆記筆記

課堂作業2~~~鱷魚

1.

程式碼：

week05 03160801

2017年10月16日星期一

week05 3D的互動筆記

第五週

WEEK5 課堂der筆記筆記

課堂作業1~~~

1.

程式碼：

void setup(){

size(400,400);

}

void draw(){

background(128);

strokeWeight(20);

ellipse(100,200,180,360);

ellipse(300,200,180,360);

ellipse(100,200,10,10);

ellipse(300,200,10,10);

line(mouseX,mouseY,100,200);

line(mouseX,mouseY,300,200);

}

2.

程式碼：

3.

程式碼：

Week 05 邱

Ｗｅｅｋ０５　Ｎｏｔｅｅｅｅｅ！

Ｗｅｅｋ０５

找筆記?

Week05_謝紹勳的上課筆記

2017年10月23日 星期一

WEEK5 課堂der筆記筆記

課堂作業2~~~鱷魚 1. 程式碼：

2017年10月16日 星期一

WEEK5 課堂der筆記筆記

課堂作業1~~~ 1. 程式碼： void setup(){ size(400,400); } void draw(){ background(128); strokeWeight(20); ellipse(100,200,180,360); ellipse(300,200,180,360); ellipse(100,200,10,10); ellipse(300,200,10,10); line(mouseX,mouseY,100,200); line(mouseX,mouseY,300,200); }

2. 程式碼：

3. 程式碼：

Ｗｅｅｋ ０５

2017年10月23日星期一

課堂作業2~~~鱷魚

1.

程式碼：

2017年10月16日星期一

課堂作業1~~~

1.

程式碼：

void setup(){

size(400,400);

}

void draw(){

background(128);

strokeWeight(20);

ellipse(100,200,180,360);

ellipse(300,200,180,360);

ellipse(100,200,10,10);

ellipse(300,200,10,10);

line(mouseX,mouseY,100,200);

line(mouseX,mouseY,300,200);

}

2.

程式碼：

3.

程式碼：

Ｗｅｅｋ０５