OpenGL-12-纹理、纹理API及纹理坐标

宇宙那么大
1,392 阅读8分钟

一、了解纹理

在OpenGL中，纹理是一种图形数据，主要用于包装不同的物体。 我们来举个例子：装修房子时，各个房间需要贴不同的墙纸。这里的墙纸就是我们说的纹理。

  • 图片要在屏幕上显示，其实都是通过解码成位图，然后进行显示的。一个图像在帧缓冲区的存储空间大小，可以用这个公式进行计算： 图像存储空间 = 图像的高 * 图像的宽 * 每个像素的字节数
  • 在OpenGL中，纹理一般是.TGA文件。在实际iOS开发中，我们使用的是OpenGL ES，可以直接使用png、jpg格式的压缩图片来作为纹理数据。因为系统会把压缩图片通过解码还原成位图供纹理使用，位图每一个像素点都会有其颜色空间。

二、纹理相关API

我们先把API中用到的数据表放在前面，方便查阅

像素格式表 和 像素数据类型表

[像素格式-format表]

[像素数据类型-type表]

[举例解读type表]

纹理的使用步骤： 读取文件数据、载入纹理、生成纹理对象，设置纹理相关参数

1、读取纹理数据

1.1 从颜⾊缓冲区中读取文件数据

void glReadPixels(GLint x,GLint y,GLSizei width,GLSizei height, GLenum format, GLenum type,const void * pixels);
/*
//参数1：x,矩形左下⻆的窗⼝坐标
//参数2：y,矩形左下⻆的窗⼝坐标
//参数3：width,矩形的宽，以像素为单位
//参数4：height,矩形的⾼，以像素为单位
//参数5：format,OpenGL 的像素格式，如RGBA。参考：像素格式-format表
//参数6：type,解释参数pixels指向的数据，告诉OpenGL 使⽤缓存区中的什么数据类型来存储颜⾊分量，像素数据的数据类型，参考：像素数据类型-type表
//参数7：pixels,指向图形数据的指针
*/
//指定读取的缓存 
glReadBuffer(mode);
//指定写⼊的缓存
glWriteBuffer(mode);

1.2 从TGA文件中读取纹理数据

/*
     参数1：纹理文件名称
     参数2：文件宽度地址
     参数3：文件高度地址
     参数4：文件组件地址
     参数5：文件格式地址
     返回值：pBits,指向图像数据的指针
     */
    gltReadTGABits(<#const char *szFileName#>, <#GLint *iWidth#>, <#GLint *iHeight#>, <#GLint *iComponents#>, <#GLenum *eFormat#>)

2、载入纹理

一般使用 glTexImage2D

//width
void glTexImage1D(GLenum target,GLint level,GLint internalformat,GLsizei width,GLint border,GLenum format,GLenum type,void *data);
//width + height
void glTexImage2D(GLenum target,GLint level,GLint internalformat,GLsizei width,GLsizei height,GLint border,GLenum format,GLenum type,void * data);
//width + height + depth
void glTexImage3D(GLenum target,GLint level,GLint internalformat,GLSizei width,GLsizei height,GLsizei depth,GLint border,GLenum format,GLenum type,void *data);
/*
* target:`GL_TEXTURE_1D`、`GL_TEXTURE_2D`、`GL_TEXTURE_3D`。 
* Level:指定所加载的mip贴图层次。⼀般我们都把这个参数设置为0。
* internalformat:每个纹理单元中存储多少颜⾊成分。
* width、height、depth参数:指加载纹理的宽度、⾼度、深度。
==注意！==这些值必须是2的整数次⽅。（这是因为OpenGL 旧版本上的遗留下的⼀个要求。当然现在已经可以⽀持不是2的整数次⽅。但是开发者们还是习惯使⽤以2的整数次⽅去设置这些参数。）

* border参数:允许为纹理贴图指定⼀个边界宽度。
* format、type、data参数：与上面一样
*/

3、生成纹理

生成纹理有两步： 1、申请分配纹理对象。glGenTextures 2、绑定纹理状态。glBindTexture

3.1 申请分配纹理对象

//使⽤函数分配纹理对象
//指定纹理对象的数量 和 指针（指针指向⼀个⽆符号整形数组，由纹理对象标识符填充）。
void glGenTextures(GLsizei n,GLuint * textTures);
//例如：
glGenTextures(1, &textureID);

3.2 绑定纹理状态

//绑定纹理状态
//参数target:GL_TEXTURE_1D、GL_TEXTURE_2D、GL_TEXTURE_3D
//参数texture:需要绑定的纹理对象
void glBindTexture(GLenum target,GLunit texture);
//例如：
glBindTexture(GL_TEXTURE_2D, textureID);

3.3 删除纹理对象

//删除绑定纹理对象
//纹理对象 以及 纹理对象指针（指针指向⼀个⽆符号整形数组，由纹理对象标识符填充）。
void glDeleteTextures(GLsizei n,GLuint *textures);
//例如：
glDeleteTextures(1, &textureID);

3.4 测试纹理对象是否有效

//测试纹理对象是否有效
//如果texture是⼀个已经分配空间的纹理对象，那么这个函数会返回GL_TRUE,否则会返回GL_FALSE。 
GLboolean glIsTexture(GLuint texture);
//例如：
glIsTexture(textureID);

4、设置纹理参数

主要是设置纹理在缩小和放大时的过滤方式、x/y轴上的环绕方式。这些都是通过指定参数之，并对应的设置

/*
参数1:target,指定这些参数将要应⽤在那个纹理模式上，⽐如GL_TEXTURE_1D、GL_TEXTURE_2D、GL_TEXTURE_3D。
参数2:pname,指定需要设置那个纹理参数
参数3:param,设定特定的纹理参数的值
*/
void glTexParameterf(GLenum target,GLenum pname,GLFloat param);
void glTexParameteri(GLenum target,GLenum pname,GLint param);
void glTexParameterfv(GLenum target,GLenum pname,GLFloat *param);
void glTexParameteriv(GLenum target,GLenum pname,GLint *param);

4.1 过滤方式

常用的有两种：邻近过滤、线性过滤。

  • 邻近过滤（GL_NEAREST）：就是选择离当前位置最近的颜色
  • 线性过滤（GL_LINEAR）：当前位置周围的所有颜色进行一系列混合计算得到的综合颜色
  • 建议：纹理缩小时，使用邻近过滤，纹理放大时，使用线性过滤

//放大时，用邻近过滤
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_NEAREST);
//缩小时，用邻近过滤
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_NEAREST);
//放大时，用线性过滤
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);
//缩小时，用线性过滤
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);

