OpenGL 案例:隧道

隧道整体的案例最终效果如下图所示

隧道的绘制过程,整体的流程如下图

主要涉及的函数

main函数、ChangeSize、ShutdownRC、SpecialKeys 不做过多的解释说明,主要针对SetupRC、RenderScene 以及 ProcessMenu函数做个备注。

SetupRC

初始化
  1. 设置背景色
  2. 初始化着色器
glClearColor(0, 0, 0, 1.0f );
shaderManager.InitializeStockShaders();
设置纹理
  1. 生成纹理标记

因为隧道有四个面,左右两个面是一样的,所以这里传入一个纹理数组。

/** 分配纹理对象 glGenTextures
     参数1:纹理对象的数量
     参数2:纹理对象标识数组
     */
glGenTextures(TEXTURE_COUNT, textures);
  1. 设置纹理参数

因为使用了多个纹理,每个纹理都需要设置这些参数,所以利用 for 循环:

  • 绑定纹理对象
  • 读取TGA纹理文件
  • 设置纹理环绕方式&过滤方式
  • 载入纹理
  • 生成 Mip 贴图
  • 释放指针
for (iLoop = 0; iLoop < TEXTURE_COUNT; iLoop++) {
    
    /**绑定纹理对象 glBindTexture
    参数1:纹理模式,GL_TEXTURE_1D,GL_TEXTURE_2D,GL_TEXTURE_3D
    参数2:需要绑定的纹理对象
    */
    glBindTexture(GL_TEXTURE_2D, textures[iLoop]);
    
    /**加载tga文件
    参数1:纹理文件名称
    参数2:文件宽度变量地址
    参数3:文件高度变量地址
    参数4:文件组件变量地址
    参数5:文件格式变量地址
    返回值:pBytes,指向图像数据的指针
    */
    pBytes = gltReadTGABits(szTextureFiles[iLoop], &iWidth, &iHeight, &iComponents, &eFormat);
    
    //加载纹理、设置过滤器和包装模式
    //GL_TEXTURE_MAG_FILTER(放大过滤器,GL_NEAREST(最邻近过滤)
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
    //GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_NEAREST(最邻近过滤)
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    
    //GL_TEXTURE_WRAP_S(s轴环绕),GL_CLAMP_TO_EDGE(环绕模式强制对范围之外的纹理坐标沿着合法的纹理单元的最后一行或一列进行采样)
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    //GL_TEXTURE_WRAP_T(t轴环绕),GL_CLAMP_TO_EDGE(环绕模式强制对范围之外的纹理坐标沿着合法的纹理单元的最后一行或一列进行采样)
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
    
    /**载入纹理 glTexImage2D
    参数1:纹理维度,GL_TEXTURE_2D
    参数2:mip贴图层次
    参数3:纹理单元存储的颜色成分(从读取像素图中获得)
    参数4:加载纹理宽度
    参数5:加载纹理的高度
    参数6:加载纹理的边框
    参数7: 加载纹理格式
    参数7:像素数据的数据类型,GL_UNSIGNED_BYTE无符号整型
    参数8:指向纹理图像数据的指针
    */
    glTexImage2D(GL_TEXTURE_2D, 0, iComponents, iWidth, iHeight, 0, eFormat, GL_UNSIGNED_BYTE, pBytes);
    
    /**为纹理对象生成一组完整的mipmap glGenerateMipmap
    参数1:纹理维度,GL_TEXTURE_1D,GL_TEXTURE_2D,GL_TEXTURE_2D
    */
    glGenerateMipmap(GL_TEXTURE_2D);
    
    //释放原始纹理数据,不在需要纹理原始数据了
    free(pBytes);
}
填充数据

隧道顶点坐标与纹理坐标的映射,四个面均是由多个三角形使用三角形带的图元连接方式组成,使用 for 循环,每次设置4个点的顶点及纹理坐标。

GLfloat z;

/*
GLTools库中的容器类,GBatch,
void GLBatch::Begin(GLenum primitive,GLuint nVerts,GLuint nTextureUnits = 0);
参数1:图元枚举值
参数2:顶点数
参数3:1组或者2组纹理坐标
*/
floorBatch.Begin(GL_TRIANGLE_STRIP, 28, 1);

//Z表示深度,隧道的深度
for(z = 60.0f; z >= 0.0f; z -=10.0f) {
    
    floorBatch.MultiTexCoord2f(0, 0.0f, 0.0f);
    floorBatch.Vertex3f(-10.0f, -10.0f, z);
    
    floorBatch.MultiTexCoord2f(0, 1.0f, 0.0f);
    floorBatch.Vertex3f(10.0f, -10.0f, z);
    
    floorBatch.MultiTexCoord2f(0, 0.0f, 1.0f);
    floorBatch.Vertex3f(-10.0f, -10.0f, z - 10.0f);
    
    floorBatch.MultiTexCoord2f(0, 1.0f, 1.0f);
    floorBatch.Vertex3f(10.0f, -10.0f, z - 10.0f);
}
floorBatch.End();

ceilingBatch.Begin(GL_TRIANGLE_STRIP, 28, 1);
for(z = 60.0f; z >= 0.0f; z -=10.0f) {
    
    ceilingBatch.MultiTexCoord2f(0, 0.0f, 1.0f);
    ceilingBatch.Vertex3f(-10.0f, 10.0f, z - 10.0f);
    
    ceilingBatch.MultiTexCoord2f(0, 1.0f, 1.0f);
    ceilingBatch.Vertex3f(10.0f, 10.0f, z - 10.0f);
    
    ceilingBatch.MultiTexCoord2f(0, 0.0f, 0.0f);
    ceilingBatch.Vertex3f(-10.0f, 10.0f, z);
    
    ceilingBatch.MultiTexCoord2f(0, 1.0f, 0.0f);
    ceilingBatch.Vertex3f(10.0f, 10.0f, z);
}
ceilingBatch.End();

