Lab3_Example_Balloon

ตัวอย่าง บอลลูน

void draw() {
  size(ุ600, 300);
  frameRate(20);
  background(random(200), random(200), random(200));//random RGB background
  int x=mouseX;
  int y=100;
  if (x<100) {
    x=100;
    fill(#DD0000);
  } else {
    if (x>500) {
      x=500;
    }
    if (x>100) {
      fill(#0000DD);
    }
    if (x<500) {
      fill(#00DD00);
    }
  }
  draw_balloon(x, y);
}


//balloon funnction
void draw_balloon(int x, int y) {
  int radius = 100;
  int string_length = 150;
  strokeWeight(13);
  line(x, y, x, y + string_length);
  ellipse(x, y, radius, radius);
}

Lab2_อาการ Syntax Error ต่างๆ

SYNTAX ERROR

Syntax error เกิดจากการที่เราเขียนโค้ดไม่ตรงตามหลักการเขียนที่โปรแกรมกำหนดเอาไว้ การเกิด syntax error ที่เกิดขึ้นได้บ่อยๆ มีดังนี้

1.Expecting EOF,found "}" หรือการใส่ปีกกาเกิน
-เกิดจากที่เราใส่ปีกกาเกินตัวฟังก์ชันของมัน
-แก้ไขโดยการลบปีกกาตัวที่เกินออกไป

2.Missing a semicolon ( ; ) หรือการลืมใส่ semicolon ;
- เกิดจากที่เราลืมใส่ semicolon ต่อท้ายฟังก์ชันบางตัว
-แก้ไขว่าลืมใส่ตรงไหน โดยดูที่แถบด้านขวาที่ขึ้นเป็นขีดๆแดงๆ จากนั้นก็ใส่ให้เรียบร้อย

3.Unexpected token: fffff หรือ การไม่พบสัญลักษณ์ที่เกิดขึ้น
-เกิดจากเราเขียนตัวหนังสือลงไปเลย โดยที่ไม่ใช่การคำนวณ ไม่ใช่ฟังก์ชัน ไม่ใช่สัญลักษณ์ของโปรแกรม
-แก้ไขโดยการลบตัวหนังสือนั้นออก

4.Cannot convert from float to int หรือ การที่ไม่สามารถเปลี่ยนชนิด class ได้
-เกิดจากการใช้ class ผิด Syntax ของมัน เช่น คำสั่ง random นั้น syntax ของมันคือ random(float,float) แต่เราใช้ไปเก็บค่าไว้ในตัวแปร int หรือ เรานำข้อมูล float ไปใส่ใน int มันจึงเก็บค่าไม่ได้
-แก้ไข้โดยการเปลี่ยนชนิดตัวแปรที่ไว้เก็บค่า ให้เป็นชนิด float จึงจะเก็บค่าได้

5. The variable "posX" does not exist หรือ การไม่พบตัวแปร
-เกิดจากเราไม่ได้กำหนดตัวแปรนั้น หรือ เราพิมชื่อตัวแปรนั้นผิด
-แก้ไขโดยเช็คชื่อตัวแปรนั้น หรือกำหนดตัวแปรนั้นขึ้นมา

6.การใส่ค่าไม่ครบใน Parameter
-เกิดจากเราใส่ค่าใน Parameter ไม่ครบจำนวนตามที่เรากำหนดไว้ เช่น void Positive(int posX , int posY); เรากำหนดตัว Argument ไว้เป็น posX และ posY เวลาเราเรียกใช้งานฟังก์ชัน เราใส่ Positive(50);  แบบนี้จะขึ้น syntax error เพราะว่าเรากำหนดไว้ให้ใส่ไป 2 ค่า แต่เราใส่แค่ค่าเดียว
-แก้ไขโดยการเช็คตัว Argument ว่าเรากำหนดไว้กี่ค่า จากนั้นก็ใส่ค่า Parameter ให้ครบตามที่เรากำหนดไว้

Lab2_Positive_Sign

Positvie Sign by Function

//Positive Sign

int colors=0;

void setup() {

  size(500, 500);

}

void draw() {

  background(#FF0D0D);//red

  positive();

}

void positive() {

  int dX=120;//diameterX

  int dY=160;//diameterY

  int w=100;//weight

  int h=100;//height

  //rectangular area

  stroke(255);

  strokeWeight(0);

  fill(colors);

  rect(dX, dY, w*3, h);//horizontal rect

  rect(dX+100, dY-100, w, h*3);//vertical rect

}

void mousePressed() {  

  if (colors == 0) {

    colors = 255;

  } else {

    colors = 0;

  }

}

Lab2_Battery_Function

Battery follow the Cursor!!

void setup() {

  size(500, 500);

}

void draw() {

  background(255);//white

  battery(mouseX, mouseY);

}

void battery(int countX, int countY) {

  int space=40;

  int w=180;//width

  int h=90;//height

  stroke(#0041E0);//dark blue

  strokeWeight(8);

  fill(#0393FF);//blue

  //big square

  rect(countX, countY, w, h);

  fill(255);//white

  //batt head

  rect(countX+180, countY+35, w/9, h-70);

  //battery quntity

  fill(#FF0011);//red

  rect(countX, countY, space, h);//#1 batt

  rect(countX+space, countY, space, h);//#2 batt

  rect(countX+space*2, countY, space, h);//#3 batt

  rect(countX+space*3, countY, space, h);//#4 batt

}

Lab2_BMI_Function

BMI's Calculation by Function

//BMI Function

void setup() {

  size(300,300);

  background(#FF8B8B);//pink

  calculation(80,175);

}

void calculation(int w,int h){

  float h_2=(h/100.0)*(h/100.0);//Height^2

  float BMI=w/h_2;//value of BMI

  //terminal output

  print("Value Of BMI="+BMI);

  //explaining text

  textSize(24);//size of text

  text("Weight = "+w+" Kg.",30,100);

  text("Height = "+h+" cm.",30,140);

  text("BMI="+BMI+"",30,180);

}

Lab2_Circle'sCalculation_Function

Circle's Calculation by Function

//Circle's Calculation
int posx=100;
int posy=100;
int dm=160 ;//diameter
void setup() {
  size(500, 500);
  circle(100, 100);
  calculation();
}


void circle(int posx, int posy) {
  background(#FC66C1);//pink <3
  ellipse(posx, posy, dm, dm);//example

}
void calculation() {
  float r=dm/2;//radius
  float r_2=r*r;//radius square
  float A=3.14*r_2;//area
  float cf=2*(3.14)*r;//circumference
  //terminal output
  println("Value of circle's area = "+A);
  print("Value of circumference's circle = "+cf);
  textSize(24);//text size
  text("Circumference's circle = "+cf+" m.", 30, 400);
  text("Area's circle = "+A+" m^2.", 30, 350);
  text("Diameter's circle = "+dm+" m.", 30, 250);
  text("Radius's circle = "+r+" m.", 30, 300);

}

Lab2_Book_Function

Book use Function

//FAV Book Function

//int posX=0; //fill value to move(X)

//int posY=0;//fill value to move(Y)

void setup() {

  size(500, 500);

  background(255);//white

  book(0, 0);

}

void book(int posX, int posY) {//function

  fill(#B3CFF0);//blue

  strokeWeight(8);//thick line

  rect(80+posX, 130+posY, 340, 220);//body of book

  strokeWeight(6);//thin line

  fill(#78B2F7);//dark blue

  rect(230+posX, 130+posY, 40, 220);//spine 

  rect(290+posX, 150+posY, 110, 60);//title's frame

  fill(0);//black

  textSize(30);

  text("Conan", 300+posX, 190+posY);//Title

  strokeWeight(3);//Thinest Line

  line(250+posX, 130+posY, 120+posX, 100+posY);//pages1 r

  line(250+posX, 130+posY, 110+posX, 108+posY);//pages2 r

  line(250+posX, 130+posY, 100+posX, 115+posY);//pages3 r

  line(120+posX, 100+posY, 80+posX, 130+posY);//pages border r

  line(250+posX, 130+posY, 380+posX, 100+posY);//pages1 l

  line(250+posX, 130+posY, 390+posX, 108+posY);//pages2 l

  line(250+posX, 130+posY, 400+posX, 115+posY);//pages3 l

  line(380+posX, 100+posY, 420+posX, 130+posY);//pages border l

}

Lab2_Song_Function

Song use Function 

//FAV Song function

//int posX=0;//fill value to move(X)

//int posY=0;//fill value to move(Y)

void setup() {

  size(500, 500);

  background(0);//black

  symbol(0,0);

}

void symbol(int posX,int posY){//function

  //background's circle

  stroke(255);//black line

  strokeWeight(14);//thick line

  fill(0);//line's color

  ellipse(250+posX, 250+posY, 250, 250);//big circle with nothing  inside of it

  //Linkin Park symbol

  line(260+posX, 125+posY, 185+posX, 290+posY);

  line(185+posX, 290+posY, 325+posX, 290+posY);

  line(325+posX, 290+posY, 275+posX, 180+posY);

  line(275+posX, 180+posY, 195+posX, 360+posY);

  //open the circle

  stroke(0);

  line(258+posX, 100+posY, 238+posX, 140+posY);

  line(215+posX, 350+posY, 200+posX, 380+posY);

  //title

  fill(255);

  textSize(40);

  textAlign(LEFT);

  text("LINKIN PARK", 135+posX, 450+posY);

}

Lab2_Movie_Function

Doraemon(Function)

//MY FAV MOVIE (Function)
//int posX=0;//fill value to move(Horizontal)
//int posY=0;//fill value to move(Vertical)
void setup() {
  size(500, 500);
  background(#FACFF4);
  doraemon(0,0);//function
}
void doraemon(int posX,int posY){
  stroke(#0054A5);
  strokeWeight(3);
  fill(#0005F0);//blue
  textSize(30);
  text("Doraemon : Stand by me", 75, 420);//Title
  fill(#236ED6);//blue
  ellipse(250+posX, 180+posY, 350, 295);//head
  fill(255);//white
  ellipse(250+posX, 210+posY, 250, 205);//face
  ellipse(210+posX, 120+posY, 80, 100);//right hand
  ellipse(290+posX, 120+posY, 80, 100);//left hand
  fill(#F21D1D);//red
  rect(110+posX, 300+posY, 280, 30);//cat collar
  fill(255);//white
  ellipse(120+posX, 300+posY, 60, 60);//right eye
  ellipse(380+posX, 300+posY, 60, 60);//left eye
  fill(#FF292D);//red
  ellipse(250+posX, 175+posY, 45, 40);//nose
  fill(255);//white
  arc(250+posX, 235+posY, 180, 50, 0, PI);//cute smile
}

Lab2_Digital_Clock

นาฬิกาดิจิตอล

//digital clock

int cx=250;//centerX

int cy=150;//centerY

void setup() {

  size(500, 500);

}

void draw() {

  background(#A2FAF9);//light blue

  time();

  date();

}

//time function

void time() {

  fill(0);

  textSize(50);

  //hour

  if (hour()<10) {

    text("0"+hour(), cx-150, cy-100);

  } else {

    text(hour(), cx-150, cy-100);

  }

  //minute

  if (minute()<10) {

    text(":"+"0"+minute(), cx-50, cy);

  } else {

    text(":"+minute(), cx-50, cy);

  }

  //second

  if (second()<10) {

    text(":"+"0"+second(), cx+50, cy);

  } else {

    text(":"+second(), cx+50, cy);

  }

  //Hr Min Sec's text

  textSize(15);

  text("Hr", cx-140, cy-50);

  text("Min", cx-40, cy-50);

  text("Sec", cx+60, cy-50);

}

//Date's function

void date() {

  textSize(40);

  //day

  text(day(), cx-150, cy+200);

  //month

  text(month(), cx-50, cy+200);

  //year

  text(year(), cx+50, cy+200);

//date 's text

textSize(15);

  text("Day", cx-140, cy+150);

  text("Month", cx-40, cy+150);

  text("Year", cx+60, cy+150);

}

Lab1_Fav_Book_MOVE

Fav. Book(Can be move)

//FAV Book

void setup() {

  int posX=0; //fill value to move(X)

  int posY=0;//fill value to move(Y)

  size(500, 500);

  background(255);//white

  fill(#B3CFF0);//blue

  strokeWeight(8);//thick line

  rect(80+posX, 130+posY, 340, 220);//body of book

  strokeWeight(6);//thin line

  fill(#78B2F7);//dark blue

  rect(230+posX, 130+posY, 40, 220);//spine 

  rect(290+posX, 150+posY, 110, 60);//title's frame

  fill(0);//black

  textSize(30);

  text("Conan", 300+posX, 190+posY);//Title

  strokeWeight(3);//Thinest Line

  line(250+posX, 130+posY, 120+posX, 100+posY);//pages1 r

  line(250+posX, 130+posY, 110+posX, 108+posY);//pages2 r

  line(250+posX, 130+posY, 100+posX, 115+posY);//pages3 r

  line(120+posX, 100+posY, 80+posX, 130+posY);//pages border r

  line(250+posX, 130+posY, 380+posX, 100+posY);//pages1 l

  line(250+posX, 130+posY, 390+posX, 108+posY);//pages2 l

  line(250+posX, 130+posY, 400+posX, 115+posY);//pages3 l

  line(380+posX, 100+posY, 420+posX, 130+posY);//pages border l

}

Lab1_Fav_Song_Move

Fav. Song (Can be move)

//FAV Song MOVE

void setup() {

int posX=0;//fill value to move(X)

int posY=0;fill value to move(Y)

  size(500, 500);

  background(0);//black

  //background's circle

  stroke(255);//black line

  strokeWeight(14);//thick line

  fill(0);//line's color

  ellipse(250+posX, 250+posY, 250, 250);//big circle with nothing  inside of it

  //Linkin Park symbol

  line(260+posX, 125+posY, 185+posX, 290+posY);

  line(185+posX, 290+posY, 325+posX, 290+posY);

  line(325+posX, 290+posY, 275+posX, 180+posY);

  line(275+posX, 180+posY, 195+posX, 360+posY);

  //open the circle

  stroke(0);

  line(258+posX, 100+posY, 238+posX, 140+posY);

  line(215+posX, 350+posY, 200+posX, 380+posY);

  //title

  fill(255);

  textSize(40);

  textAlign(LEFT);

  text("LINKIN PARK", 135+posX, 450+posY);

}

Lab1_Fav_Movie_MOVE

Fav. Movie (Can be move)

//MY FAV MOVIE

void setup() {

  int posX=0;//fill value to move(Horizontal)

  int posY=0;//fill value to move(Vertical)

  size(500, 500);

  stroke(#0054A5);

  strokeWeight(3);

  background(#FACFF4);

  fill(#0005F0);//blue

  textSize(30);

  text("Doraemon : Stand by me", 75, 420);//Title

  fill(#236ED6);//blue

  ellipse(250+posX, 180+posY, 350, 295);//head

  fill(255);//white

  ellipse(250+posX, 210+posY, 250, 205);//face

  ellipse(210+posX, 120+posY, 80, 100);//right hand

  ellipse(290+posX, 120+posY, 80, 100);//left hand

  fill(#F21D1D);//red

  rect(110+posX, 300+posY, 280, 30);//cat collar

  fill(255);//white

  ellipse(120+posX, 300+posY, 60, 60);//right eye

  ellipse(380+posX, 300+posY, 60, 60);//left eye

  fill(#FF292D);//red

  ellipse(250+posX, 175+posY, 45, 40);//nose

  fill(255);//white

  arc(250+posX, 235+posY, 180, 50, 0, PI);//cute smile <3

  fill(#FAD449);//gold or yellow

  ellipse(250+posX, 300+posY, 40, 40);//bell

  fill(#3C60B9);//blue

  ellipse(225+posX, 135+posY, 20, 20);//inner eye(right)

  ellipse(275+posX, 135+posY, 20, 20);//inner eye(left)

  line(250+posX, 194+posY, 250, 260);//mouth (line)

  line(210+posX, 210+posY, 140, 210);// cat's whiskers mid right

  line(290+posX, 210+posY, 360, 210);// cat's whiskers mid left

  line(210+posX, 220+posY, 140, 230);// cat's whiskers below right

  line(290+posX, 220+posY, 360, 230);// cat's whiskers below left

  line(210+posX, 200+posY, 140, 190);// cat's whiskers above right

  line(290+posX, 200+posY, 360, 190);// cat's whiskers mid left

  line(232+posX,290+posY,267,290);//bell line1

  line(210+posX,300+posY,290,300);//bell line2

  strokeWeight(7);

  line(250+posX,302+posY,250,320);//bell line3

  stroke(255);//white line

  fill(255);//white

  ellipse(258+posX, 170+posY, 12, 12);//reflect nose

}

Lab1_Circle's_Calculation

การหาค่าของเส้นรอบวงและพื้นที่ของวงกลม

//Circle's Calculation

void setup() {

  int dm=160 ;//diameter

  float r=dm/2;//radius

  float r_2=r*r;//radius square

  float A=3.14*r_2;//area

  float Cf=2*(3.14)*r;//circumference

  size(500,500);

  //terminal output

  println("Value of circle's area = "+A);

  print("Value of circumference's circle = "+Cf);

  background(#FC66C1);//pink <3

  ellipse(100,100,160,160);//example

  

  //explaining text

  textSize(24);//text size

  text("Circumference's circle = "+Cf+" m.",30,400);

  text("Area's circle = "+A+" m^2.",30,350);

  text("Diameter's circle = "+dm+" m.",30,250);

  text("Radius's circle = "+r+" m.",30,300);

}

Lab1_BMI

การคำนวณหาค่าดัชนีมวลกาย BMI

//BMI
void setup() {
  size(300,300);
  background(#FF8B8B);//pink
  float w=48  ;//Weight
  float h=163  ;//Height
  float h_2=(h/100.0)*(h/100.0);//Height^2
  float BMI=w/h_2;//value of BMI

  //terminal output
  print("Value Of BMI="+BMI);

  //explaining text
  textSize(24);//size of text
  text("Weight = "+w+" Kg.",30,100);
  text("Height = "+h+" cm.",30,140);
  text("BMI="+BMI+"",30,180);
}

Lab1_Battery

วาดรูปแบตเตอรี่โดยใช้ตัวแปรทำให้สามารถเคลื่อนย้ายรูปได้ง่ายโดยการเปลี่ยนค่าที่ตัวแปรที่ประกาศ

void setup() {

  int countX=70;

  int countY=220;

  int space=40;

  int w=180;//width

  int h=90;//height

  size(500, 500);

  background(255);//white

  stroke(#0041E0);//dark blue

  strokeWeight(8);

  fill(#0393FF);//blue

  //big square

  rect(countX, countY, w, h);

  fill(255);//white

  //batt head

  rect(countX+180,countY+35, w/9, h-70);

  fill(#FF0011);//blue

  //battery quntity

  rect(countX, countY, space, h);//#1 batt

  fill(255);//white

  rect(countX+space, countY, space, h);//#2 batt

  rect(countX+space*2, countY, space, h);//#3 batt

  rect(countX+space*3, countY, space, h);//#4 batt

}

Lab1_Positive_Sign

เขียนรูปเครื่องหมายบวก โดยใช้การกำหนดตัวแปร

//Positive Sign

void setup() {

  int dX=120;//diameterX

  int dY=160;//diameterY

  int w=100;//weight

  int h=100;//height

  size(500, 500);

  background(#E4DBFF); //blue

  //rectangular area

  stroke(#FF0505);//red

  strokeWeight(0);

  fill(#FF0505);//red

  rect(dX,dY,w*3,h);//horizontal rect

  rect(dX+100,dY-100,w,h*3);//vertical rect

  

  //Title

  textSize(20);

  text("Positive Sign",dX+90,550-dY);

}

Lab0_FAV_Song

"So give me reason !!! to prove me WRONG!!!!"

"LINKIN PARK"

//FAV Song

void setup() {

  size(500, 500);

  background(0);//black

  //backgroun's circle

  stroke(255);//black line

  strokeWeight(14);//thick line

  fill(0);//line's color

  ellipse(250, 250, 250, 250);//big circle with nothing  inside of it

  //Linkin Park symbol

  line(260, 125, 185, 290);

  line(185, 290, 325, 290);

  line(325, 290, 275, 180);

  line(275, 180, 195, 360);

  //open the circle

  stroke(0);

  line(258, 100, 238, 140);

  line(215, 350, 200, 380);

  //title

  fill(255);

  textSize(40);

  textAlign(LEFT);

  text("LINKIN PARK", 135, 450);

}

เพลงที่กล่าวถึง

Lab0_Fav_Book

ถึงตัวจะเป็นเด็ก !! แต่สมองนั้นเป็นผู้ใหญ่ !! ชื่อของเขาคือ !!ยอดนักสืบ โคนัน !!!!!

//FAV Book

void setup() {

  size(500, 500);

  background(255);//white

  fill(#B3CFF0);//blue

  strokeWeight(8);//thick line

  rect(80,130,340,220);//body of book

  strokeWeight(6);//thin line

  fill(#78B2F7);//dark blue

  rect(230,130,40,220);//spine 

  rect(290,150,110,60);//title's frame

  fill(0);//black

  textSize(30);

  text("Conan",300,190);//Title

  strokeWeight(3);//Thinest Line

  line(250,130,120,100);//pages1 r

  line(250,130,110,108);//pages2 r

  line(250,130,100,115);//pages3 r

  line(120,100,80,130);//pages border r

  line(250,130,380,100);//pages1 l

  line(250,130,390,108);//pages2 l

  line(250,130,400,115);//pages3 l

  line(380,100,420,130);//pages border l

  

}

Lab0_Fav_Movie

การ์ตูนในตำนานที่เป็น THE MOVIE !!! 

Doraemon : Stand by me !

//MY FAV MOVIE

void setup() {

  size(500, 500);

  stroke(#0054A5);

  strokeWeight(3);

  background(#FACFF4);

  fill(#0005F0);//blue

  textSize(30);

  text("Doraemon : Stand by me", 75, 420);//Title

  fill(#236ED6);//blue

  ellipse(250, 180, 350, 295);//head

  fill(255);//white

  ellipse(250, 210, 250, 205);//face

  ellipse(210, 120, 80, 100);//right hand

  ellipse(290, 120, 80, 100);//left hand

  fill(#F21D1D);//red

  rect(110, 300, 280, 30);//cat collar

  fill(255);//white

  ellipse(120, 300, 60, 60);//right eye

  ellipse(380, 300, 60, 60);//left eye

  fill(#FF292D);//red

  ellipse(250, 175, 45, 40);//nose

  fill(255);//white

  arc(250, 235, 180, 50, 0, PI);//cute smile <3

  fill(#FAD449);//gold or yellow

  ellipse(250, 300, 40, 40);//bell

  fill(#3C60B9);//blue

  ellipse(225, 135, 20, 20);//inner eye(right)

  ellipse(275, 135, 20, 20);//inner eye(left)

  line(250, 194, 250, 260);//mouth (line)

  line(210, 210, 140, 210);// cat's whiskers mid right

  line(290, 210, 360, 210);// cat's whiskers mid left

  line(210, 220, 140, 230);// cat's whiskers below right

  line(290, 220, 360, 230);// cat's whiskers below left

  line(210, 200, 140, 190);// cat's whiskers above right

  line(290, 200, 360, 190);// cat's whiskers mid left

  line(232,290,267,290);//bell line1

  line(210,300,290,300);//bell line2

  strokeWeight(7);

  line(250,302,250,320);//bell line3

  stroke(255);//white line

  fill(255);//white

  ellipse(258, 170, 12, 12);//reflect nose

}

Lab0_Fav_Game

เกมส์ในตำนาน ! PACMAN!!

//Fav_Game

void setup() {

  int count=80;

  size(500,500);

  background(#03C2FA);//bg blue

  stroke(0);

  strokeWeight(4); //thick line

  fill(#ffcc00);//yellow pacman

  arc(120,250,200,200,QUARTER_PI,PI+PI-QUARTER_PI,); //Mr.Pacman

  fill(0);//black eye

  ellipse(100,200,40,40); //Eye

  fill(#cc0033);//red

  ellipse(230,250,40,40);//Mr.Pacman's Foods

  ellipse(230+count,250,40,40);

  ellipse(230+count+count,250,40,40);

  ellipse(230+count+count+count,250,40,40);

  textSize(50);

  fill(0);

  text("PACMAN",150,80);//name tag

  line(0,370,500,370);//decorate line

  line(0,130,500,130);

}