2020年10月5日星期一

Bill_week04

今天老師教我們怎麼丟圖片進去P語言的程式裡面，並且加入程式碼。

size用來調圖片的大小

image(img,0,0)代表圖片在0,0的時候開始放上去。

小葉老師教我們丟了兩個圖片。

這次加入了滑鼠拖拉程式讓我的圖片能夠跟著滑鼠一起跑，需要寫一個滑鼠拖拉的一行。
為了要讓圖片的拖拉能夠在滑鼠的中心，所以各自減了25，才能讓圖片在拖拉的過程中保持在滑鼠的中心點。
老師叫我們去下載了地圖和一個腳色，腳色必須要是去背的。
加了一個程式，能夠讓地圖隨著滑鼠移動進行橫向卷軸移動。
老師教我們用PPT做圖片去背的動作，這樣就不用開PS來編輯圖片了。
老師新交了一些東西，為了合乎物理定律所以用float來做。
加上了速度為了讓彈珠更符合真實情況。
加了用滑鼠控制。
用了重力一次彈跳減0.85的力氣，讓球看起來有彈跳的感覺。

Sunnnnnnnnnnnnnn

Week04

先在網路上找到圖片

直接把圖片拉到Processing裡面就會在檔案總管裡

然後讀入圖片,調整好大小

再印出來就會有原本的圖片了!

用同樣的方法就可以印出更多張圖

img後面的參數可以調整起始印圖片的位置,再後面的參數是控制圖片大小

改編一下你的程式碼

這樣第二章印出來的圖片就會跟著你的滑鼠跑

然後找一個超~~~~~~長的背景圖

跟一個去背的主角圖

接著把背景圖片的x設為變數

如果滑鼠的x座標>200 圖片就會往左邊拉

就有在滾動的效果

最後一節課做的是碰到邊界會反彈的球

好酷好酷

上面截不到反正就是跟上一張圖一樣的東西

總之就是可以彈出去的球

ㄉㄨㄞ唷ㄉㄨㄞ唷

煙燻豬肉

week04.圖片顯示以及移動,將物品加入速度,失敗的憤怒鳥

圖片需丟進程式碼裡面

PImage img; 設定圖檔名為img

Size(300,168); 視窗大小

img = loadImage("image.png"); 將圖片讀img

image( img , 0, 0) 圖片位置

PImage img; 圖檔img

PImage img1; 圖檔img1

size( 300, 168); 視窗大小

img = loadImage("image.png"); 圖片讀入img

img1 = loadImage("image2.png"); 圖片讀入img2

image( img, 0, 0); img位置

image( img1, 100, 100, 40 ,48); img1位置以及縮放大小

PImage img;

PImage img1;

void setup()

{

size( 300, 168);

img = loadImage("image.png");

img1 = loadImage("image2.png");

}

void draw()

{

image( img, 0, 0);

image( img1, mouseX-54/2, mouseY-49/2, 40 ,48);

}

img1的位置隨著滑鼠位置移動

void setup()

{

size( 800, 400);

background = loadImage("bg.png"); 背景圖

people = loadImage("l.png"); 人物圖

}

int x=0; 設定x值

void draw()

{

if(mouseX>700) x--; 當鼠標大於700背景圖向左移動

image( background, x, 0, 1500, 400);

背景圖並不大所以將大小放大

image( people, mouseX-40/2, mouseY-48/2, 40 ,48);

人物縮小並隨者滑鼠移動

}

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

float x=250, y=200;

float vx=1.0, vy=2.5; 移動速度

void setup()

{

size(500,400);

}

void draw()

{

ellipse( x, y, 10, 10); 球的位置和大小

x+=vx; 球的水平移動

y+=vy; 球的垂直移動

if(x>500 || x<0) vx = -vx; 當球移動到視窗外時將移動方向改變

if(y>400 || y<0) vy = -vy;

}

這是尚未完成的程式碼

void setup()

{

size(500,400);

}

void draw()