leftWallBatch.Begin(GL_TRIANGLE_STRIP, 28, 1);
for(z = 60.0f; z >= 0.0f; z -=10.0f) {
    
    leftWallBatch.MultiTexCoord2f(0, 0.0f, 0.0f);
    leftWallBatch.Vertex3f(-10.0f, -10.0f, z);
    
    leftWallBatch.MultiTexCoord2f(0, 0.0f, 1.0f);
    leftWallBatch.Vertex3f(-10.0f, 10.0f, z);
    
    leftWallBatch.MultiTexCoord2f(0, 1.0f, 0.0f);
    leftWallBatch.Vertex3f(-10.0f, -10.0f, z - 10.0f);
    
    leftWallBatch.MultiTexCoord2f(0, 1.0f, 1.0f);
    leftWallBatch.Vertex3f(-10.0f, 10.0f, z - 10.0f);
}
leftWallBatch.End();

rightWallBatch.Begin(GL_TRIANGLE_STRIP, 28, 1);
for(z = 60.0f; z >= 0.0f; z -=10.0f) {
    
    rightWallBatch.MultiTexCoord2f(0, 0.0f, 0.0f);
    rightWallBatch.Vertex3f(10.0f, -10.0f, z);
    
    rightWallBatch.MultiTexCoord2f(0, 0.0f, 1.0f);
    rightWallBatch.Vertex3f(10.0f, 10.0f, z);
    
    rightWallBatch.MultiTexCoord2f(0, 1.0f, 0.0f);
    rightWallBatch.Vertex3f(10.0f, -10.0f, z - 10.0f);
    
    rightWallBatch.MultiTexCoord2f(0, 1.0f, 1.0f);
    rightWallBatch.Vertex3f(10.0f, 10.0f, z - 10.0f);
}
rightWallBatch.End();

RenderScene

流程图

  • 清理缓存
  • push 压栈
  • 操作视图模型矩阵
  • 使用纹理替换矩阵着色器
  • 绑定纹理
  • pop 出栈
  • 交换缓存区
//1.用当前清除色,清除窗口
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT | GL_STENCIL_BUFFER_BIT);

//2.模型视图压栈
modelViewMatrix.PushMatrix();
//Z轴平移viewZ 距离
modelViewMatrix.Translate(0, 0, viewZ);

//3.纹理替换矩阵着色器
/*
 参数1:GLT_SHADER_TEXTURE_REPLACE(着色器标签)
 参数2:模型视图投影矩阵
 参数3:纹理层
 */
shaderManager.UseStockShader(GLT_SHADER_TEXTURE_REPLACE, transformPipeline.GetModelViewProjectionMatrix(), 0);

//4.绑定纹理
/*
 参数1:纹理模式,GL_TEXTURE_1D、GL_TEXTURE_2D、GL_TEXTURE_3D
 参数2:需要绑定的纹理
 */
glBindTexture(GL_TEXTURE_2D, textures[TEXTURE_FLOOR]);
floorBatch.Draw();

glBindTexture(GL_TEXTURE_2D, textures[TEXTURE_CEILING]);
ceilingBatch.Draw();

glBindTexture(GL_TEXTURE_2D, textures[TEXTURE_BRICK]);
leftWallBatch.Draw();
rightWallBatch.Draw();

//5. 模型视图出栈,恢复矩阵(push一次就要pop一次)
modelViewMatrix.PopMatrix();

//6.交换缓存区
glutSwapBuffers();

ProcessMenu

根据选择的菜单选项,更换所有纹理的过滤方式,并重新渲染。因为有多个纹理,需要设置多次,所以需要使用 for 循环设置。

GLint iLoop;
for (iLoop = 0; iLoop < TEXTURE_COUNT; iLoop++) {
    glBindTexture(GL_TEXTURE_2D, textures[iLoop]);
    
    switch (value) {
        case 0:
            glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
            break;
            case 1:
                    //GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_LINEAR(线性过滤)
                    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
                    break;
                    
                case 2:
                    //GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_NEAREST_MIPMAP_NEAREST(选择最邻近的Mip层,并执行最邻近过滤)
                    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST_MIPMAP_NEAREST);
                    break;
                    
                case 3:
                    //GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_NEAREST_MIPMAP_LINEAR(在Mip层之间执行线性插补,并执行最邻近过滤)
                    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST_MIPMAP_LINEAR);
                    break;
                    
                case 4:
                    //GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_NEAREST_MIPMAP_LINEAR(选择最邻近Mip层,并执行线性过滤)
                    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_NEAREST);
                    break;
                    
                case 5:
                    //GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER(缩小过滤器),GL_LINEAR_MIPMAP_LINEAR(在Mip层之间执行线性插补,并执行线性过滤,又称为三线性过滤)
                    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR);
                    break;
                    
                case 6:
                
                    //设置各向异性过滤
                    GLfloat fLargest;
                    //获取各向异性过滤的最大数量
                    glGetFloatv(GL_MAX_TEXTURE_MAX_ANISOTROPY_EXT, &fLargest);
                    //设置纹理参数(各向异性采样)
                    glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAX_ANISOTROPY_EXT, fLargest);
                    break;
            
                case 7:
                    //设置各向同性过滤,数量为1.0表示(各向同性采样)
                    glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAX_ANISOTROPY_EXT, 1.0f);
                    break;
        default:
            break;
    }
}

实现效果图:

完整代码见 Github 隧道

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,732评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,496评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,264评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,807评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,806评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,675评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,029评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,683评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,704评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,666评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,773评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,413评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,016评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,204评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,083评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,503评论 2 343