~ ~ เต่า เต่าๆมาแว้ว ~ ~
A turtle on the beach Processing.js code
void setup(){
size(300,300);
}
void drawWater(int l,int beach){
noStroke();
fill(34,207,224);
rect(0,0,l,l);
fill(255,237,203);
rect(beach,0,l,l);
}
void drawTurtle(int x,int y,int r,int t,int z){
//head
fill(143,245,208);
ellipse(x-r/2,y,r/2,3*r/7);
fill(255);
ellipse(x-95,y-t,20,10);
ellipse(x-95,y+t,20,10);
fill(0);
ellipse(x-95,y-t,10,5);
ellipse(x-95,y+t,10,5);
//tail
fill(143,245,208);
triangle(x+r/2-t,y-t,x+r/2-t,y+t,x+r/2+t,y);
//leg
ellipse(x-z-30,y-r/3,50,30);
ellipse(x-z-30,y+r/3,50,30);
ellipse(x+z+40,y-r/4,50,30);
ellipse(x+z+40,y+r/4,50,30);
//torroiseshell
fill(53,131,74);
ellipse(x,y,r,r-50);
noStroke();
fill(115,211,161);
ellipse(x,y,2*r/3,2*r/3-30);
fill(53,131,74);
quad(x-10,y-12,x+10,y-12,x+15,y,x-15,y);
quad(x-10,y+12,x+10,y+12,x+15,y,x-15,y);
quad(x-45,y-40,x-25,y-40,x-20,y-28,x-50,y-28);
quad(x-45,y-16,x-25,y-16,x-20,y-28,x-50,y-28);
quad(x+25,y-40,x+45,y-40,x+50,y-28,x+20,y-28);
quad(x+25,y-16,x+45,y-16,x+50,y-28,x+20,y-28);
quad(x-45,y+40,x-25,y+40,x-20,y+28,x-50,y+28);
quad(x-45,y+16,x-25,y+16,x-20,y+28,x-50,y+28);
quad(x+25,y+40,x+45,y+40,x+50,y+28,x+20,y+28);
quad(x+25,y+16,x+45,y+16,x+50,y+28,x+20,y+28);
}
//Global
int beach = -900;
int x = 300;
int z = 0;
int y = -50;
void draw(){
drawWater(900,beach);
beach = beach+1;
if(beach>900){
beach = -900; //เงื่อนไข ถ้า beach มากกว่า 900 ให้ beach = -900
}
drawTurtle(x,y,160,15,z);
y = y+1;
if(y>150){
y = 150; //เงื่อนไข ถ้า y มากกว่า 150 ให้ y = 150
}
x = x-1;
if(x<-200){
x = 350; //เงื่อนไข ถ้า x น้อยกว่า -200 ให้ x = 350
}
z = z+1;
if(z>25){
z = 0; //เงื่อนไข ถ้า z มากกว่า 25 ให้ z = 0
}
}
>.คำสั่งที่ใช้ในการวาดรูป ประกอบด้วย.<
- ellipse- คำสั่งวาดวงรี (x,y,r,p)ค่า x,y คือ ค่ากำหนดจุดศูนย์กลางวงกลมในแนวแกน x และแกน y ตามลำดับ
r คือ ค่าเส้นผ่านศูนย์กลางในแนวแกน x
p คือ ค่าเส้นผ่านศูนย์กลางในแนวแกน y
- rect - คำสั่งวาดสี่เหลี่ยมผืนผ้า (x,y,l,w)
ค่า x,y คือ ตำแหน่งจุดเริ่มวาดรูป จะเป็นมุมบนขวาของรูปสี่เลี่ยมที่วาดได้
l คือ ค่าความยาวของรูสี่เหลี่ยมในแนวแกน x โดยวาดไปทางขวาของจุดเริ่ม
w คือ ค่าความกว้างของรูปสี่เหลี่ยมในแนวแกน y โดยวาดลงล่างไปตามแนวแกน y
- quad - คำสั่งวาดรูปสี่เหลี่ยม (x,y,x1,y1,x2,y2,x3,y3)
ค่า x,y คือ ตำแหน่งมุมบนรูปสี่เหลี่ยมในแนวแกน x และแกน y ตามลำดับ
x1,y1 คือ ตำแหน่งมุมที่สองบนรูปสี่เหลี่ยมในแนวแกน x และแกน y ตามลำดับ
x2,y2 คือ ตำแหน่งมุมที่สามบนรูปสี่เหลี่ยมในแนวแกน x และแกน y ตามลำดับ
x3,y3 คือ ตำแหน่งมุมที่สี่บนรูปสี่เหลี่ยมในแนวแกน x และแกน y ตามลำดับ
ในการใน quad ต้องวาดตำแหน่งมุมเรียงเป็นลำดับเวียนตามเข็มหรือทวนเข็มนาฬิกา
- Local - ประกาศตัวแปรที่อยู่ในฟังก์ชัน
ตัวอย่าง void draw(){
int x = 100;
ellipse(x,100,50,50);
}
อาจเขียนเป็น
void drawCiecle(int x){
ellipse(x,100,50,50);
}แต่ต้องเขียนเรียกใช้ฟังก์ชัน
- Global - เป็นตัวแปรที่กำหนดค่าอยู่นอกฟังก์ชัน จะทำให้ภาพเคลื่อนไหวได้เมื่อกำหนดให้ค่าเปลี่ยน
ตัวอย่าง int x = 0; //Global variable
void setup(){
ellipse(x,100,50,50);
x = x+1; //กำหนดให้เมื่อวาดรูปแล้วค่า x = x+1 ไปเรื่อยๆ
}
- void - คำสั่งสร้างฟังก์ชัน เช่น
void drawCircle(){
....
} ต้องเขียนเรียกใช้
- void setup(){...} - คำสั่งสร้างฟังก์ชัน ที่เรียกใช้เองไม่ต้องเขียนเรียกใช้
- void draw(){...} - คำสั่งสร้างฟังก์ชัน ที่เรียกใช้อัตโนมัติหลัง setup
- if - การใช้เงื่อนไข
ตัวอย่าง int x = 0; //Global variable
void setup(){
ellipse(x,y,r,r);
x = x+1; //กำหนดให้เมื่อวาดรูปแล้วค่า x = x+1 ไปเรื่อยๆ
if(x>100){
x = 0; // เงื่อนไข ถ้า x>100 ค่า x จะเท่ากับ 0
}
}
- background(R,G,B) - กำหนดสีพื้นหลัง ตามค่าสี RGB
- fill(R,G,B)- คำสั่งใส่สีรูปวาดตามค่าสี RGB
- noStroke() - คำสั่งไม่วาดเส้นขอบของรูป
ไม่มีความคิดเห็น:
แสดงความคิดเห็น