{

background(255);

if(mousePressed)line( mouseX, mouseY, x, y);

當滑鼠按下時開始畫線

ellipse( x, y, 10, 10);

x+=vx;

y+=vy;

if(x>500 || x<0) vx = -vx;

if(y>400 || y<0) vy = -vy;

}

void mouseReleased()

{

vx = x-mouseX; vy = y-mouseY; 當滑鼠放開時開始移動

}

float x=250, y=200;

float vx=1.3, vy=-14; 初始向左移動並向下掉落

void setup()

{

size(500,400);

}

void draw()

{

//background(255); 將背景消除後會顯示軌跡

ellipse( x, y, 10, 10);

x+=vx;

y+=vy;

vy +=0.98; 添加重力

if(x>500 || x<0) vx = -vx*0.85; 撞向牆壁時移動速度減慢

if(y>400 || y<0) vy = -vy*0.85;

}

week ╯ 04 ╮

week04💜👾

♥將圖片匯入processing(調整適當大小)

♥程式碼-

PImage img;

size(800,533);

img = loadImage("cat.jpg");///匯入一張圖

image( img , 0 , 0);

---

♥再匯入一張圖片作為LOGO

setup只做一次

draw一秒做60次

設滑鼠位置為LOGO的中心

♥程式碼-
PImage img;
PImage img2;
void setup()///only once
{
size(800,533);
img = loadImage("cat.jpg");
img2 = loadImage("logo.png");
}
void draw()///sixty/1sec
{
image( img , 0 , 0);
image( img2 ,mouseX-150/2, mouseY-119/2,150,119 );
}

---

♥把background換成長型的圖片

♥程式碼-

PImage img;

PImage img2;

void setup()///only once

{

size(800,471);

img = loadImage("bg.jpg");

img2 = loadImage("mario.png");

}

int x;

void draw()

{

if(mouseX>200) x--;

image( img , x , 0);

image( img2 ,mouseX-110/2, mouseY-100/2,150,119 );

}

---

♥按下滑鼠和球之間會產生一條線

放開後球將開始彈射

♥程式碼-

float x=250,y=200;

float vx=0,vy=0;

void setup()///only once

{

size(500,400);

}

void draw()

{

background(255);

if(mousePressed)line(mouseX,mouseY,x,y);

ellipse(x,y,10,10);

ellipse(mouseX,mouseY,10,10);

x+=vx; y+=vy;

if(x>500 || x<0)vx=-vx;

if(y>400 || y<0)vy=-vy;

}

void mouseReleased()

{

vx = x-mouseX;

vy = y-mouseY;

}

---

♥圓圈呈現拋物線

♥程式碼-

float x=250,y=200;

float vx=1.3,vy=-14;

void setup()///only once

{

size(500,400)-;

}

void draw()

{

//background(255);隱藏後可看到球的路徑

ellipse(x,y,10,10);

x+=vx; y+=vy;///牛頓第一運動定律動者恆動靜者恆靜

vy += 0.98;///牛頓第二運動定律 f=ma

if(x>500 || x<0)vx=-vx*0.85;

if(y>400 || y<0)vy=-vy*0.85;

}

week04

PImage img;
size(595,339);
img=loadImage("R4.jpg");
image(img,0,0);

圖片可移動

PImage img;
PImage img2;
void setup()
{
size(595,339);
img=loadImage("R4.jpg");
img2=loadImage("R4.jpg");
}
void draw(){
image(img,0,0);
image(img2,mouseX-54/2,mouseY-49/2,54,49);
}

翰翰week04

一開始老師先把一張圖檔直接拉到processing裡去，再來寫上程式碼就可以把圖檔叫出來了

PImage img;

size(440,440);

img= loadImage("dog.jpg");

image(img,0,0);

PImage img;

PImage img2;

size(440,440);

img= loadImage("dog.jpg");

img2=loadImage("dog1.jpg");

image(img,0,0);

image(img2,100,100,54,49);

這段程式碼可以同時塞兩張圖片

PImage img;

PImage img2;

