3. 색상 추가하기
소개
안녕하세요. 세번째 튜토리얼 입니다. 여기서는 2강의 내용을 확장하여 OpenGL에 놀라운 색상을 추가하는 법을 알아볼 것입니다. 물론 매우 약간의 노력만 들여서 말입니다. 여러분들은 단색으로 한 표면을 칠하는 방법뿐만 아니라 부드럽게 그라데이션을 입히는 방법도 배울 것입니다. 왼쪽에 있는 삼각형이 부드러운 방법을 사용할 것이고, 오른쪽에 있는 사각형이 단색을 사용할 것입니다. 삼각형에 있는 색상들이 어떻게 혼합되는지 잘 살펴봐 주세요.
색상은 OpenGL 프로젝트에 생명을 불어넣어줍니다. 단색 및 부드러운 색칠법을 이해하시면 OpenGL 데모를 정말 그럴듯하게 만들 수 있을 것입니다.
본문
지난 튜토리얼에서 저희가 다뤄봤던 내용은 삼각형과 사각형을 화면에 출력시키는 방법이었습니다. 이 튜토리얼에서는 그 삼각형과 사각형에 상이한 두종류의 색칠법을 더하는 법을 알아볼 것입니다. 단색 색칠법은 그 사각형을 속이 꽉찬 단색으로 만드는 것입니다. 부드러운 색칠법은 삼각형의 각 점(정점)에서 정의된 세가지 색상을 혼합하여 그럴듯해 보이는 색상을 만드는 것입니다.
지난 튜토리얼의 코드를 다시 사용하면서 DrawGLScene 함수에 몇가지
내용을 추가할 것입니다. 아래에 이 함수의 전체코드가 있으니 지난 강좌에서
사용하셨던 DrawGLScene 함수 전체를 아래의 코드로 교체하시거나 변경된
사항만을 찾아서 추가해주시면 됩니다.
int DrawGLScene(GLvoid) // 모든 드로잉을 처리하는 곳
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); // 화면과 깊이 버퍼를 지움
glLoadIdentity(); // 현재 모델뷰 행렬을 리셋
glTranslatef(-1.5f,0.0f,-6.0f); // 왼쪽으로 1.5단위, 화면안쪽으로 6단위 이동
glBegin(GL_TRIANGLES); // 삼각형 그리기를 시작
2강에서 배웠던 내용을 기억하신다면 다음의 코드가 화면 좌측에 삼각형을
그린 다는 것을 아실 것입니다. 다음 줄은 처음으로 glColor3f(r,g,b)를
사용합니다. 괄호안에 있는 3개의 인자는 빨강, 녹색, 파랑의
명암(intensity)값입니다. 이 값의 범위는 0.0f부터 1.0f입니다. 이는
화면의 배경을 지우기 위해 사용했던 색상 값과 동일한 방법으로 작동됩니다.
여기서 사용할 색상은 빨강색 입니다(최대 빨강 명도값, 녹색 및 파랑색 값은
0.0f). 그 아래에 오는 코드는 삼각형의 첫번째 정점(삼각형의 윗부분)을
지정하고 현재 색상인 빨강색으로 이 정점을 그려라 하는 부분입니다. 다른
색상으로 바꾸기 전까지는 현재 색상으로 지정된 빨강색이 앞으로 그려지는
모든 것에 적용될것입니다.
glColor3f(1.0f,0.0f,0.0f); // 빨강색으로 설정
glVertex3f( 0.0f, 1.0f, 0.0f); // 중앙에서 1단위 위로 이동(꼭지점)
이제 화면에 첫번째 빨강 정점을 위치시켰으니 두번째 정점을 찍기전에 색을 녹색으로 바꿉니다. 왼쪽 코너 부분의 두번째 정점이 녹색이 될 것입니다.
glColor3f(0.0f,1.0f,0.0f); // 녹색으로 설정
glVertex3f(-1.0f,-1.0f, 0.0f); // 왼쪽 아래로 1단위씩 이동(왼쪽 코너 점)
이제 마지막으로 세번째 정점입니다. 이번에는 파랑색으로 사용할 것입니다.
이 정점은 삼각형은 오른쪽 코너부분입니다. glEnd() 명령어가
실행되자마자 이 폴리곤의 속이 채워질 것입니다. 그러나 각 정점의 색상이
다르기 때문에 단색으로 전체면이 칠해지지 않고, 각 코너로부터 다른
색상들이 퍼져나갈 것입니다. 이 색은 결과적으로 중앙에서 만나면 모든 색이
혼합되어 집니다. 이것을 부드러운 색칠법(smooth coloring)이라고 합니다.
glColor3f(0.0f,0.0f,1.0f); // 파랑색 으로 설정
glVertex3f( 1.0f,-1.0f, 0.0f); // 오른쪽 아래로 1단위씩 이동(오른쪽 코너점)
glEnd(); // 삼각형 그리기가 끝났음
glTranslatef(3.0f,0.0f,0.0f); // 오른쪽 점에서 오른쪽으로 3단위 이동
이제 파랑색 하나로 사각형을 칠할 차례입니다. 한 색상을 설정한 후에
그려지는 모든 것들은 바로 설정한 그 색상을 가진다는 점을 반드시
기억합시다. 앞으로 진행되는 모든 강좌들은 단색 또는 부드러운 색칠법을
사용할 것입니다. 장면에 모든것들이 텍스쳐 매핑이 된 상태라도 여전히
텍스처의 색상을 미세조정하기 위해 glColor3f를 사용합니다. 이에 대한
자세한 내용은 나중에 다루겠습니다.
따라서 사각형을 모두 한 색상으로 그리려면 색상을 한번만 선택한 뒤(여기서는 파랑색으로 선택합니다) 사각형을 그리면 됩니다. 각 정점마다 색상을 바꿔주지 않으므로 사각형의 각 정점은 파랑색만을 사용하게 될 것입니다. 마지막 결과는… 당연히… 파랑색으로 가득 채워진 사각형입니다. 다시 한번 말씀드리는데 이 사각형은 시계방향 순으로 그려지기 때문에 당연히 바라보는 곳은 이 사각형의 뒷면이 됩니다.
glColor3f(0.5f,0.5f,1.0f); // 파랑색으로 설정. 한번만 설정함
glBegin(GL_QUADS); // 사각형 그리기를 시작
glVertex3f(-1.0f, 1.0f, 0.0f); // 왼쪽 위로 1단위씩(좌상점)
glVertex3f( 1.0f, 1.0f, 0.0f); // 오른쪽 위로 1단위씩(우상점)
glVertex3f( 1.0f,-1.0f, 0.0f); // 오른쪽 아래로 1단위씩(우하점)
glVertex3f(-1.0f,-1.0f, 0.0f); // 왼쪽 아래로 한단위씩(좌하점)
glEnd(); // 사각형 그리기를 마침
return TRUE; // 계속 진행할 것
}
마지막으로 윈도우의 윗부분에 등장하는 타이틀이 제대로 나오도록 창모드 / 전체화면 모드를 토글하는 코드를 변경합니다.
if (keys[VK_F1])
{
keys[VK_F1]=FALSE;
KillGLWindow();
fullscreen=!fullscreen;
if (!CreateGLWindow("NeHe의 색상 튜토리얼",640,480,16,fullscreen))
{
return 0;
}
}
저는 본 강좌에서 OpenGL 폴리곤에 단색 색칠법 및 부드러운 색칠법을 추가하는 방법을 가능한 자세히 설명드리려고 노력했습니다. 여러분은 코드를 이리저리 변경하면서 결과물을 살펴보시길 바랍니다. 빨강, 녹색, 파랑색의 값들을 다른 숫자들로 바꿔본 뒤, 어떤 색상이 나오는지를 살펴보는 것도 좋을듯 싶습니다.
소스코드 다운로드
원문 페이지에서 소스코드를 다운로드 받으실 수 있습니다.
원문 정보
- 저자: Jeff Molofee (NeHe)
- 원문보기: Lesson 03
TOP 1% 프로그래머 테크트리 | MIT급 컴공인강 | 코딩 독학순서
야근 없이 오직 실력으로 대우받는 프로그래머가 되고 싶다고요? 최저시급도 안 되는 수업료를 내고 최고연봉을 받는 프로그래머가 되세요!