프로세싱 - 움직이는 공

프로세싱 - 움직이는 공 : 무한반복 draw를 기반으로 움직이는 공을 만드는데 필요한, 또는 참고해야할 함수들을 정리했습니다.

float x;

float y;

PFont font;

String message = "GAME OVER";

float theta;

float S;

void setup()

{

  size(500,500);

  x = 250;

  y = 250;

  font = loadFont("ACaslonPro-Bold-48.vlw");

  textFont(font);

  textAlign(CENTER);

  rectMode(CENTER);

}

void draw()

{  

  fill(255);

  background(102);

  rect(250,250,250,250);

  S = dist(mouseX, mouseY, pmouseX, pmouseY );

  

  

  if(mousePressed)

  {

    x = mouseX;

    y = mouseY;

    println("Speed = ",S);

    ellipse(x,y,50,50);

    if(mouseX > (125+25) && mouseX < (375-25) && mouseY > (125+25) && mouseY < (375-25))

    {

    }

    else

    { 

        fill(0);

        translate(250,250);  // Translate to the center

        rotate(theta);                // Rotate by theta                  

        text(message,0,0);            

        theta += 0.005;                // Increase rotation

    }

  } 

}

움직이는 공

void setup() { } : 이하 함수들은 1회만 실행됩니다. 

void draw() { } :  이하 함수들은 무한반복됩니다.

dist() : 두 점사이의 거리의 차를 구합니다. (차이가 클수록 값도 커집니다. 속도를 구한다고 봐도 무방합니다.)

easing 계수활용 : 끝없이, 무한반복으로 변하는 물체가 있다.  물체의 매번 변화값이 작아야 움직임이 부드럽게 된다. 이럴때 사용하는게 easing 계수이다. 변화값에 0.01 정도 되는 수를 곱해보자. 이게 바로 이징 easing 계수이다. (변화값을 낮추어 부드럽게하는 계수)

mousePressed : 마우스가 눌리면 참을 반환 아니면 거짓을 반환합니다.

(== LEFT, RIGHT, CENTER... 아무것도 쓰지않으면 모두)

mouseX , mouseY : 현재 마우스가 있는 위치를 나타냅니다. *(기본제공 특수 변수)

충돌 구현

if(mouseX > (125+25) && mouseX < (375-25) && mouseY > (125+25) && mouseY < (375-25))

- 해당 조건은 사각형 안에 있는지 없는지를 판단합니다. 만족하면 안에 있는것입니다.

- 25를 더하고 25를 빼는이유는 위에서 그려질 원의 반지름이 25이기 때문입니다. 

- 만족하면 안에있는것이지만 우리가 원하는것은 사각형을 벗어나면 발생하는 현상이기때문에 else에 GAME OVER 메시지 함수를 넣어야합니다.

글자쓰기

Pfont font; : font라는 폰트 변수를 정의합니다.

font = loadFont("ACaslonPro-Bold-48.vlw"); : 글을 표현하려면 폰트가 필요합니다 data폴더에 존재하는 해당 폰트를 로드해 "font"라는 폰트변수에 저장합니다.

textFont(font); : 정의된 폰트를 불러옵니다

text(변수, x, y) : 변수(문자,문자열,"ㅁㅁㅁ")을 x,y에 출력합니다.

- x,y는 글자의 좌측하단을 가리킵니다.

- textAlign(); : 출력 기준점 설정 -- CENTER, RIGHT, LEFT(기본값)

글자 회전시키기

translate(x, y) : 기준점을 x ,y로 잡습니다. (본래 0,0 인걸 -> 0+x, 0+y로 바꾼다는 소리)

rotate(theta) : 변수를 기준으로 이하 오브젝트들을 회전시킵니다. 변수 theta는 "세타"로 각도를 말합니다. 각도는 아래에서 프레임당 0.05 씩 더해집니다. (회전의 중심점은 본래는 0,0으로 translate에 의해 변합니다.)