프로세싱 - 기본도형

프로세싱 - 기본도형 : 프로세싱에서 화면에 원하는 선, 도형, 색칠하기를 위해 필요한 명령어, 

개념을 간단히 정리했다. 

1. 프로세싱의 좌표

- 왼쪽 위 부분이 0,0

- 부분으로 오른쪽으로 갈수록 X값 증가. 아래쪽으로 갈수록 Y 값 증가.

2-1. 기본도형 그리기

- 바탕 : size(A, B); 

- 점 : point(A, B); 

(점을 순서대로 연결해서 그려짐)

- 선 : line(x1, y1, x2, y2);

- 삼각형 : triangle(x1, y1, x2, y2, x3, y3);

- 사각형(1) : quad(x1, y1, x2, y2, x3, y3, x4, y4);

(한 점을 설정, 높이와 넓이를 설정하는 방식으로 그려짐)

- 사각형(2) : rect(x, y, width, height); //x, y는 시작점으로 사각형의 좌측상단점이 됨.

- 원 : ellipse(x, y, width, height);  //x, y는 원의 중심

- 호 : arc(x, y, width, height, start, stop, mode);

    - x, y : 중심점

    - start : 호가 시작하는 각도

    - stop : 호가 끝나는 각도

    - 각도는 PI 또는 radians(실제각도)를 이용해 표현.

    - mode : 호를 마무리하는 방법.

    OPEN(열어둠), CHORD(시작과 끝점연결), PIE(시작과 끝, 중심을 연결)

     모드를 안쓸 경우 마무리가 안된상태로 출력. 

- 선굵기 변경 : strokeWeight()

2-2. 도형의 기준점 배치

- rectMode(파라미터);

- rect(), ellipse() 와 같이 기준점이 있는 도형의 기준점을 배치.

- 파라미터 : CORNER(시작점이 구석으로짜짐), CORNERS(시작점이 구석으로짜지고 넓이와 길이는 대각점의 좌표가됨), CENTER(시작점이 중심점이됨), RADIUS(시작점이 중심점이됨 넓이와 길이는 너비와 높이를 각각 두배값으로 인식)

3. 색칠하기

- 배경 : background(값); // 값에는 RGB 값 3개를 넣음.   

- 도형 채우기(1) : fill(값);  / 취소 : nofill(값);  

- 점, 선, 도형의 모서리 : stroke(값);  

- 모드셋팅 : colorMode(모드); 

1) RGB 모드 : R 빨강 G 초록 B 파랑 // 디폴트모드임

2) HSB 모드 : H 색조 S 진함정도 B 밝기

H 는 0(빨강) ~ 360(빨강) 으로 이루어짐

S 는 0(연함) ~ 100(매우진함) 으로 이루어짐

B 는 0(어두움) ~ 100(매우밝음) 으로 이루어짐 

- 투명도 : 맨뒤에 0(완전투명) ~ 255(불투명) 값을 추가함.

4. 곡선 그리기

curve(cpx1,cpy1, x1,y1, x2,y2, cpx2,cpy2);

bezier(x1,y1 cpx1,cpy1, cpx2,cpy2, x2,y2)

 : 경고! 곡선그리기는 원리-사용법이 매우 복잡함 그러므로 일단 스킵함. 뭔지만 알아둠. 

5. 사용자 정의 도형그리기

beginShape();

    vertex(x, y);

    vertex(x, y);

    vertex(x, y);

..

endShape();