라즈이노 iOT

【 프로세싱 기초 #11】선(Line)으로 색상있는 배경 연출하기

 앞 글에서는 선으로 흑백 톤의 배경을 그려 넣는 것을 해보았다. 이번에는 같은 원리로 선에 색을 넣어 그려 볼 것이다. 배경을 그라데이션 효과처럼 연출해 볼 수 있다.

▶ 문제 1 : 라인 그리기를 이용하여 그라데이션 배경을 아래 처럼 나타내도록 코드를 작성하라.

▶ 그라데이션 배경(실행결과) 

▶ 포인트 :
- stroke() 함수를 이용한다.   

- stroke() 함수는 인자값이 하나이면 흑백(예, stroke(0)이면 검정, stroke(255)이면 흰색) 값을 조절 할 수 있고, 인자값이 3개면 RGB 컬러를 표현 할 수 있다. (예, stroke(R,G,B), stroke(255, 0, 0) → 빨간색) ,  또한, 인자값이 4개이면 투명도(알파)를 조절 할 수 있다.  즉, stroke() 함수의 파라미터 값이 1개이면 흑백색상, 3개이면 컬러 색상을 표현 할 수 있다. 

- 라인을 출력 화면 좌측에서 부터 수직으로 그려서 우측 끝까지 그려나가면서 그라이데이션을 주기 위해 for문을 이용하여 특정색의 농도를 조절 한다. 

- 본 프로그램에서는 Red 인자 값의 요소를 변화 시켜 보았다.

▶ 프로그램(code) : 

 ▶ 코드 설명 : 

   -   stroke(255-i/2, 0, 0);   // 처음 레드 라인을 하나 그리게 되고, 점차 R값의 인자값 255(레드)에서 i/2 값을 뺀 색의 라인을 폭(width)의 끝까지 그려나가게 된다. 

▶ 코드 다운로드 :

sketch__11_line_width_color.pde

 ▶ 문제2 : 화면을 위, 아래 두개로 분할 하여 서로 다른 그라데이션을 배경을 연출 해보라.

▶ 그라데이션 배경(실행결과) 

▶ 프로그램(code) : 

▶ 코드 다운로드 :

sketch__11_line_width_color2.pde