void setup(){

size(440,440);

img= loadImage("dog.jpg");

img2=loadImage("dog1.jpg");

}

void draw(){

image(img,0,0);

image(img2,mouseX-54/2,mouseY-49/2,54,49);

}

這段程式碼可以讓圖片跟著滑鼠移動

PImage img;

PImage img2;

void setup(){

size(400,244);

img= loadImage("longbackgrounp.gif");

img2=loadImage("mario.png");

}

int x=0;

void draw(){

if(mouseX>300)x--;

image(img,x,0);

image(img2,mouseX-220/2,mouseY-337/2);

}

上面那個代表超出多少就往左抽多少背景圖

float x=250, y=200;

float vx=1.0, vy=2.5;

void setup()

{size(500,400);}

void draw()

{ellipse(x,y, 10, 10);

x+=vx;

y+=vy;

if(x>500 || x<0)vx=-vx;

if(y>400 || y<0)vy=-vy;

}

這隻程式可以模仿牛頓運動定律

float x=250, y=200;

float vx=0, vy=0;

void setup()

{size(500,400);}

void draw()

{

if(mousePressed)line(mouseX,mouseY,x,y);

ellipse(x,y, 10, 10);

ellipse(mouseX,mouseY,10,10);

x+=vx;

y+=vy;

if(x>500 || x<0)vx=-vx;

if(y>400 || y<0)vy=-vy;

}

void mouseReleased()

{

vx=x-mouseX;

vy=y-mouseY;

}

這支我不知道怎麼講，反正自己複製貼上自己看

float x=250, y=200;

float vx=1.3, vy=-14;

void setup()

{size(500,400);}

void draw()

{

background(255);

ellipse(x,y, 10, 10);

x+=vx;

y+=vy;

vy+=0.98;

if(x>500 || x<0)vx=-vx*0.85;

if(y>400 || y<0)vy=-vy*0.85;

}

這支程式也可以模仿運動定律

wendy_week4

互動技術概論學習日誌

week3

學習目標:

(一)照片顯示

(二)遊戲長圖模擬

(三)

(一)照片顯示&運用

定義: PImage img

讀入照片: loadImage(" Demo.jpg");

練習(一):

PImage img,img2;

void setup(){

size(640,360);

img = loadImage("little_cute.jpg");

img2 = loadImage("logo.png");

}

void draw(){

image(img,0,0);

image(img2,mouseX-100/2,mouseY-50/2,100,50);

}

(二)遊戲長圖模擬

PImage img,img2;

void setup(){

size(800,710);

img = loadImage("mario.png");

img2 = loadImage("bg1.png");

}

int x=0;

void draw(){

if(mouseX>400)x--;

image(img2,x,0);

image(img, mouseX-79/2,mouseY-99/2,79,99);

}

(三)

練習(一)

float x=250, y=200;
float vx=1.0, vy=2.3;
void setup(){
size(500,400);
}
void draw(){
ellipse(x,y,10,10);
x+=vx;
y+=vy;
if(x>500 || x<0)vx = -vx;
if(y>400 || y<0)vy = -vy;
}

練習(二)

float x=250, y=200;

float vx=1.3, vy=-14;

void setup(){

size(500,400);

}

void draw(){

background(255);

ellipse(x,y,10,10);

x+=vx;

y+=vy;

vy+=0.98;

if(x>500 || x<0)vx = -vx*0.85;

if(y>400 || y<0)vy = -vy*0.85;

}

訂閱：文章 (Atom)

2020互動技術

2020年10月5日星期一

Bill_week04

今天老師教我們怎麼丟圖片進去P語言的程式裡面，並且加入程式碼。

Sunnnnnnnnnnnnnn

week04.圖片顯示以及移動,將物品加入速度,失敗的憤怒鳥

week ╯ 04 ╮

week04

翰翰week04

wendy_week4

檢舉濫用情形

2020年10月5日 星期一

今天老師教我們怎麼丟圖片進去P語言的程式裡面，並且加入程式碼。

2020年10月5日星期一