[2种过滤方式比较]

4.2 环绕方式

环绕方式是指当纹理坐标超出默认范围时，边缘的显示形式 环绕方式的设置主要是针对x、y轴设置的，而在纹理的描述中使用并不是x、y，而是 s、t 注意：纹理中的 s, t, r, q 对应坐标系中的 x, y, z, w

环绕方式：

  • GL_REPEAT：默认，重复纹理图像
  • GL_MIRRORED_REPEAT：重复纹理图像，每次重复图片是镜像放置的
  • GL_CLAMP_TO_EDGE：纹理坐标会被约束在0-1之间，超出的部分会重复纹理坐标的边缘，产生一种边缘被拉伸的效果
  • GL_CLAMP_TO_BORDER：超出的坐标为用户指定的边缘颜色
/*
参数1：GL_TEXTURE_1D、GL_TEXTURE_2D、GL_TEXTURE_3D
参数2：GL_TEXTURE_WRAP_S、GL_TEXTURE_T、GL_TEXTURE_R,针对s,t,r坐标
参数3：GL_REPEAT、GL_CLAMP、GL_CLAMP_TO_EDGE、GL_CLAMP_TO_BORDER
 */
glTextParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAR_S,GL_CLAMP_TO_EDGE);
glTextParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAR_T,GL_CLAMP_TO_EDGE);

[4种环绕方式比较]

接下来继续介绍一下其他的API

5、纹理像素的存储方式

//改变像素存储⽅式
void glPixelStorei(GLenum pname,GLint param);
//恢复像素存储⽅式
void glPixelStoref(GLenum pname,GLfloat param);
/*
举例：
参数1：GL_UNPACK_ALIGNMENT 指定OpenGL 如何从数据缓存区中解包图像数据
GL_UNPACK_ALIGNMENT 指内存中每个像素⾏起点的排列请求，允许设置为：
1 （byte排列）、
2（排列为偶数byte的⾏）、
4（字word排列）、
8（⾏从双字节边界开始）

参数2：表示参数GL_UNPACK_ALIGNMENT 设置的值
*/
glPixelStorei(GL_UNPACK_ALIGNMENT,1);

6、更新纹理

参数参考前面的API

//xOffset 
void glTexSubImage1D(GLenum target,GLint level,GLint xOffset,GLsizei width,GLenum format,GLenum type,const GLvoid *data);
//xOffset + yOffset 
void glTexSubImage2D(GLenum target,GLint level,GLint xOffset,GLint yOffset,GLsizei width,GLsizei height,GLenum format,GLenum type,const GLvoid *data);
//xOffset + yOffset + zOffset
void glTexSubImage3D(GLenum target,GLint level,GLint xOffset,GLint yOffset,GLint zOffset,GLsizei width,GLsizei height,GLsizei depth,Glenum type,const GLvoid * data);

