[App 개발] NeHe Lesson 13
본문
*****
새로운 강의에 잘 오셨습니다. 이번에는 비트맵 폰트를 사용하는 법을 배우겠습니다. 아마 “화면에 글자 찍기가 뭐 어려울 게 있노” 하고 말씀하실지 모르겠습니다만, 실제 해본 적이 있으신 분은 그리 쉽지 않다는 것을 알 것입니다.
물론 그림 프로그램을 열어서 이미지에 글씨를 쓰고 그것을 OpenGL에서 읽어서 블렌딩을 켜고 화면에 글씨를 입히면 됩니다. 그러나 시간이 많이 걸리고, 필터링에 따라서는 흐릿하거나 블럭지거나 하게 되고, 알파 채널이 없다면 화면에 입혀질 때에 글씨가 투명하게 되어 화면의 물체들과 섞이게 될 것입니다.
워드패드, MS워드, 기타 다른 워드프로세서를 써보셨으면 여러가지 종류의 글꼴이 준비되어 있는 것을 보셨을 것입니다. 이번 강의에서는 그와 동일한 글꼴들을 OpenGL 프로그램에서 어떻게 사용할지 배울 것입니다. 실제 컴퓨터에 설치된 모든 글꼴을 데모 프로그램에서 쓸 수 있습니다.
비트맵 폰트가 텍스쳐로 만든 그래픽 폰트보다 훨씬 보기 좋을 뿐만 아니라, 문장을 실시간으로 바꿀 수도 있습니다. 화면에 출력할 글자나 문장들을 하나 하나 만들어 둘 필요가 없습니다. 문장의 위치를 잡고 우리가 만들 간편한 gl 명령어를 이용하여 화면에 문장을 출력하면 됩니다.
명령어를 될 수 있으면 간단하게 만들어서 glPrint(“Hello”)만 치면 되도록 했습니다. 아주 쉽죠. 어쨌든, 서론이 긴 만큼 제가 이 강좌를 기쁘게 생각한다는 것을 생각해 주시면 좋겠습니다. 이 프로그램을 만드는데 한 시간 반 가량 걸렸습니다. 뭐 그렇게 오래? 왜냐하면 MFC코드를 쓰지 않고 비트맵 폰트를 다루는 방법에 대해서 나온 문헌이 없기 때문입니다. 프로그램을 간단하게 만들기 위해서 이해하기 쉬운 C 코드로 프로그램을 짜는 것이 좋겠다고 결정했습니다. :)
잠깐, 이 코드는 윈도우 전용입니다. 폰트를 만들기 위해서 윈도우 전용 wgl 함수들을 사용했습니다. 애플에서는 동일한 기능을 가진 agl 함수가 있고, X 에서는 glx 함수들이 있습니다. 이 프로그램이 그대로 적용 가능한지는 모르겠습니다. 만일 누구라도 화면에 폰트를 출력하는 공용 코드가 있으시면 제게 보내주십시오. 다른 폰트 강의를 만들어 보겠습니다.
Lesson 1의 일반 코드에서부터 시작하겠습니다. stdio.h 헤더의 기본 입출력 기능을 포함시키겠습니다. stdarg.h 헤더 파일은 문장을 나누고 변수를 문자로 바꾸는 일을 합니다. math.h 헤더 파일은 sin 과 cos 함수로 화면에서 글씨를 움직이게 할 때 사용합니다.
#include
#include
#include
#include
#include
#include
#include
HDC hDC=NULL;
HGLRC hRC=NULL;
HWND hWnd=NULL;
HINSTANCE hInstance;
이와 함께 3개의 새로운 변수를 선언합니다. base는 우리가 만들 첫 번째 출력 리스트의 번호입니다. 각각의 글자들이 따로 출력 리스트를 갖습니다. 글자 A는 출력 리스트의 65번째, B는 66번째, C는 67번째 등등입니다. 따라서 A는 출력 리스트 base+65에 저장됩니다.
다음에 두 개의 카운터 cnt1과 cnt2를 선언합니다. 각각 다른 비율로 증가를 하며, sin과 cos를 이용하여 화면에서 문자들을 움직일 때 사용합니다. 이렇게 하면 거의 무작위로 화면을 움직이는 것처럼 보이게 됩니다. 그리고 글자의 색상을 조절하는 카운터를 하나 더 사용할 것입니다. 나중에 설명하겠습니다.
GLuint base;
GLfloat cnt1;
GLfloat cnt2;
bool keys[256];
bool active=TRUE;
bool fullscreen=TRUE;
다음의 코드들은 실제 글꼴을 만드는 과정입니다. 가장 중요한 부분입니다. HFONT font 는 이제 윈도우 폰트를 조작할 것을 윈도우 시스템에게 알려줍니다. oldfont는 옛날 폰트를 저장할 때 쓰입니다.
그 다음에는 base를 정의합니다. glGenLists(96)함수를 호출하여 96개의 출력 리스트를 만듭니다. 출력 리스트가 만들어진 다음 base 변수에는 첫 번째 리스트의 번호가 저장됩니다.
GLvoid BuildFont(GLvoid) // 비트맵 폰트를 만든다
{
HFONT font;
HFONT oldfont;
base = glGenLists(96); // 96 개 글자를 저장한다
이제 재미있는 부분입니다. 이제 우리 글꼴을 만들 것입니다. 먼저 글꼴의 크기를 지정하는데, 음수라는 것에 주목해 주십시오. 이렇게 하면 윈도우 시스템은 이것을 글꼴의 높이로 간주하고 만들게 됩니다. 만약 이것을 양수로 입력하면 폰트를 픽셀 단위의 높이로 만들게 됩니다.
font = CreateFont( -24, // 글꼴의 높이
이제 글꼴의 넓이입니다. 0으로 입력했습니다. 이렇게 하면 윈도우 시스템의 기본값을 이용하게 됩니다. 원하는대로 값을 변경해서 글꼴을 크게 만들거나 해 보셔도 좋습니다.
0, // 글꼴의 넓이
활자 각도는 글꼴을 회전시킵니다. 별로 좋은 기능은 아닙니다. 0도, 90도, 180도, 270도가 아닌 경우에는 보통 글꼴은 사각형 경계 바깥으로 나간 부분은 잘려서 보이지 않게 됩니다. 기본 각도는 MSDN에서는 글자의 기본선과 출력장치의 x축과의 각도를 degree로 지정하는 값이라고 설명되어 있습니다만, 무슨 뜻인지는 잘 모르겠습니다. :(
0, // 활자 각도
0, // 기본 각도
글꼴 두께는 유용한 인수입니다. 0부터 1000까지의 값이나 이미 선언된 값을 넣을 수 있습니다. FW_DONTCARE는 0, FW_NORMAL은 400, FW_BOLD는 700, FW_BLACK은 900DLQSLEK. 그 외에도 많은 선언값들이 있지만 위의 네 가지면 다양하게 쓸 수 있습니다. 큰 값일 수록 글꼴이 두꺼워집니다.
FW_BOLD, // 글꼴 두께
이탤릭, 밑줄, 삭제줄 인수는 TRUE나 FALSE로 지정합니다. 간단하게 만약 밑줄 항목이 TRUE면 글꼴에 밑줄이 쳐지고, FALSE이면 안 쳐집니다. 간단하죠.
FALSE, // 이탤릭
FALSE, // 밑줄
FALSE, // 삭제줄
글자 세트 선택 인수는 사용할 글자의 종류를 표현하는데, 엄청 많은 종류가 있습니다. CHINESEBIG5_CHARSET, GREEK_CHARSET, RUSSIAN_CHARSET, DEFAULT_CHARSET, 등입니다. 우리가 쓸 것은 ANSI 인데, 사실 DEFAULT 라고 써도 동일한 결과입니다.
만약에 Webdings나 Wingdings같은 글꼴을 쓰고 싶다면 ANSI_CHARSET대신에 SYMBOL_CHARSET을 사용해야 합니다.
ANSI_CHARSET, // 글자 세트 선택
출력 정확도 인수는 아주 중요합니다. 만약 여러 개의 글꼴이 있을 때 어떤 것을 선택할 지를 결정하는 값입니다. OUT_TT_PRECIS는 만약에 동일한 이름의 글꼴이 있을 때 트루타입 글꼴을 선택하게끔 합니다. 트루타입 글꼴은 특히 크기를 늘이거나 할 때 더 보기 좋습니다. OUT_TT_ONLY_PRECIS로 해서 항상 트루타입 글꼴을 이용하도록 할 수도 있습니다.
OUT_TT_PRECIS, // 출력 정확도
클리핑 정확도는 글꼴이 클리핑 영역 바깥으로 나갔을 때의 처리하는 방식을 지정합니다. 별로 특별한 것은 없고 기본값으로 남겨두겠습니다.
CLIP_DEFAULT_PRECIS, // 클리핑 정확도
출력 품질은 중요합니다. PROOF, DRAFT, NONANTIALIASED, DEFAULT, ANTIALIASED중에서 선택할 수 있습니다. ANTIALIASED 글꼴이 보기 좋죠. 이것은 윈도우의 부드러운 글꼴 기능을 켰을 때 보는 것과 같은 효과입니다.
ANTIALIASED_QUALITY, // 출력 품질
다음은 Family와 Pitch 설정입니다. Pitch 에는 DEFAULT_PITCH, FIXED_PITCH, VARIABLE_PITCH가 있고, Family 에는 FF_DECORATIVE, FF_MODERN, FF_ROMAN, FF_SCRIPT, FF_SWISS, FF_DONTCARE가 있습니다. 바꿔보시고 어떤 역할을 하는지 확인해 보십시오. 저는 일단 모두 기본값으로 놓겠습니다.
FF_DONTCARE|DEFAULT_PITCH, // Family 와 Pitch
마지막으로 폰트의 실제 이름을 지정합니다. MS워드나 다른 문서편집기를 열어서 글꼴 메뉴를 열고 좋아하는 글꼴 이름을 찾아내십시오. 글꼴을 찾으셨으면 CourierNew 를 원하는 글꼴의 이름으로 바꿔 넣으십시오.
"Courier New"); // 글꼴 이름
oldfont 는 바로 전에 썼던 글꼴을 저장합니다. SelectObject 함수는 새로운 글꼴(펜, 필터 등의 모든 GDI 객체)이 교체될 때 이전에 쓰던 글꼴(동일한 GDI 객체)을 리턴합니다. 이렇게 동작하기 때문에 SelectObject의 리턴값을 이용하는 것은 아주 명확한 방법은 아닙니다. 보시는 코드에서는 새 글꼴 font를 선택하면서 리턴되는 포인터를 oldFont에 저장하는 모습입니다.
oldfont = (HFONT)SelectObject(hDC, font); // 원하는 글꼴을 선택
wglUseFontBitmaps(hDC, 32, 96, base); // 글자 번호 32부터 96개를 만든다
SelectObject(hDC, oldfont); // 옛날 글꼴을 다시 선택한다
DeleteObject(font); // 글꼴을 지운다
}
다음 코드는 아주 간단합니다. base로부터 시작되는 출력 리스트 96개를 메모에서 지웁니다. 윈도우가 자동적으로 이 일을 해주는지 확실치 않습니다만 잘못되는 것보다는 확실한 쪽이 좋겠죠.
GLvoid KillFont(GLvoid) // 글꼴 리스트를 지운다
{
glDeleteLists(base, 96); // 96개 리스트를 몽땅 지운다
}
이번에는 제가 만든 아주 유용한 문자 루틴입니다. glPrint(“원하는 문자열”)함수로 호출하시면 됩니다. 문자들은 문자열 *fmt에 저장됩니다.
GLvoid glPrint(const char *fmt, ...) // 사제 "Print" 루틴
{
첫 번째 줄은 256개의 문자열을 저장할 장소를 마련합니다. text는 화면에 출력할 문자열입니다. 두 번째 줄은 문자열과 함께 전달되는 인수들의 포인터의 선언입니다. 문자열과 함께 보내어지는 인수들은 모두 여기에 들어있습니다.
char text[256]; // 문자열을 저장한다
va_list ap; // 나머지 인수들의 포인터
다음의 두 줄은 출력할 문자열이 실제로 있는지를 검사합니다. 전달된 글자가 없다면 fmt의 값은 NULL이고 따라서 화면에 아무것도 출력되지 않습니다.
if (fmt == NULL) // 글자가 없냐?
return; // 일없다
다음의 세 줄은 문자열 내의 특수 문자들을 그것이 표현하는 실제 숫자로 변환합니다. 문자열과 변형된 특수 문자들은 text라는 문자열에 저장됩니다. 특수 문자들에 대해서는 밑에 설명하겠습니다.
va_start(ap, fmt); // 변수들을 출력하기 위하여 문자열을 분해한다
vsprintf(text, fmt, ap); // 특수 문자를 실제 숫자로 변환한다
va_end(ap); // 결과는 text에 저장된다
그 다음에 GL_LIST_BIT을 호출하여 프로그램에서 사용할 다른 출력 리스트에 의하여 glListBase 가 손상되지 않도록 합니다.
glListBase(base-32) 명령은 설명하기 약간 까다롭습니다. 글자 A 를 출력한다고 합시다. 이 글자는 숫자 65 에 해당됩니다. glListBase(base-32) 명령이 없다면 OpenGL은 이 글자를 어디서 찾아야 될 지 모르게 됩니다. 아마 출력 리스트 65번째를 찾고 있겠지요. 그러나 만일 base가 1000이었다면 A 가 저장되어 있는 곳은 실제로 1065가 됩니다. 따라서 기본 시작 번호를 지정함으로써 OpenGL은 정확한 출력 리스트의 장소를 구할 수 있게 됩니다. 숫자 32를 뺀 이유는 우리가 처음 32개의 글자에 대한 출력 리스트를 만들지 않았기 때문입니다. (Ctrl+a와 같은 문자이므로 역자주) 따라서 기본 값에서 32를 뺀 값을 OpenGL에게 알려주어야 합니다. 이해가 되셨기를 바랍니다.
glPushAttrib(GL_LIST_BIT); // GL_LIST_BIT를 넣는다
glListBase(base - 32); // base에서 컨트롤 문자 32를 빼서 기본값을 정한다
이제 OpenGL은 글자가 어디 위치해 있는지 알게 되었으므로 화면에 출력할 수 있게 되었습니다. glCallLists함수는 아주 재미있는 명령입니다. 한꺼번에 여러 개의 출력 리스트를 화면에 출력하는 능력이 있습니다.
밑에 있는 코드는 다음과 같습니다. 먼저 화면에 리스트를 출력한다는 것을 OpenGL에게 알립니다. strlen(text)함수는 화면에 얼마나 많은 글자를 출력할지를 알아냅니다. 그리고 출력될 글자의 최대 갯수가 얼마인지를 알아야 합니다. 여기서는 255글자 이상 보낼 수 없습니다. 리스트의 인수는 부호 없는 바이트 형태의 데이타이기 때문에 각각은 0부터 255까지의 범위를 갖습니다. 마지막으로 화면에 출력할 문자열의 포인터를 보냅니다.
여러분은 혹시 이렇게 하면 글자들이 계속 그 위에 쌓여 올라가지 않을까 생각하실지도 모르겠습니다. 그러나 각 글자의 출력 리스트는 글자의 오른쪽이 어디인지 알고 있어서 OpenGL은 글자를 그리고 난 다음 그 글자의 오른쪽 끝으로 translate할 수 있습니다. (영어를 쓰고 싶지 않았는데… ㅡㅜ;) 따라서 다음 글자나 물체는 OpenGL이 translate한 마지막 장소, 글자의 오른쪽에서부터 그려지기 시작하게 됩니다.
마지막으로 GL_LIST_BIT을 꺼내어 우리가 glListBase(base-32)로 지정했던 기본값을 원래대로 되돌려 놓습니다.
glCallLists(strlen(text), GL_UNSIGNED_BYTE, text); // 출력 리스트 글자를 그린다
glPopAttrib(); // GL_LIST_BIT을 꺼낸다
}
초기화 코드에서 달라진 것은 BuildFont()함수 호출 뿐입니다. 이것은 위에 설명했던 코드로 가서 글꼴을 만들어 두어서 이후에 OpenGL이 쓸 수 있도록 하는 것입니다.
int InitGL(GLvoid)
{
glShadeModel(GL_SMOOTH);
glClearColor(0.0f, 0.0f, 0.0f, 0.5f);
glClearDepth(1.0f);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LEQUAL);
glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST);
BuildFont(); // 폰트를 만든다
return TRUE;
}
이제 그리기 코드입니다. 먼저 화면을 지우고 depth buffer를 초기화하는 것으로 시작합니다. glLoadIdentity()함수를 호출하면 모든 것이 초기화됩니다. 그 다음 화면 안쪽으로 한 유닛 이동합니다. 그렇게 하지 않으면 글자가 보이지 않게 됩니다. 비트맵 글꼴은 투시도법(perspective)보다는 정사영법(orthographic)이 더 잘 동작하지만 보기에는 좋지 않기 때문에 여기서는 그대로 투시도법으로 하고 이동하겠습니다.
여러분은 화면 안쪽으로 더 깊숙히 이동하더라도 글자의 크기가 우리가 생각한 것만큼 줄어들지 않는다는 것을 발견하실 것입니다. 실제로 화면 깊숙히 이동하게 되면 글자를 화면에 출력할 수 있는 제어권을 더 많이 갖게 되는 효과가 있습니다. 만일 화면 안쪽으로 1유닛 이동하면 여러분은 글자를 x축으로 -0.5 ~ +0.5 의 사이에 놓을 수 있고, 만약 10유닛을 이동하게 되면 글자를 -5 ~ 5 의 사이에 놓을 수 있습니다. 글자가 놓일 위치를 지정하는 대신 더 많은 제어권을 갖는 것이고 글자의 크기가 변하지는 않습니다. glScalef(x,y,z)함수도 안 먹힙니다. 만약에 글자를 크게 혹은 작게 만들고 싶으시다면 처음 만들 적에 크게 혹은 작게 만드셔야 합니다.
int DrawGLScene(GLvoid)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glTranslatef(0.0f,0.0f,-1.0f);
이제 약간의 산수를 이용하여 색상 파장을 만들어 보겠습니다. 뭐하는 것인지 이해 못하시겠더라도 염려 마십시오. 저는 재미있는 결과를 만들기 위해서 여러 가지 변수들과 트릭을 쓰는 것을 좋아합니다.
지금은 두 개의 카운터를 이용해서 화면을 움직이는 글자의 빨간색, 녹색, 파란색을 바꿀 것입니다. 빨간색은 -1.0부터 1.0 범위의 값을 cos함수와 카운터 1을 가지고 만들고, 녹색은 -1.0부터 1.0범위의 값을 sin함수와 count 2로, 파란색은 0.5부터 1.5까지의 값을 cos함수로 카운터 1과 2를 이용해서 만듭니다. 이 경우 파란색은 0이 되지 않게 되고 글자색이 절대로 투명해지는 일은 없습니다. 바보같지만 동작은 됩니다.
// 글자의 위치에 따라서 색상 파장을 만든다
glColor3f(1.0f*float(cos(cnt1)),1.0f*float(sin(cnt2)),1.0f-0.5f*float(cos(cnt1+cnt2)));
새로운 명령 glRasterPos2f(x,y)는 비트맵 글꼴을 화면에 출력합니다. 화면의 중앙은 0.0입니다. 비트맵 글꼴은 z값은 없고 x축 (왼쪽 오른쪽)과 y축 (위 아래)만 이용합니다. 왜냐하면 우리는 화면 안쪽으로 1유닛 이동했기 때문에 왼쪽 맨 끝이 -0.5, 오른쪽 맨 끝은 +0.5가 되었기 때문입니다. 제가 X축에서 왼쪽으로 0.45픽셀 이동한 것을 보십시오. 이것은 문자열이 화면 한 가운데에 놓이게 하기 위함입니다. 그러지 않으면 글자를 중앙에서부터 오른쪽으로 써 나갈 것이기 때문에 전체 문자열이 오른쪽에 놓이게 됩니다.
색상 설정을 할 때와 거의 비슷한 산수가 이용되고 있습니다. 문자열을 x축에서 -0.50 부터 -0.40만큼 움직입니다. 우리는 지금 시작할 때 0.45 를 뺀 값을 쓴다는 것을 기억해 주세요. 이렇게 하면 문자열은 항상 화면에 보이게 됩니다. 이 산수는 문자열을 왼쪽 오른쪽으로 cos 함수로 카운터 1을 이용해서 흔들어 줍니다. 그리고 y축으로는 -0.35부터 0.35만큼 sin함수와 카운터 2를 이용해서 움직입니다.
// 문자열의 화면 배치
glRasterPos2f(-0.45f+0.05f*float(cos(cnt1)), 0.35f*float(sin(cnt2)));
이제 제가 제일 좋아하는 실제 문자열을 화면에 그리는 부분입니다. 저는 이것을 아주 쉽고 유저 친화적으로 만들었습니다. 보시면 거의 OpenGL 함수와 친숙한 print 명령의 조합같이 보이죠. 화면에 글자를 쓰려면 간단히 glPrint( "{아무 글자나 넣으세요}") 라고 하면 됩니다. 아주 쉽죠. 문자열은 우리가 원하는 화면 위치에 그려지게 될 것입니다.
Shawn T. 가 화면에 변수값을 전달할 수 있도록 변경된 코드를 보내주었습니다. 따라서 카운터 값을 증가시킨 결과를 화면에 출력할 수 있습니다. 그리고 이렇게 잘 됩니다. 밑에 보시면 보통 문자열이 있고 빈 공간 다음에 - 가 있고 다시 공간 하나, 그 다음에 심볼 (%7.2f)가 있습니다. 이게 뭔 것이냐고 생각하실지도 모르겠네요. 간단합니다. %는 7.2f를 화면에 표시하지 말라는 뜻입니다. 왜냐하면 이것은 변수를 표현하려는 것이기 때문입니다. 7은 소숫점 위 최대 일곱 자리 숫자를 인쇄한다는 뜻이고, 오른쪽에 있는 2는 소숫점 오른쪽으로 두 자리를 표현하겠다는 뜻입니다. 마지막으로 f는 우리가 표현하려는 숫자가 부동소숫점이라는 뜻입니다. 우리는 cnt1의 값을 화면에 출력할 것입니다. 예를 들어 만일 cnt1의 값이 300.12345f 였다면 화면에 출력되어 우리가 보는 숫자는 300.12입니다. 우리는 소숫점 오른쪽으로 두 자리만을 처리할 것이라고 했기 때문에 소숫점 오른쪽의 3, 4, 5는 잘려나갑니다.
숙련된 C 프로그래머에게는 아주 기본적인 내용이지만, 어쩌면 이 글을 읽으시는 분 중에 printf를 전혀 써보신 적이 없는 분도 계실지 모릅니다. 이런 특수 부호에 대해 더 자세히 알고 싶으시면 책을 사 보시거나, MSDN을 참조해 보세요. (Apple Developer Forum도 있습니다. ^^)
glPrint("Active OpenGL Text With NeHe - %7.2f", cnt1); // GL 문자열을 화면에 출력한다
마지막으로 할 일은 카운터 두 개의 값을 다른 비율로 증가시켜 색상 펄스와 문자열의 움직임을 만드는 일입니다.
cnt1+=0.051f; // 첫 번째 카운터 증가
cnt2+=0.005f; // 두 번째 카운터 증가
return TRUE;
}
마지막으로 할 일은 KillFont()함수를 KillGLWindow() 밑에 아래 보시는 대로 넣는 일입니다. 프로그램을 종료하기 전에 모든 것을 정리해주기 때문에 이렇게 하는 것이 중요합니다.
if (!UnregisterClass("OpenGL",hInstance))
{
MessageBox(NULL,"Could Not Unregister Class.","SHUTDOWN ERROR",MB_OK | MB_ICONINFORMATION);
hInstance=NULL;
}
KillFont(); // 폰트를 없앤다
}
최신글이 없습니다.
최신글이 없습니다.
댓글목록 0