主题:[原创]OpenGL入门学习——第十六课
eastcowboy
[专家分:25370] 发布于 2008-05-05 14:24:00
现在即将放出的是第十六课的内容。
首先还是以前课程的连接:
[url=http://www.programfan.com/club/showbbs.asp?id=184355]第一课,编写第一个OpenGL程序[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=184525]第二课,绘制几何图形[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=184769]第三课,绘制几何图形的一些细节问题[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=185032]第四课,颜色的选择[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=196017]第五课,三维的空间变换[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=196231]第六课,动画的制作[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=218828]第七课,使用光照来表现立体感[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=219518]第八课,使用显示列表[/url]
[url=http://www.programfan.com/club/showbbs.asp?id=224877]第九课,使用混合来实现半透明效果[/url]
[url=http://www.programfan.com/club/post-227694.html]第十课,BMP文件与像素操作[/url]
[url=http://www.programfan.com/club/post-244703.html]第十一课,纹理的使用入门[/url]
[url=http://bbs.pfan.cn/post-252901.html]第十二课,OpenGL片断测试[/url]
[url=http://bbs.pfan.cn/post-275218.html]第十三课,OpenGL是一个状态机[/url]
[url=http://bbs.pfan.cn/post-275219.html]第十四课,OpenGL版本和OpenGL扩展[/url]
[url=http://bbs.pfan.cn/post-275223.html]第十五课,从“绘制一个立方体”来看OpenGL的进化过程[/url]
第十六课,在Windows系统中显示文字 ——→ [color=0000FF]本次课程的内容[/color]
内容超多的一课!不过我想精彩的程度也一定不会让大家失望。大家不妨先浏览一下课程里的图片:)。
[color=FF0000]2008-06-10 修改了附件[/color]
增加了两个文件,showline.c, showtext.c。分别为第二个和第三个示例程序的main函数相关部分。
在ctbuf.h和textarea.h最开头部分增加了一句#include <stdlib.h>
附件中一共有三个示例程序:
第一个,飘动的“曹”字旗。代码为:flag.c, GLee.c, GLee.h
第二个,带缓冲的显示文字。代码为:showline.c, ctbuf.c, ctbuf.h, GLee.c, GLee.h
第三个,显示歌词。代码为:showtext.c, ctbuf.c, ctbuf.h, textarea.c, textarea.h, GLee.c, GLee.h
其中,GLee.h和GLee.c可以[url=http://www.opengl.org/sdk/libs/GLee/GLee5_21.zip]从网上下载[/url],因此这里并没有放到附件中。在编译的时候应该将这两个文件和其它代码文件一起编译。
=====================未完,请勿跟帖=====================
最后更新于:2008-06-10 15:57:00
回复列表 (共106个回复)
11 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:14:00
因为要使用光照,法线向量是不可少的。这里我们通过不共线的三个点来得到三个点所在平面的法线向量。
从数学的角度看,原理很简单。三个点v1, v2, v3,可以用v2减v1,v3减v1,得到从v1到v2和从v1到v3的向量s1和s2。然后向量s1和s2进行叉乘,得到垂直于s1和s2所在平面的向量,即法线向量。
为了方便使用,应该把法线向量缩放至单位长度,这个也很简单,计算向量的模,然后向量的每个分量都除以这个模即可。
[code=c]#include <math.h>
// 设置法线向量
// 三个不在同一直线上的点可以确定一个平面
// 先计算这个平面的法线向量,然后指定到OpenGL
void setNormal(const GLfloat v1[3],
const GLfloat v2[3],
const GLfloat v3[3]) {
// 首先根据三个点坐标,相减计算出两个向量
const GLfloat s1[] = {
v2[0]-v1[0], v2[1]-v1[1], v2[2]-v1[2]};
const GLfloat s2[] = {
v3[0]-v1[0], v3[1]-v1[1], v3[2]-v1[2]};
// 两个向量叉乘得到法线向量的方向
GLfloat n[] = {
s1[1]*s2[2] - s1[2]*s2[1],
s1[2]*s2[0] - s1[0]*s2[2],
s1[0]*s2[1] - s1[1]*s2[0]
};
// 把法线向量缩放至单位长度
GLfloat abs = sqrt(n[0]*n[0] + n[1]*n[1] + n[2]*n[2]);
n[0] /= abs;
n[1] /= abs;
n[2] /= abs;
// 指定到OpenGL
glNormal3fv(n);
}[/code]
=====================未完,请勿跟帖=====================
12 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:28:00
好的,飘动的旗帜已经做好,现在来看最后的步骤,将纹理贴到旗帜上。
细心的朋友可能会想到这样一个问题:明明绘制文字的时候使用的是白色,放到纹理中也是白色,那个“曹”字是如何显示为黄色的呢?
这就要说到纹理的使用方法了。大家在看了第十一课“纹理的使用入门”以后,难免认为纹理就是用一幅图片上的像素颜色来替换原来的颜色。其实这只是纹理最简单的一种用法,它还可以有其它更复杂但是实用的用法。
这里我们必须提到一个函数:glTexEnv*。从OpenGL 1.0到OpenGL 1.5,每个OpenGL版本都对这个函数进行了修改,如今它的功能已经变的非常强大(但同时也非常复杂,如果要全部讲解,只怕又要花费一整课的篇幅了)。
最简单的用法就是:
[code=c]glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);
[/code]
它指定纹理的使用方式为“代替”,即用纹理中的颜色代替原来的颜色。
我们这里使用另一种用法:
[code=c]GLfloat color[] = {1.0f, 1.0f, 0.0f, 1.0f};
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_BLEND);
glTexEnvfv(GL_TEXTURE_ENV, GL_TEXTURE_ENV_COLOR, color);[/code]
其中第二行指定纹理的使用方式为“混合”,它与OpenGL的混合功能类似,但源因子和目标因子是固定的,无法手工指定。最终产生的颜色为:纹理的颜色*常量颜色 + (1.0-纹理颜色)*原来的颜色。常量颜色是由第三行代码指定为黄色。
因为我们的纹理里面装的是文字,只有黑、白两种颜色。如果纹理中某个位置是黑色,套用上面的公式,发现结果就是原来的颜色,没有变化;如果纹理中某个位置是白色,套用上面的公式,发现结果就是常量颜色。所以,文字的颜色就由常量颜色决定。我们指定常量颜色,也就指定了文字的颜色。
主要的知识就是这些了,结合前面课程讲过的视图变换(设置观察点)、光照(设置光源、材质),以及动画,飘动的旗帜就算制作完成。
呵呵,代码已经比较庞大了,限于篇幅,完整的版本这里就不发上来了,不过附件里面有一份源代码[color=0000FF]flag.c[/color]。
=====================未完,请勿跟帖=====================
13 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:29:00
[color=FF0000]缓冲机制[/color]
走出做完旗帜的喜悦后,让我们回到二维文字的问题上来。
前面说到因为汉字的数目众多,无法在初始化时就为每个汉字都产生一个显示列表。不过,如果每次显示汉字时都重新产生显示列表,效率上也说不过去。一个好的办法就是,把经常使用的汉字的显示列表保存起来,当需要显示汉字时,如果这个汉字的显示列表已经保存,则不再需要重新产生。如果有很多的汉字都需要产生显示列表,占用容量过多,则删除一部分最近没有使用的显示列表,以便释放出一些空间来容纳新的显示列表。
学过操作系统原理的朋友应该想起来了,没错,这与内存置换的算法是一样的。内存速度快但是容量小,硬盘(虚拟内存)速度慢但是容量大,需要找到一种机制,使性能尽可能的达到最高。这就是内存置换算法。
常见的内存置换算法有好几种,这里我们选择一种简单的。那就是随机选择一个显示列表并且删除,空出一个位置用来装新的显示列表。
还要说一下,我们不再直接用显示列表来显示汉字了,改用纹理。因为纹理更加灵活,而且根据实验,纹理比显示列表更快。一个显示列表只能保存一个字符,但是纹理只要足够大,则可以保存很多的字符。假设字符的高度是32,则宽度不超过32,如果纹理是256*256的话,就可以保存8行8列,总共64个汉字。
我们要做的功能:
1. 缓冲机制的初始化
2. 缓冲机制的退出
3. 根据一个文字字符,返回对应的纹理坐标。如果字符本身不在纹理中,则应该先把字符加入到纹理中(如果纹理已经装不下了,则先删除一个),然后返回纹理坐标。
要改进缓冲机制的性能,则应该使用更高效的置换算法,不过这个已经远超出OpenGL的范围了。大家如果有空也可以看看linux源码什么的,应该会找到好的置换算法。
即使我们使用最简单的置换算法,完整的代码仍然有将近200行,其实这些都是算法基本功了,跟OpenGL关系并不太大。仍然是由于篇幅限制,仅在附件中给出,就不贴在这里了。文件名为ctbuf.h和ctbuf.c,在使用的时候把这两个文件都加入到工程中,并调用ctbuf.h中声明的函数即可。
这里我们仅仅给出调用部分的代码。
[code=c]#include "ctbuf.h"
void display(void) {
static int isFirstCall = 1;
if( isFirstCall ) {
isFirstCall = 0;
ctbuf_init(32, 256, "黑体");
}
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glEnable(GL_TEXTURE_2D);
glPushMatrix();
glTranslatef(-1.0f, 0.0f, 0.0f);
ctbuf_drawString("美好明天就要到来", 0.1f, 0.15f);
glTranslatef(0.0f, -0.15f, 0.0f);
ctbuf_drawString("Best is yet to come", 0.1f, 0.15f);
glPopMatrix();
glutSwapBuffers();
}[/code]
[img]http://blog.programfan.com/upfile/200805/20080505132715.gif[/img]
注意这里我们是用纹理来实现字符显示的,因此文字的大小会随着窗口大小而变化。最初的Hello, World程序就不会有这样的效果,因为它的字体硬性的规定了大小,不如纹理来得灵活。
=====================未完,请勿跟帖=====================
14 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:32:00
[code=c]显示大段的文字[/code]
有了缓冲机制,显示文字的速度会比没有缓冲时快很多,这样我们也可以考虑显示大段的文字了。
基本上,前面的ctbuf_drawString函数已经可以快速的显示一个较长的字符串,但是它有两个缺点。
第一个缺点是不会换行,一直横向显示到底。
第二个缺点是即使字符在屏幕以外,也会尝试在缓冲中查找这个字符,如果没找到,还会重新生成这个字符。
让我们先来看看第一个问题,换行。所谓换行其实就是把光标移动到下一行的开头,如果知道每一行开头的位置的话,只需要很短的代码就可以实现。
不过,OpenGL显示文字的时候并不会保存每一行开头的位置,所以这个需要我们自己动手来做。
第二个问题是关于性能的,如果字符本身不会显示出来,那么为它产生显示列表和纹理就是一种浪费,如果为了容纳它的显示列表或者纹理,而把缓冲区中其它有用的字符的显示列表或者纹理给删除了,那就更加得不偿失。
所以,判断字符是否会显示也是很重要的。像我们的浏览器,如果显示一个巨大的网页,其实它也只绘制最必要的部分。
为了解决上面两个问题,我们再单独的编写一个模块。初始化的时候指定显示区域的大小、每行多少个字符、每列多少个字符,在模块内部判断是否需要换行,以及判断每个文字是否真的需要显示。
呃,小小的感慨一下,为什么每当我做好一份代码,就发现它实在太长,长到我不想贴出来呢?唉……
先看看图:
[img]http://blog.programfan.com/upfile/200805/20080505132721.gif[/img]
注意观察就可以发现,歌词分为多行,只有必要的行才会显示,不会从头到尾的显示出来。
代码中主要是算法和C语言基本功,跟OpenGL关系并不大。还是照旧,把主要的代码放到附件里,文件名为textarea.h和textarea.c,使用时要与前面的ctbuf.h和ctbuf.c一起使用。
这里仅给出调用部分的代码。
[code=c]const char* g_string =
"《合金装备》(Metal Gear Solid)结尾曲歌词\n"
// 歌词很多很长
"因为。。。。。。。。 \n"
"美好即将到来\n";
textarea_t* p_textarea = NULL;
void display(void) {
static int isFirstCall = 1;
if( isFirstCall ) {
isFirstCall = 0;
ctbuf_init(24, 256, "隶书");
p_textarea = ta_create(-0.7f, -0.5f, 0.7f, 0.5f,
20, 10, g_string);
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);
}
glClear(GL_COLOR_BUFFER_BIT);
// 显示歌词文字
glEnable(GL_TEXTURE_2D);
ta_display(p_textarea);
// 用半透明的效果显示一个方框
// 这个框是实际需要显示的范围
glEnable(GL_BLEND);
glDisable(GL_TEXTURE_2D);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glColor4f(1.0f, 1.0f, 1.0f, 0.5f);
glRectf(-0.7f, -0.5f, 0.7f, 0.5f);
glDisable(GL_BLEND);
// 显示一些帮助信息
glEnable(GL_TEXTURE_2D);
glPushMatrix();
glTranslatef(-1.0f, 0.9f, 0.0f);
ctbuf_drawString("歌词显示程序", 0.1f, 0.1f);
glTranslatef(0.0f, -0.1f, 0.0f);
ctbuf_drawString("按W/S键实现上、下翻页", 0.1f, 0.1f);
glTranslatef(0.0f, -0.1f, 0.0f);
ctbuf_drawString("按ESC退出", 0.1f, 0.1f);
glPopMatrix();
glutSwapBuffers();
}[/code]
=====================未完,请勿跟帖=====================
15 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:34:00
[color=FF0000]轮廓字体[/color]
其实上面我们所讲那么多,只讲了一类字体,即像素字体,此外还有轮廓字体。所以,这个看似已经很长的课程,其实只讲了“显示文字”这个课题的一半。估计大家已经看不下去了,其实我也写不下去了。好长……
那么,本课就到这里吧。有种虎头蛇尾的感觉:(
=====================未完,请勿跟帖=====================
16 楼
eastcowboy [专家分:25370] 发布于 2008-05-05 16:35:00
小结
本课的内容不可谓不多。列表如下:
1. 以Hello, World开始,说明英文字符(ASCII字符)是如何绘制的。
2. 给出了一个设置字体的函数selectFont。
3. 讲了如何显示中文字符。
4. 讲了如何把字符保存到纹理中。
5. 给出了一个大的例子,绘制一面“曹”字旗。(附件flag.c)
6. 讲解了缓冲机制,其实跟内存的置换算法原理是一样的。我们给出了一个最简单的缓冲实现,采用随机的置换算法。(做成了模块,附件ctbuf.h,ctbuf.c,调用的例子在本课正文中可以找到)
7. 通过缓冲机制,实现显示大段的文字。主要是注意换行的处理,还有就是只显示必要的行。(做成了模块,附件textarea.h,textarea.c,调用的例子在本课正文中可以找到)
最后两个模块虽然是以附件形式给出的,但是原理我想我已经说清楚了,并且这些内容跟OpenGL关系并不大,主要还是相关专业的知识,或者C语言基本功。主要是让大家弄清楚原理,附件代码只是作为参考用。
说说我的感受:显示文字很简单,显示文字很复杂。除了最基本的显示列表、纹理等OpenGL常识外,更多的会涉及到数学、数据结构与算法、操作系统等各个领域。一个大型的程序通常都要实现一些文字特殊效果,仅仅是调用几个显示列表当然是不行的,需要大量的相关知识来支撑。
本课的门槛突然提高,搞得我都不知道这还算不算是“入门教程”了,希望各位不要退缩哦。祝大家愉快。
===================== 第十六课 完 =====================
=====================TO BE CONTINUED=====================
17 楼
eastcowboy [专家分:25370] 发布于 2008-05-06 12:57:00
呵,直接就沉掉了。
顶一下。
18 楼
xiaoc10 [专家分:0] 发布于 2008-05-10 11:42:00
帮顶一下。。[em1]
19 楼
lxslove [专家分:190] 发布于 2008-05-18 23:10:00
我也顶!强烈支持楼主,楼主辛苦啦!向你致以强烈的敬意!从第一课到十六课我都有看,非常感谢楼主的辛勤付出!!!
20 楼
ooucj [专家分:0] 发布于 2008-05-20 10:54:00
新人帮顶了~
为了你的大片OpenGL入门学习,我还专门注册了呢。
终于被我搜到了~
保存你所有贴~
呵呵
祝福你平安度过地震~~
我来回复