2017互動技術: 04160125

顯示具有 04160125_黃文郁 標籤的文章。顯示所有文章

2018年1月22日星期一

2017年12月11日星期一

Week13 - 旋鈕

２０１７互動技術

https://brainy-bits.com/blogs/tutorials/stepper-motor-rotary-encoder-p1
往右旋轉：數值越來越大 往左旋轉：數值越來越小

2017年12月4日星期一

Week12-搖桿

２０１７互動技術

*Test (確定是否有成功運作)

數值要一致：9600baud -> 115200baud

0：有按下去 1：沒有按

*按下去可以變色

2017年11月20日星期一

Week10

組員：溫淳安 04163031
黃文郁 04160125

網址：https://youtu.be/P6QpNCCXBRo

2017年11月6日星期一

void setup(){
size(700,800);
}
float ballX=250, ballY=450, ballVX=0,ballVY=0;
float ball2X=350, ball2Y=50;
float ball3X=350, ball3Y=748;
void draw(){
if( dist(ballX,ballY,ball2X,ball2Y)<100){
float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;
float nx=ballX-ball2X, ny=ballY-ball2Y;
PVector N=new PVector(nx,ny);
N.normalize();
PVector v0=new PVector(ballVX,ballVY);
float len= -N.dot(v0);
v0.add(N.mult(len*2));
ellipse(cx,cy,10,10);
stroke(0); line(ballX, ballY, ball2X, ball2Y);
stroke(255,128,0); line(cx,cy, cx+5*ballVX, cy+5*ballVY);
stroke(255,128,0); line(cx,cy, cx+5*v0.x, cy+5*v0.y);
stroke(255,0,0); line(cx,cy, cx+N.x, cy+N.y);

ballVX=v0.x; ballVY=v0.y;

if(ball3X<50) {ball3X=50; ballVX =-ballVX;}
if(ball3X>width-50) {ball3X=width-50; ballVX=-ballVX;}
if(ball3Y<50) {ball3Y=50; ballVY =-ballVY;}
if(ball3Y>width-50) {ball3Y=width-50; ballVY=-ballVY;}
}
background(255);
ballX+=ballVX; ballY+=ballVY;
fill(#AEE8F2); ellipse(ballX, ballY, 100,100);
fill(#74B73F); ellipse(ball2X,ball2Y, 100,100);
fill(#74B73F); ellipse(ball3X,ball3Y, 100,100);
}

void mouseDragged(){
ball3X=mouseX; ball3Y=mouseY;
ballVX=ballVY=0;
}
void mouseReleased(){
ballVX = (350-mouseX)/ 10.0;
ballVY = (400-mouseY)/ 10.0;
}

2017年10月30日星期一

Week 7 - 文郁上課誌

２０１７互動技術

2017 / 10 / 30

1. 皮卡丘打排球

*球碰到人時會反彈，碰到地上則遊戲結束畫面停止

*利用鍵盤控制可以移動人物

void setup(){

size(800,600);
}
float ballX=200, ballY=200,ballVX=0, ballVY=5;
float pika1X=200,pika1Y=420, pika1VX=0,pika1VY=0;
float pika2X=600,pika2Y=420, pika2VX=0,pika2VY=0;
boolean bGameOver=false;
void draw(){
background(#A0D6F0);
noStroke(); fill(#A5A093); rect(0,500, 800,100);
fill(255,0,0); ellipse(ballX,ballY, 60,60);
rect(400,340,10,260);
fill(#5EAD52); ellipse(pika1X,pika1Y, 60,100);
fill(#5EAD52); ellipse(pika2X,pika2Y, 60,100);

if(bGameOver) return;
ballX +=ballVX; ballY +=ballVY;
ballVY += 0.98;
pika1X += pika1VX; pika1Y +=pika1VY; pika1VY +=0.98;
if(ballY>=500-30) bGameOver=true;
if(pika1Y>=500-50) {pika1VY=0; pika1Y=500-50; }
if( dist(pika1X,pika1Y,ballX,ballY)<=80) ballVY=-ballVY;
}
void keyPressed(){
if(key=='1') pika1VX=-3;
if(key=='2') pika1VY=50;
if(key=='4') pika1VX=3;
if(key=='5') pika1VY=0;
}
void keyReleased(){
if(key=='1') pika1VX=0;
if(key=='2') pika1VY=0;
if(key=='4') pika1VX=0;
if(key=='5') pika1VY=0;
}

2017年10月16日星期一

Week 5 - 文郁上課誌

２０１７互動技術
2017 / 10 / 16
1. 大眼睛小遊戲
2. 泡泡射擊

*大眼睛(眼球跟著滑鼠方向移動)

void setup(){

size(600,600);

}

void draw(){

background(#96DCF7);

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);

}

void setup(){
size(600,600);
}
void draw(){
background(#96DCF7);
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);
}

*泡泡發射

-滑鼠不動時，黃色泡泡會沿著線發射出去，但是遊戲還不完整

void setup(){
size(400,800);
}
float ballX=200, ballY=600;
float ballVX=0, ballVY=0;
float angle=0;
void draw(){
background(#804EDE);
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);
}

-滑鼠點一下可以發少泡泡(可發射多顆，但遊戲不完整，發射太多顆泡泡會當機)

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(#804EDE);
fill(#FA9703); ellipse(200,600,100,100);
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;

2017年10月2日星期一

Week 4 - 文郁上課誌

２０１７互動技術

2017 / 10 / 02

1. 畫出多個Pig

2. 做出直線運動、拋物線

3. 音樂播放

*畫出更多個Pig，且當鳥碰到Pig時，Pig會自動消失

PImage imgBird, imgPig;
void setup(){
size(800,600);
imgBird=loadImage("bird.png");
imgPig=loadImage("pig.png");
imageMode(CENTER);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
pigx[i][j]=700-i*100; pigy[i][j]=100+j*100;pigAlive[i][j]=true;
}
}
}
float birdX = 400, birdY = 300;
float birdVX = 0, birdVY = 0;
float birdAX =0, birdAY = 0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive= new boolean[5][4];
void draw(){
background(255);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
if(dist(pigx[i][j],pigy[i][j], birdX, birdY)<100){
pigAlive[i][j]=false;
}
if(pigAlive[i][j]) image(imgPig, pigx[i][j], pigy[i][j], 100, 100);
}
}
image(imgBird, birdX, birdY, 100, 100);
line(birdX, birdY, 400,300);
birdX += birdVX;
birdY += birdVY;
birdVX += birdAX;
birdVY += birdAY;
}
void mouseDragged(){
birdX=mouseX;
birdY=mouseY;
birdVX=birdVY=birdAX=birdAY=0;
}
void mouseReleased(){
birdVX = (400-mouseX)/10.0;
birdVY = (300-mouseY)/10.0;
birdAY = 0.98;
}

*學習先畫出圖

float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive= new boolean[5][4];
void setup(){
size(800,600);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
pigx[i][j]=700-i*100; pigy[i][j]=100+j*100; pigAlive[i][j]=true;
}
}
}
void draw(){
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
fill(#5DE0ED); ellipse(pigx[i][j], pigy[i][j], 100,100);
}
}
fill(#FFB4EC); ellipse(400,300,100,100);

}

*移動滑鼠碰到藍色球，藍色球就會消失。

float birdX=100, birdY=400;
float birdVX=0, birdVY=0;
float birdAX=0, birdAY=0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive= new boolean[5][4];
void setup(){
size(800,600);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
pigx[i][j]=700-i*100; pigy[i][j]=100+j*100; pigAlive[i][j]=true;
}
}
}
void draw(){
background(255);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
if( dist(birdX, birdY, pigx[i][j], pigy[i][j]) <100 ) pigAlive[i][j]=false;
if(pigAlive[i][j]) {fill(#5DE0ED); ellipse(pigx[i][j], pigy[i][j], 100,100); }
}
}
fill(#FFB4EC); ellipse(birdX, birdY,100,100);

birdX += birdVX; birdY += birdVY;
birdVX +=birdAX; birdVY +=birdAY;
}
void mouseDragged(){
birdX=mouseX; birdY=mouseY;

}

*粉紅球可以做拋物線運動

float birdX=100, birdY=400;
float birdVX=0, birdVY=0;
float birdAX=0, birdAY=0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive= new boolean[5][4];
void setup(){
size(800,600);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
pigx[i][j]=700-i*100; pigy[i][j]=100+j*100; pigAlive[i][j]=true;
}
}
}
void draw(){
background(255);
for(int i=0;i<5;i++){
for(int j=0;j<4;j++){
if( dist(birdX, birdY, pigx[i][j], pigy[i][j]) <100 ) pigAlive[i][j]=false;
if(pigAlive[i][j]) {fill(#5DE0ED); ellipse(pigx[i][j], pigy[i][j], 100,100); }
}
}
fill(#FFB4EC); ellipse(birdX, birdY,100,100);

birdX += birdVX; birdY += birdVY;
birdVX +=birdAX; birdVY +=birdAY;
}
void mouseDragged(){
birdX=mouseX; birdY=mouseY;
birdVX=0; birdVY=0;
birdAY=0;
}
void mouseReleased(){
birdVX= (100-mouseX)/5.0; birdVY=(400-mouseY)/5.0; birdAY=0.98;

}

*音樂播放
要記得先載入Sound資料庫！

import processing.sound.*;

SoundFile sound;

void setup(){

size(800,600);

sound = new SoundFile(this, "bird.mp3");

sound.play();

sound.loop();

}

*使用Minim音樂播放

import ddf.minim.*;

Minim minim;
AudioPlayer player;

void setup(){
size(800,600);
minim = new Minim(this);
player = minim.loadFile("bird.mp3",2048);
player.play();
}
void draw(){

}

2017年9月30日星期六

Week 3 - 文郁上課誌

2017互動技術

2017 / 9 / 30

*憤怒鳥小遊戲

讀進兩張angrybird的png圖片檔，要把照片拉進程式裡

PImage imgBird, imgPig;

void setup(){

size(800,600);

imgBird=loadImage("bluebird.png");

imgPig=loadImage("greenbird.png");

}

void draw(){

background(#FFD6E4);

image(imgPig,100,10);

image(imgBird, mouseX,mouseY,350,300);

}

利用mouseDragged()讓bird可隨著滑鼠移動

PImage imgBird, imgPig;

void setup(){

size(800,600);

imgBird=loadImage("bluebird.png");

imgPig=loadImage("greenbird.png");

}

float birdX=200, birdY=300;

void draw(){

background(#FFD6E4);

image(imgPig,25,20);

image(imgBird, mouseX,mouseY,300,250);

}

void mouseDragged(){

birdX=mouseX-150; birdY=mouseY-150;

}

2017年9月25日星期一

Week 2 - 文郁上課誌

２０１７互動技術

2017 / 9 / 25

1. 做出小畫家，線條可改變粗細、顏色

2. 線條可自訂是否延續

3. 讀檔

開啟 Processing

線條可以改變粗細、可以改變顏色

*void draw(){

line(mouseX, mouseY, pmouseX, pmouseY);
}
void mousePressed(){
if(mouseX<100){
strokeWeight(mouseY/50);
}
if(mouseX>700){
stroke(mouseY/6.0 , 100,100);
}
}

* 線條可以自己自訂，滑鼠點一下則線條繼續畫，可以在旁邊先設定好自己要的線條粗細以及顏色，在進行畫圖。

void setup(){
size(800,600);
rect(width-100,0, width,height); ///modify!
rect(0,0, 100, height); ///modify!
colorMode(HSB, 100);
}
void draw(){
if(mousePressed) ///modify!
line(mouseX, mouseY, pmouseX, pmouseY);
}
void mouseDragged(){ ///modify!
if(mouseX<100){
strokeWeight(mouseY/50);
}
if(mouseX>width-100){ ///modify!
stroke(mouseY/6.0 , 100,100);
}

}