📄 tutorial_20.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head><!-- 这篇文章由Dancingwind翻译，作者的联系方式zhouwei02@mails.tsinghua.edu.cn --><title>NeHe OpenGL教程第二十课，DancingWind翻译</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
A:link {COLOR: #ccaaff; TEXT-DECORATION: none}
A:visited {COLOR: #ccaaff; TEXT-DECORATION: none}
A:active {COLOR: #ccaaff; TEXT-DECORATION: none}
A:hover {COLOR: #ffccaa; TEXT-DECORATION: none}
</style></head><body bgcolor="#000000" text="#ffffff"><br><br>
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td height="130" width="326"><img src="Tutorial_20_files/logo.png" height="130" width="326"></td>
<td align="center" valign="middle" width="75%"><font color="#ffccaa" size="+3"><b><i>第20课</i></b></font></td>
</tr></tbody></table>
<!-- 上边框-->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td><img src="Tutorial_20_files/tl.jpg" height="28" width="28"></td>
<td width="100%"><img src="Tutorial_20_files/tc.gif" height="28" width="100%"></td>
<td><img src="Tutorial_20_files/tr.gif" height="28" width="28"></td>
</tr>
</tbody>
</table>
<!-- 中部-->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<!-- 中部左边框-->
<td background="Tutorial_20_files/l.gif"><img src="Tutorial_20_files/l.gif" height="28" width="28"></td>
<!-- 中部文字部分-->
<td valign="top" width="100%">
<table border="0" width="100%">
<tbody><tr>
<td width="28%"><img src="Tutorial_20_files/lesson20.jpg" height="180" width="240"></td>
<td width="72%"><p><font class="head">蒙板:</font></p>
<p><font size="3">到目前为止你已经学会如何使用alpha混合，把一个透明物体渲染到屏幕上了，但有的使用它看起来并不是那么的复合你的心意。使用蒙板技术，将会按照你蒙板的位置精确的绘制。</font></p></td>
</tr>
</tbody></table>
</td>
<!-- 中部右边框-->
<td background="Tutorial_20_files/r.gif"><img src="Tutorial_20_files/r.gif" height="28" width="28"></td>
</tr>
</tbody>
</table>
<!-- 下边框-->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td><img src="Tutorial_20_files/bl.gif" height="28" width="28"></td>
<td width="100%"><img src="Tutorial_20_files/bc.gif" height="28" width="100%"></td>
<td><img src="Tutorial_20_files/br.gif" height="28" width="28"></td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/tl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/tc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/tr.png" height="28" width="28"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td background="Tutorial_20_files/l.png"><img src="Tutorial_20_files/l.png"></td>
<td valign="top" width="100%">欢迎来到第20课的教程，*.bmp图像被给各种操作系统所支持，因为它简单，所以可以很轻松的作为纹理图片加载它。知道现在，我们在把图像加载到屏幕上时没有擦除背景色，因为这样简单高效。但是效果并不总是很好。
<p>大部分情况下，把纹理混合到屏幕，纹理不是太少就是太多。当使用精灵时，我不希望背景从精灵的缝隙中透出光来；但在显示文字时，你希望文字的间隙可以显示背景色。</p>
<p>由于以上原因，我们需要使用“掩模”。使用“掩模”需要两个步骤，首先我们在场景上放置黑白相间的纹理，白色代表透明部分，黑色代表不透明部分。接着我们使用一种特殊的混合方式，只有在黑色部分上的纹理才会显示在场景中。</p>
<p>我只重写那些改变的地方，如果你做好了学习的准备，我们就上路吧。</p></td><td background="Tutorial_20_files/r.png"><img src="Tutorial_20_files/r.png"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/bl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/bc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/br.png" height="28" width="28"></td></tr></tbody></table>
<font color="#aaffaa" size="3"> </font>
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/tl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/tc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/tr.png" height="28" width="28"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td background="Tutorial_20_files/l.png"><img src="Tutorial_20_files/l.png"></td>
<td valign="top" width="100%">在这个程序里，我们使用7个全局变量。变量masking为一个布尔值，标志是否使用“掩模”。变量mp标志键M是否按下，变量sp标志空格是否按下。
<p>接着我们创建保存5个纹理标志的数组，loop为循环变量。变量roll使得纹理沿屏幕滚动。</p></td><td background="Tutorial_20_files/r.png"><img src="Tutorial_20_files/r.png"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/bl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/bc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/br.png" height="28" width="28"></td></tr></tbody></table>
<font color="#aaffaa" size="3">
<pre>bool masking=TRUE; <font color="#ffffaa">// 是否使用“掩模”</font>
bool mp; <font color="#ffffaa">// 键M是否按下</font>
bool sp; <font color="#ffffaa">// 空格是否按下</font>
bool scene; <font color="#ffffaa">// 绘制那一个场景</font>
GLuint texture[5]; <font color="#ffffaa">// 保存5个纹理标志</font>
GLuint loop; <font color="#ffffaa">// 循环变量</font>
GLfloat roll; <font color="#ffffaa">// 滚动纹理</font>
</pre>
</font>
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/tl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/tc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/tr.png" height="28" width="28"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td background="Tutorial_20_files/l.png"><img src="Tutorial_20_files/l.png"></td>
<td valign="top" width="100%">加载纹理代码基本没变，只是这里我们需要加载5个纹理</td>
<td background="Tutorial_20_files/r.png"><img src="Tutorial_20_files/r.png"></td></tr></tbody></table><table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><img src="Tutorial_20_files/bl.png" height="28" width="28"></td><td width="100%"><img src="Tutorial_20_files/bc.png" height="28" width="100%"></td><td><img src="Tutorial_20_files/br.png" height="28" width="28"></td></tr></tbody></table>
<font color="#aaffaa" size="3">
</font><pre><font color="#aaffaa" size="3">int LoadGLTextures()
{
int Status=FALSE;
AUX_RGBImageRec *TextureImage[5]; <font color="#ffffaa">// 创建保存5个纹理的数据结构</font>
memset(TextureImage,0,sizeof(void *)*5); <font color="#ffffaa">// 初始化</font>
if ((TextureImage[0]=LoadBMP("Data/logo.bmp")) && <font color="#ffffaa">// 加载纹理0</font>
(TextureImage[1]=LoadBMP("Data/mask1.bmp")) && <font color="#ffffaa">// 加载</font><font color="#aaffaa" size="3"><font color="#ffffaa">掩模</font></font><font color="#ffffaa">纹理</font><font color="#aaffaa" size="3"><font color="#ffffaa">1</font></font><font color="#ffffaa">，作为“掩模”使用</font>
(TextureImage[2]=LoadBMP("Data/image1.bmp")) && <font color="#ffffaa">// 加载纹理1</font>
(TextureImage[3]=LoadBMP("Data/mask2.bmp")) && <font color="#ffffaa">// 加载</font><font color="#aaffaa" size="3"><font color="#ffffaa">掩模</font></font><font color="#ffffaa">纹理2，作为“掩模”使用</font>
(TextureImage[4]=LoadBMP("Data/image2.bmp"))) <font color="#ffffaa">// 加载纹理2</font>
{
Status=TRUE;
glGenTextures(5, &texture[0]); <font color="#ffffaa">// 创建5个纹理</font>
for (loop=0; loop<5; loop++) <font color="#ffffaa">// 循环加载5个纹理</font>
{
glBindTexture(GL_TEXTURE_2D, texture[loop]);
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);
glTexImage2D(GL_TEXTURE_2D, 0, 3, TextureImage[loop]->sizeX, TextureImage[loop]->sizeY,
0, GL_RGB, GL_UNSIGNED_BYTE, TextureImage[loop]->data);
}
}
for (loop=0; loop<5; loop++)
{
if (TextureImage[loop])
{
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -