⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 tutorial_20.htm

📁 如果你相信它就好好学学吧,同样这里也只是个入门
💻 HTM
📖 第 1 页 / 共 3 页
字号:
			if (TextureImage[loop]->data)			
			{
				free(TextureImage[loop]->data);		
			}
			free(TextureImage[loop]);			
		}
	}
	return Status;						
}
</font></pre>
 
<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%">改变窗口大小和初始化OpenGL的函数没有变化
      <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%">现在到了最有趣的绘制部分了,我们从清楚背景色开始,接着把物体移入屏幕2个单位。</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>int DrawGLScene(GLvoid)		
{
	glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);			
	glLoadIdentity();							
	glTranslatef(0.0f,0.0f,-2.0f);						<font color="#ffffaa">// 物体移入屏幕2个单位</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%"><font face="Tahoma,Verdana,sans-serif" size="-1"> 下面一行,我们选择'logo'纹理。我们将要通过四边形把纹理映射到屏幕,并按照顶点的顺序设置纹理坐标。</font>
      <p>Jonathan Roy说OpenGL是一个基于顶点的图形系统,大部分你设置的参数是作为顶点的属性而记录的,纹理坐标就是这样一种属性。你只要简单的设置各个顶点的纹理坐标,OpenGL就自动帮你把多边形内部填充纹理,通过一个插值的过程。</p>
      <p>向前面几课一样,我们假定四边形面对我们,并把纹理坐标(0,0)绑定到左下角,(1,0)绑定到右下角,(1,1)绑定到右上角。给定这些设置,你应该能猜到四边形中间对应的纹理坐标为(0.5,0.5),但你自己并没有设置此处的纹理坐标!OpenGL为你做了计算。</p>
      <p>在
这一课里,我们通过设置纹理坐标达到一种滚动纹理的目的。纹理坐标是被归一化的,它的范围从0.0-1.0,值0被映射到纹理的一边,值1被映射到纹理的
另一边。超过1的值,纹理可以按照不同的方式被映射,这里我们设置为它将回绕道另一边并重复纹理。例如如果使用这样的映射方式,纹理坐标
(0.3,0.5)和(1.3,0.5)被映射到同一个纹理坐标。在这一课里,我们将尝试一种无缝填充的效果。</p>
      <font face="Tahoma,Verdana,sans-serif" size="-1"><br>
      <br>
      <img src="Tutorial_20_files/lesson20-1.jpg" align="left"><img src="Tutorial_20_files/lesson20-2.jpg" align="right"> 
      </font><font face="Tahoma,Verdana,sans-serif">我们使用roll变量去设置纹理坐标,当它为0时,它把纹理的左下角映射到四边形的左下角。当它大于0时,把纹理的左上角映射到四边形的左下角,看起来的效果就是纹理沿四边形向上滚动。</font></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>	glBindTexture(GL_TEXTURE_2D, texture[0]);				<font color="#ffffaa">// 选择Logo纹理</font>
	glBegin(GL_QUADS);							<font color="#ffffaa">// 绘制纹理四边形</font>
		glTexCoord2f(0.0f, -roll+0.0f); glVertex3f(-1.1f, -1.1f,  0.0f);	
		glTexCoord2f(3.0f, -roll+0.0f); glVertex3f( 1.1f, -1.1f,  0.0f);	
		glTexCoord2f(3.0f, -roll+3.0f); glVertex3f( 1.1f,  1.1f,  0.0f);	
		glTexCoord2f(0.0f, -roll+3.0f); glVertex3f(-1.1f,  1.1f,  0.0f);	
	glEnd();		</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%">启用混合和禁用深度测试</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>	glEnable(GL_BLEND);							<font color="#ffffaa">// 启用混合</font>
	glDisable(GL_DEPTH_TEST);						<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%">接下来我们需要根据masking的值设置是否使用“掩模”,如果是,则需要设置相应的混合系数。</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>	if (masking)								<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%">如果启用了“掩模”,我们将要设置“掩模”的混合系数。一个“掩模”只是一幅绘制到屏幕的纹理图片,但只有黑色和白色。白色的部分代表透明,黑色的部分代表不透明。
      <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"><pre>		glBlendFunc(GL_DST_COLOR,GL_ZERO);					<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%">现在我们检查绘制那一个层,如果为True绘制第二个层,否则绘制第一个层</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>	if (scene)	
	{
</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%">为了不使它看起来显得非常大,我们把它移入屏幕一个单位,并把它按roll变量的值进行旋转(沿Z轴)。</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>		glTranslatef(0.0f,0.0f,-1.0f);					<font color="#ffffaa">// 移入屏幕一个单位</font>
		glRotatef(roll*360,0.0f,0.0f,1.0f);				<font color="#ffffaa">	// 沿Z轴旋转</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%">接下我们检查masking的值来绘制我们的对象</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>		if (masking)							<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%">如果“掩模打开”,我们会把掩模绘制到屏幕。当我们完成这个操作时,将会看到一个镂空的纹理出现在屏幕上。</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>			glBindTexture(GL_TEXTURE_2D, texture[3]);		<font color="#ffffaa">// 选择第二个“掩模”纹理</font>
			glBegin(GL_QUADS);					<font color="#ffffaa">// 开始绘制四边形</font>
				glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.1f, -1.1f,  0.0f);	
				glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.1f, -1.1f,  0.0f);	
				glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.1f,  1.1f,  0.0f);	
				glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.1f,  1.1f,  0.0f);	
			glEnd();						
		}
</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%">当我们把“掩模”绘制到屏幕上后,接着我们变换混合系数。这次我们告诉OpenGL把任何黑色部分对应的像素复制到屏幕,这样看起来纹理就像被镂空一样帖子屏幕上。
      <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">
<pre>		glBlendFunc(GL_ONE, GL_ONE);				<font color="#ffffaa">// 把纹理2复制到屏幕</font>
		glBindTexture(GL_TEXTURE_2D, texture[4]);			<font color="#ffffaa">// 选择第二个纹理</font>
		glBegin(GL_QUADS);						<font color="#ffffaa">// 绘制四边形</font>
			glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.1f, -1.1f,  0.0f);	
			glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.1f, -1.1f,  0.0f);	
			glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.1f,  1.1f,  0.0f);	
			glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.1f,  1.1f,  0.0f);	
		glEnd();						
	}
</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%">绘制第一层图像</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>	else									<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%">如果“掩模打开”,我们会把掩模绘制到屏幕。当我们完成这个操作时,将会看到一个镂空的纹理出现在屏幕上。</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>		if (masking)							<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%">如果“掩模打开”,我们会把掩模绘制到屏幕。当我们完成这个操作时,将会看到一个镂空的纹理出现在屏幕上。</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>			glBindTexture(GL_TEXTURE_2D, texture[1]);		<font color="#ffffaa">// 选择第一个“掩模”纹理</font>
			glBegin(GL_QUADS);					<font color="#ffffaa">// 开始绘制四边形</font>
				glTexCoord2f(roll+0.0f, 0.0f); glVertex3f(-1.1f, -1.1f,  0.0f);	
				glTexCoord2f(roll+4.0f, 0.0f); glVertex3f( 1.1f, -1.1f,  0.0f);	

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -