단 하나의 예시로 객체지향 프로그래밍의 기본 개념과 구문을 요약하기는 어렵다. 객체 생성 과정을 이해하기 쉽도록 만 들기 위해 필자는 Fsg 클래스를 만들어 Spot과 비교했다. Figg 클래스는 원하는 모양과 행동을 보이기 위해 필요한 필드와 메소드의 개요로 시작한다.
float x 계란 중심의 X 좌표
float y 계란 밑바닥의 Y좌표
float tilt 좌우 각도 오프셋
float angle 기울기 정도(회전)
float scalar 계란의 높이
void wobble() 계란을 앞뒤로 움직임
void display() 계란을 그림
클래스의 요구사항을 충족시킨 후에는 Spot 클래스와 똑같은 방향으로 나아간다. Egg 클래스는 3 및 필드와 dieplart)
메소드뿐인 최소한으로 시작했다. 이후 Egg 클래스는 결과를 확인하기 위해 sctup( )과 dram( )를 사용해 프로그램에 추가되었 다. 계란의 크기를 줄이기 위해 scald() 함수를 추가했다.
기본 프로그램이 만족스럽게 작동할 때 각도를 변경하기 위해 roate ) 참수와 에 필드가 추가되었다.
마지막으로 계란이 움직이도록 코드가 추가되었다. 2mg 필드는 d를 설정하기 위해 계속 바뀌는 수치로 추가되었다. 각도를 추가하고 기울기를 계산하기 위해 wobble() 메소드가 추가되었다.
cox() 함수는 좌우로 흔들 리는 속도를 가감하기 위해 추가되었다. 수많은 증분 추가와 테스트 이후 최종 Figg클래스는 처음 계획대로 작동했다.
class Egg {
float x, y;
float x, y; // X-coordinate, y-coordinate
float tilt; // Left and right angle offset
float angle; // Used to define the tilt
float scalar; // Height of the egg
// Constructor
Egg(int xpos, int ypos, float t, floats) {
x = xpos
y = ypos;
tilt = t
scalar = s / 100.0;
}
void wobble() {
tilt = cos(angle) / 8;
angle += 0.1;
}
void display() 1 noStroke():
fill (255);
pushMatrix();
translate(x, y);
rotate (tilt);
scale(scalar);
beginShape();
vertex(0, -100);
bezier Vertex(25, - 100, 40, -65, 40, -40):
bezier Vertex(40, -15, 25, 0, 0, 0);
bezier Vertex(-25, 0, -40, -15, -40, -40): bezier Vertex(-40, -65, -25, -100, 0, - 100):
endShape();
popMatrix();
}
}
Egg 클래스는 SPot 예시와 마찬가지로 setup ( )과 draw()에 포함되어 있다. humpty라는 Egg 유형의 객체가 구축되었고 좌표와 최초 기울기 값이 생성자로 전달되었다.
draw() 안에서 wobble()과 display() 메소드는 차례대로 실행되어 계란의 각도와 기울기 값이 업데이트되도록 한다.
이 값은 화면에 도형을 그리는 데 사용된다. 계란이 좌우로 흔들리는 것을 보기 위 해 이 코드를 실행하라.
Egg humpty; // Declare the object
void setup () {
size(100, 100);
// Inputs: ×-coordinate, y-coordinate, tilt, height
humpty = new Egs(50, 100, 0, 80);
}
void draw() {
background(0);
humpty.wobble(); humpty.display();
}
Ring 클래스는 다른 예시다. 이 예시는 켜진 후 고정된 너비만큼 확장되었다가 저절로 꺼져 화면에 표시되지 않는 원을 정의한다. 이 클래스가 아래 예시에 추가될 때 마우스 버튼을 클릭하면 새로운 고리가 켜진다. Ring의 필드와 메소드는 이 행동을 가능하게 만든다.
Spot과 Egg와 마찬가지로 Ring은 처음에는 간단한 클래스로 개발되었다. Ring의 기능은 일련의 반복으로 나타났 으로 이 클래스는 생성자가 없다. 이 클래스의 값은 start() 메소드가 프로그램 안에서 호출될 때까지 설정되지 않는다.
이번 장 이전에 작성된 프로그램들은 모두 코드 전체에 파일을 1개만 사용했다. 프로그램들이 점점 더 길어지면서 파일
1개로는 불편할 수 있다. 프로그램이 수백 수천 줄로 늘어날 때 프로그램을 모듈 단위로 나누면 프로그램의 다른 부분을 관 리하는 데 도움이 된다. 프로세싱은 스케치북sketchbook 으로 파일을 관리하고 각 스케치들은 탭으로 관리되는 다수 파일을 가질 수 있다.
스케치 이름 우측, 프로세싱 개발환경(PDE)의 둘 바 버튼 아래의 화살표 버튼은 이 파일을 관리하는 데 사용한다.새 탭 생성, 현재의 탭 이름 바꾸기, 현재의 탭 삭제 등의 옵션을 보기 위해 그 버튼을 클릭하라.
탭이 어떻게 작동하는지 알아보기 위해 코드 25-04를 별개 파일로 나누어 모듈 프로그램으로 만들어라. 이 프로그램을 프로세싱에서 열거나 다시 타이핑하고 이름을 ‘Example4’ 로 설정하라. 이제 화살표 버튼을 클릭하고 등장하는 목록에서 뉴 탭 옵션을 선택하라. 새 탭의 이름을 질문하는 프롬프트가 나타난다.
파일에 지정할 이름을 원하는 대로 적고 ‘OK’를 눌러 계속하라. 탭이 Spot 클래스를 저장할 것이므로 Spot’을 이름으로 사용하라. 이제 스케치 폴더에 Spot.pde라는 새로운 파일이 생성된다. ‘스케치 폴더 보여주기 show Sketch folder’를 스케치 메뉴에서 선택해 그 파일을 확인하라.
여러 파일을 가진 스케치가 생성되면 프로세싱이 인식할 수 있도록 파일들 중 하나는 스케치가 든 풀더의 이름과 반드시 같아야 한다.
이 파일은 스케치의 메인 파일이며 항상 맨 왼쪽 탭에 표시된다. 스케치에 대한 setup()과 drear( )는 반드시 이 파일에 있어야 한다. 스케치 안의 파일들 중 단 하나만 setup()과 dreaw()를 가질 수 있다. 다른 탭은 좌측에서 우측으로 알파 벳 순으로 나타난다.
스케치가 실행될 때 스케치를 구성하는 모든 PDE 파일은 코드가 컴파일 되고 실행되기 전에 단일 파일로 변환된다. 모 든 탭의 추가함수 및 변수는 메인 파일에서 정의한 전역변수에 접근할 수 있다. 고급 프로그래머는 다른 행동을 원할 수도 있다. 추가적인 설명은 레퍼런스에서 찾을 수 있다.
복수의 생성자
한 클래스는 필드를 다른 방식으로 적용하기 위해 복수의 생성자를 가질 수 있다. 종종 생성자를 이용해 필드에 매개변 수를 지정함으로써 객체 데이터의 모든 요소들을 특정하는 것이 이로울 수 있지만 1개나 제한적인 수만 정의하는 것이 적절 할 경우도 있다.
다음 예시에서 다른 생성자는 사전 설정 값을 사용하는 반면, 한 생성자는 좌표, 좌표, 지름을 설정한다. 객체가 생성 될 때 프로그램은 특정된 변수의 숫자와 유형에 따라 생성자를 선택한다. setup()의 끝에 sp1 객체가 Spot 생성자의 첫 번째 버전을 사용해 생성되며 sp2 객체가 두 번째 버전을 사용해 생성된다.
Spot sp1, sp2;
void setup () {
size (100, 100);
/ Run the constructor without parameters
sp1 = new Spot();
/ Run the constructor with three parameters
sp2 = new Spot(66, 50, 20);
}
void draw() {
background (204);
sp1.display();
sp2.display();
}
class Spot {
float x, y, diameter;
// First version of the Spot constructor;
/ the fields are assigned default values
Spot() {
x= 33;
y = 50;
diameter = 8;
}
// Second version of the Spot constructor;
/ the fields are assigned with parameters
Spot(float xpos, float ypos, float d) (
x = xpos;
y = ypos;
diameter = d;
}
void display() {
ellipse(x, y, diameter, diameter);
}
}