8. 프로세싱 점과 선을 그려보자!

안녕하세요 Apple 입니다.

오늘은 저번에 예고했던것처럼

점과 선을 그려보겠습니다.

첫번째로 점을 그려보겠습니다.

일단 아래와같이 코드를 작성 해주세요

setup, draw, size는 전 포스팅을 참고하세요.

코딩을 실행 시키면

위와같이 아~~주 작은 점 하나가 중앙에 찍힌것을 볼수있습니다.

여기서 눈치가 빠르신분들은 아실텐데요

point라는 함수가 점을찍을수있는 함수라는것을

알수있으실겁니다.

point

첫번째 값	점의 x 좌표
두번째 값	점의 y좌표

입니다.

위에서 point(250, 250);라고 했으니깐

"(250, 250)좌표에 점을 찍겠다."라는 뜻이 됩니다.

참고로 수학에서의 좌표는 원점이 왼쪽 하단 이지만

프로세싱에서의 원점은 오른쪽 상단이 됩니다.

하지만 점이 작아서 저상태로는 쓸모가 없겠죠?

그래서 여기서 strokeWeight라는 함수를 사용할건데요

strokeWeight라는 함수는 점과 선의 크기 또는 두께를

설정해주는 함수 입니다.

위의 코드에서 point바로 위에 strokeWeight(30);

을 추가해보고 실행 시켜보세요.

그럼 아까보다 상대적으로 점의 크기가 커졌죠?

이처럼 strokeWeight함수를 사용하면 크기를 마음데로

조정할수 있습니다.

이제 크기도 조정했으니 점의 색을 설정해야겠죠?

점 또는 선의 색을 설정할때는

stroke라는 함수를 사용하게 됩니다.

point위에다 stroke(0, 255, 0);

을 추가하여 실행 시켜보세요.

그러면 녹색 점으로 바뀌었을거에요.

stroke라는 함수는 위에서 말했듯이 색을 설정하는데요

stroke에는 값이 최소 1개에서

최대 4개까지 들어갑니다

값이 1개들어갈때

첫번째 값

명암만을 설정할때 0 ~ 255

값이 2개 들어갈때

첫번째 값	명암 0 ~ 255
두번째 값	투명도 0(투명) ~ 255(불투명)

값이 3개 들어갈때

첫번째 값	붉은색의 명암 0 ~ 255
두번째 값	녹색의 명암 0 ~ 255
세번째 값	청색의 명암 0 ~ 255

값이 4개 들어갈때

첫번째 값	붉은색의 명암 0 ~ 255
두번째 값	녹색의 명암 0 ~ 255
세번째 값	청색의 명암 0 ~ 255
네번째 값	투명도 0 ~ 255

입니다.

background함수와는 다르게 투명도가 추가됬죠?

다음으로 선을 그려볼건데요.

선의 종류가

곡선, 직선, 선분 등 여러가지가 있는데요.

프로세싱에서 곡선을 표현하는 curve 라는 함수가 있지만

이번 포스트 에서는 선분을 표현하는 line을 설명하겠습니다.

여기서 알아둬야할것은

선분을 그릴려면 최소 몇게의 점이 필요하죠?

네 바로 2개의점인데요

각각 시작점 끝점 입니다.

그래서 line이라는 함수도

시작점과 끝점의 좌표가 필요합니다.

그리고점은 x좌표 y좌표를 가지고 있으니깐

line의 값은 기본적으로 4개의 값이 들어갑니다.

line

첫번째 값	시작점의 x좌표
두번째 값	시작점의 y좌표
세번째 값	끝점의 x좌표
네번째 값	끝점의 y좌표

입니다.

선도 점과 마찬가지로

strokeWeight 랑 stroke 함수의 영향을 받는것 주의해주세요.

여기까지해서 선과 점을 그려봤습니다.

선을 그릴때는 curve나 vertex등의 함수가 있지만

이런한 함수들은 추후 필요할때 알려들리겠습니다.

지금까지 Apple 였습니다.

감사합니다.