7、插入替换纹理

参数参考前面的API

//xoffset
void glCopyTexSubImage1D(GLenum target,GLint level,GLint xoffset,GLint x,GLint y,GLsizei width);
//xOffset + yOffset 
void glCopyTexSubImage2D(GLenum target,GLint level,GLint xoffset,GLint yOffset,GLint x,GLint y,GLsizei width,GLsizei height);
//xOffset + yOffset + zOffset
void glCopyTexSubImage3D(GLenum target,GLint level,GLint xoffset,GLint yOffset,GLint zOffset,GLint x,GLint y,GLsizei width,GLsizei height)

8、使用颜色缓冲区加载数据，形成新的纹理使用

参数x,y 在颜⾊缓存区中指定了开始读取纹理数据的位置； 缓存区⾥的数据，是源缓存区通过glReadBuffer设置的。 注意：不存在glCopyTextImage3D ，因为我们⽆法从2D 颜⾊缓存区中获取体积数据。

//width
void glCopyTexImage1D(GLenum target,GLint level,GLenum internalformt,GLint x,GLint y,GLsizei width,GLint border);
//width + height
void glCopyTexImage2D(GLenum target,GLint level,GLenum internalformt,GLint x,GLint y,GLsizei width,GLsizei height,GLint border);

9、压缩纹理

9.1 通⽤压缩纹理格式

9.2 判断压缩 与 选择压缩⽅式

//根据选择的压缩纹理格式，选择最快、最优、⾃⾏选择的算法⽅式选择压缩格式。
glHint(GL_TEXTURE_COMPRESSION_HINT,GL_FASTEST);
glHint(GL_TEXTURE_COMPRESSION_HINT,GL_NICEST);
glHint(GL_TEXTURE_COMPRESSION_HINT,GL_DONT_CARE);

9.3 加载压缩纹理

//width 
void glCompressedTexImage1D(GLenum target,GLint level,GLenum internalFormat,GLsizei width,GLint border,GLsizei imageSize,void *data);
//width + heigth 
void glCompressedTexImage2D(GLenum target,GLint level,GLenum internalFormat,GLsizei width,GLint heigth,GLint border,GLsizei imageSize,void *data);
//width + heigth + depth
void glCompressedTexImage3D(GLenum target,GLint level,GLenum internalFormat,GLsizei width,GLsizei heigth,GLsizei depth,GLint border,GLsizei imageSize,void *data);
/*
 target:`GL_TEXTURE_1D`、`GL_TEXTURE_2D`、`GL_TEXTURE_3D`。
 Level:指定所加载的mip贴图层次。⼀般我们都把这个参数设置为0。
internalformat:每个纹理单元中存储多少颜⾊成分。
width、height、depth参数:指加载纹理的宽度、⾼度、深度。==注意！==这些值必须是2的整数次⽅。（这是因为OpenGL 旧版本上的遗留下的⼀个要求。当然现在已经可以⽀持不是2的整数次⽅。但是开发者们还是习惯使⽤以2的整数次⽅去设置这些参数。）
border参数:允许为纹理贴图指定⼀个边界宽度。
format、type、data参数：与我们在讲glDrawPixels 函数对于的参数相同
*/

9.4 glGetTexLevelParameter函数提取的压缩纹理格式

9.5 GL_EXT_texture_compression_s3tc压缩格式

三、纹理坐标

纹理坐标就是纹理与图形的映射关系，图形中每个顶点都会关联一个纹理坐标，表示顶点需要从该位置读取纹理图像的数据。

  • 纹理坐标的范围是 0 到 1 之间，
  • 顶点坐标一般是用（ x，y，z）描述，而纹理坐标是用（ s，t，r）描述
  • 纹理坐标默认左下角为（0，0），即： 左上角（1，0） 右上角（1，1） 左下角（0，0） 左下角（1，0）

  • 另外，纹理坐标的映射关系并不是固定的，可以根据图片不同角度的翻转，进行不同的映射。注意：不能让图片的映射关系交叉。借用下网上找的一张很直观的分析图片来看以下几种映射情况：

avatar
文章
阅读
粉丝
相关推荐
LearnOpenGL 纹理 学习笔记
474阅读
 · 
0点赞
WebGL 纹理贴图
340阅读
 · 
2点赞
【Filament】纹理贴图
414阅读
 · 
2点赞
OpenGL纹理转换谜团：纹理写入FRAMEBUFFER后的镜像现象
499阅读
 · 
1点赞
解密视频魔法：将ExternalOES纹理转化为TEXTURE_2D纹理
637阅读
 · 
4点赞