라즈이노 iOT

【 프로세싱 기초 #10】선 그리기 2 

 stroke,  strokeweight 등의 내장 함수 를 이용하여, 다양한 형태의 선을 그을 수 있다. 

▶ 문제1 : 아래 실행 결과를 참고하여, 오른 쪽으로 갈수록 점점 밝아지는 그라이데이션 효과를 선 그리기를 이용하여 작성하라.

▶ 실행결과 :

▶ 포인트 :  

- size(400, 400),  stroke(i)를 for문을 사용하여 선의 밝기를 조절

- stroke의 값은 0~255 사이의 값  (0은 검정, 255는 흰색)

- line(x1,y1,x2,y2) 함수로 수직선을 그린다

 ( 선의 시작점 은 x1,y1 ,   선의 끝점은 x2, y2 가 된다)

▶ 프로그램(code) : 

▶ 코드 설명 : 

- for 문을 사용하고, 그림을 그려주는 끝점의 위치 x좌표는 width,  y좌표는   heigh 가 된다. (즉, 보더 사이즈인 가로, 세로 사이즈 만큼 선을 그리게 된다)

▶ 코드 다운로드 : 

line_draw1.pde

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

▶ 문제2 : 오른쪽으로 갈수록 선의 굵기를 두껍게 그려라.

▶ 실행결과 :

▶ 포인트 :  

- size(400, 400),  stroke(i)를 for문을 사용하여 선의 밝기를 조절

- 배경을 기본 흰색으로 두고(background(255)), stroke의 가중치 값으로 그려주는 선의 굵기(폭)을 굵게 한다. 

▶ 프로그램(code) : 

  ▶ 코드 설명 : 

- strokeWeight(i/50) 에서 처음 값이 0 됨으로 폭 또한 0이 되어 처음 자리에 라인이 그려 지지 않으므로,  strokeWeight(i/50+1); 라고 바꾸어도 좋다. 

▶ 코드 다운로드 : 

line_draw2.pde

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

▶ 문제3 : 선의 굵기를 랜덤으로 하여 그려라.

▶ 실행결과 :

▶ 포인트 :  

- random(X) 함수를 이용 :  0 ~ X 미만 값 까지의 실수 값을 발생한다.

- int (random(X)) 으로 하면 쉽게 정수값으로 변환 된다.

▶ 프로그램(code) : 

  ▶ 코드 설명 : 

- strokeWeight(i/50) 에서 처음 값이 0 됨으로 폭 또한 0이 되어 처음 자리에 라인이 그려 지지 않으므로,  strokeWeight(i/50+1); 라고 바꾸어도 좋다. 

▶ 코드 다운로드 : 

line_draw3.pde

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

▶ 문제4 : 가로와 세로 선의 동시에 교차하여 그려라

▶ 실행결과 :

▶ 포인트 :  

- 배경색은 흰색으로 지정 background(255);

- 선의 진하기는 제일 진한 검정으로 고정 stroke(0)

- 라인 간격을 적당히 띄어 주어야 격자 형태로 그려진다

  (예, for 문에서 라인 간격 10을 줄 경우,  i += 10 )

▶ 프로그램(code) : 

  ▶ 코드 설명 : 

- 첫 번째 for 문은 라인의 세로 선을 그리기 위한 것이고, 

  두 번째 for 문은 라인의 가로 선을 그리기 위한 것이다. 

▶ 코드 다운로드 : 

line_draw4.pde