openframeworks로 그림 그리긔(#2)

<주의 사항>
1. 이 강의는 https://hyb05.tistory.com/23?category=840743<- 이것과 연결됩니다

2. visual studio 2017을 사용하고 있습니다

 

안녕하세요! 강의를 쓰게된 chang06입니닷

 

오늘은 무엇을 해볼까요?

제목처럼 여러 도형을 그려볼 것입니다

 

<목차>

1. setup 함수 만지기

2. draw 함수 만지기

-선, 사각형, 삼각형, 원을 그려볼 거에요!

 

 

 

 

 

void ofApp::setup(){
	ofSetWindowTitle("learning drawing");
	ofSetWindowShape(1024, 768);
	ofSetFrameRate(60);
	ofBackground(ofColor::black);
	ofSetLineWidth(1.0);
	ofSetColor(ofColor::white);
}

setup 함수에 이렇게 써줍시다

 

이 코드가 무슨 뜻인지 알아보아야갰죠?

첫 번째 줄의 ofSetWindowTitle("  "); 는 프로그램 창의 제목을,
ofSetWindowShape(  ); 는 프로그램 창의 가로와 세로 길이를,
ofSetFrameRate(  ); 는 1초당 프레임 개수를 설정하는 것입니다
그리고 ofBackground(  ); 는 배경 색을,
ofSetLineWidth(  ); 는 그림을 그릴 때 선의 굵기를,
ofSetColor(  ); 는 선의 색깔을 설정하는 것입니다

 

그럼 실행을 해봅시다

이런 창이 뜨셨다면 성공하셨습니다

제목이 바뀐 것이 보이죠?

 

 

 

 

 

 

이번엔 openframeworks의 좌표계를 이해해볼 것입니다

 

우리가 흔히 아는 좌표는 이런 것이죠?

좌표계의 중간에 ( 0, 0 )이 있습니다

그리고 위로 갈수록 y값이 증가합니다

하지만 openframeworks에서는 조금 다릅니다

이렇게 프로그램 창의 왼쪽 위가 ( 0, 0 )인 모양인 것입니다

그리고 아래로 갈수록 y값이 증가합니다

픽셀들이 모여있는 2차원 배열이라고 생각하셔도 좋습니다

 

 

 

 

 

 

 

 

와우 그럼 드디어 이제 그리는 시간입니다

 

간단한 선 그리기부터 해봅시다

선을 그리는 명령어는 ofDrawLine(float x1, float y1, float x2, float y2); 형식입니다

void ofApp::draw(){
	ofDrawLine(10, 10, 100, 100);
}

draw 함수에 이렇게 써줍시다

짜잔 선이 그려졌습니다

----------------------------------------------------------------------------------------------------------------------------------

 

 

그럼 직사각형을 그려봅시다

직사강형을 그리는 명령어는 ofDrawofDrawRectangle(float x, float y, float width, float height); 형식입니다

void ofApp::draw(){
	ofDrawRectangle(100, 30, 300, 210);
}

이렇게 draw 함수에 이렇게 써줍시다

그리고 실행하면!

와안.. 멋진 직사강형이 탄생했군요

 

void ofApp::draw(){
	ofNoFill();
	ofDrawRectangle(100, 30, 300, 210);
}

이렇게 위에 ofNoFill() 을 추가하여 도형 안에 채우기를 해제할 수도 있습니다

(반대로, 채우려면 ofFill()을 해주세욥!)

 

----------------------------------------------------------------------------------------------------------------------------------

 

다음은 삼각형입니다

삼각형 그리는 명령어의 형식은 ofDrawTriangle(float x1, float y1, float x2, float y2, float x3, float y3); 입니다

void ofApp::draw(){
	ofDrawTriangle(10, 10, 800, 600, 100, 700);
}

draw 함수에 이렇게 써주고 실행하면

이렇게 큰 삼각형이 그려지는군요

 

----------------------------------------------------------------------------------------------------------------------------------

 

이젠 원을 그려볼 것입니다

원을 그리는 명령어는 ofDrawCircle(float x, float y, float r); 형식입니다

void ofApp::draw(){
	ofDrawCircle(250, 250, 100);
}

우리 모두 draw 함수에 이렇게 적고 실행해봅시다

 

이렇게 원이 그려지는 것을 볼 수 있습니다

(각져 보이는 건 기분탓^^7)

----------------------------------------------------------------------------------------------------------------------------------

 

 

자! 수고하셨습니다

오늘은 간단한 도형을 그리는 방법을 알아보았는데요

 

다음 강의에선 3d 그리긔

또는 rotate, traslate 를 해볼 예정입니다

도움되셨으면 좋겠고 봐주셔서 감사합니닷