OpenGL ES 3.0-GLKit简介

作者: Tobesky | 来源:发表于2019-06-03 11:33 被阅读0次

前言

GLKit框架的设计目标是为了简化基于OpenGL或者OpenGL ES的应用开发。

它包括4个部分：

GLKView/GLKViewController：这些类抽取出大量的样板（boilerplate）代码，并完成了OpenGL ES 项目的基本配置。
GLKEffects：这些类实现了OpenGL ES公共（common）的shading行为，同时提供了让光和纹理（lighting and texturing）工作的简单方法。
GLMath：在iOS 5之前，每个游戏都需要它们自己的数学库，处理公共的向量和矩阵操作方法。现在有了GLMath，大多数的公共方法都可以从GLMath中获得。
GLKTextureLoader：这个类使得加载图像作为OpenGL使用的纹理更加简单。和写一个复杂的方法来处理大量不同的图像格式比，现在加载一个纹理只需要一个简单的方法调用。

搭建环境

在build phases 引入GLKit框架
新建一个ViewController继承自GLKViewController
把这个控制器设置为根视图
导入相应头文件

#import <OpenGLES/ES3/gl.h>
#import <OpenGLES/ES3/glext.h>

这样环境就已经搭建好了。

初始化环境

初始化上下文&设置当前上下文

使用OpenGL做任何事前，你都需要先创建一个EAGLContext。
iOS使用OpenGL进行绘制时需要一些信息，这些信息都由EAGLContext管理。这和你使用一个Core Graphics上下文差不多。
当你创建一个上下文时，你需要定义要使用的API版本。

/*
     EAGLContext 是苹果iOS平台下实现OpenGLES 渲染层.
     kEAGLRenderingAPIOpenGLES1 = 1, 固定管线
     kEAGLRenderingAPIOpenGLES2 = 2,
     kEAGLRenderingAPIOpenGLES3 = 3,
*/
self.context = [[EAGLContext alloc]initWithAPI:kEAGLRenderingAPIOpenGLES3];

设置当前上下文

这行代码必须要写

[EAGLContext setCurrentContext:context];

获取GLKView & 设置context

这创建了一个新的GLKView的实例，并使它和整个window一样大。
当你创建一个GLKView的时候，你需要告诉它要使用的OpenGL 上下文，所以配置成我们刚刚创建的context。

GLKView *view =(GLKView *) self.view;
view.context = context;

配置视图创建的渲染缓存区

drawableColorFormat(颜色缓存区格式)：
- 简介：OpenGL ES 有一个缓存区，它用以存储将在屏幕中显示的颜色。你可以使用其属性来设置缓冲区中的每个像素的颜色格式。
- GLKViewDrawableColorFormatRGBA8888：此值为默认值，缓存区的每个像素的最小组成部分（RGBA）使用8个bit，（所以每个像素4个字节，4*8个bit）。
- GLKViewDrawableColorFormatRGB565：如果你的APP允许更小范围的颜色，即可设置这个。会让你的APP消耗更小的资源（内存和处理时间）
drawableDepthFormat(深度缓存区格式)：如果你要使用这个属性（一般用于3D游戏），你应该选择GLKViewDrawableDepthFormat16或GLKViewDrawableDepthFormat24。这里的差别是使用GLKViewDrawableDepthFormat16将消耗更少的资源。
- GLKViewDrawableDepthFormatNone = 0：意味着完全没有深度缓冲区
- GLKViewDrawableDepthFormat16
- GLKViewDrawableDepthFormat24

view.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;
view.drawableDepthFormat = GLKViewDrawableDepthFormat16;

设置背景颜色

定义用来清理屏幕的RGB颜色和alpha（透明度）值。这里我们设置红色。

glClearColor(1, 0, 0, 1.0);

准备数据

    //1.设置顶点数组(顶点坐标,纹理坐标)
    /*
     纹理坐标系取值范围[0,1];原点是左下角(0,0);
     故而(0,0)是纹理图像的左下角, 点(1,1)是右上角.
     */
    GLfloat vertexData[] = {
        
        0.5, -0.5, 0.0f,    1.0f, 0.0f, //右下
        0.5, 0.5, -0.0f,    1.0f, 1.0f, //右上
        -0.5, 0.5, 0.0f,    0.0f, 1.0f, //左上
        
        0.5, -0.5, 0.0f,    1.0f, 0.0f, //右下
        -0.5, 0.5, 0.0f,    0.0f, 1.0f, //左上
        -0.5, -0.5, 0.0f,   0.0f, 0.0f, //左下
    };

绑定数据

创建顶点缓存区标识符ID

函数原型：void glGenBuffers(GLsizei n,GLuint * buffers);
第一个参数：要生成的缓冲对象的数量
第二个参数：要输入用来存储缓冲对象名称的数组

GLuint bufferID;
glGenBuffers(1, &bufferID);

个人理解如下，可以声明一个GLuint变量，然后使用glGenBuffers后，它就会把缓冲对象保存在vbo里；
当然也可以声明一个数组类型，那么创建的3个缓冲对象的名称会依次保存在数组里。

// 举例说明
GLuint vbo;
glGenBuffers(1,&vbo);
GLuint vbo[3];
glGenBuffers(3,vbo);

绑定顶点缓存区(明确作用)

函数原型：void glBindBuffer(GLenum target,GLuint buffer);
第一个参数：缓冲对象的类型
第二个参数：要绑定的缓冲对象的名称

使用该函数将缓冲对象绑定到OpenGL上下文环境中以便使用。
如果把target绑定到一个已经创建好的缓冲对象，那么这个缓冲对象将为当前target的激活对象。
但是如果绑定的buffer值为0，那么OpenGL将不再对当前target使用任何缓存对象。

这里有一个形象的比喻：绑定对象的过程就像设置铁路的道岔开关，每一个缓冲类型中的各个对象就像不同的轨道一样，我们将开关设置为其中一个状态，那么之后的列车都会驶入这条轨道。

切记-----:：

OpenGL允许我们同时绑定多个缓冲类型，只要这些缓冲类型是不同的，换句话说，同一时间，不能绑定两个相同类型的缓冲对象。也可以理解为对于一个类型来说，同一时间只能“激活”一个类型，否则就会发生“矛盾”。
第二个参数虽然是GLuint类型的，但是你万万不能直接指定个常量比如说0，否则会出现GL_INVALID_VALUE的错误，具体如下：

GL_INVALID_VALUE is generated if buffer is not a name previously returned form a call to glGenBuffers

glBindBuffer(GL_ARRAY_BUFFER, bufferID);

将顶点数组的数据copy到顶点缓存区中(GPU显存中)

上面通过调用glGenBuffers创建一个新的顶点缓冲区对象，glBindBuffer函数告诉OpenGL：“嘿，当我说GL_ARRAY_BUFFER的时候，我得意思是vertexBuffer”，glBufferData函数把数据发送到OpenGL的领地。

glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);

插槽重识（打开读取通道）

GLKit目标就是简化, 里面有很多对OpenGLES的封装, 我们也可以不用进行shader的编辑, 不用在写glsl就能完成shader的绘制
GLKVertexAttribPosition就是position位置插槽,
GLKVertexAttribColor就是color位置插槽,
GLKVertexAttribTexCoord0就是texcoord0位置插槽,

glEnableVertexAttribArray：在iOS中, 默认情况下，出于性能考虑，所有顶点着色器的属性（Attribute）变量都是关闭的。
意味着,顶点数据在着色器端(服务端)是不可用的。即使你已经使用glBufferData方法，将顶点数据从内存拷贝到顶点缓存区中(GPU显存中)。
所以, 必须由glEnableVertexAttribArray方法打开通道。指定访问属性，才能让顶点着色器能够访问到从CPU复制到GPU的数据。
注意: 数据在GPU端是否可见，即，着色器能否读取到数据，由是否启用了对应的属性决定，这就是glEnableVertexAttribArray的功能，允许顶点着色器读取GPU（服务器端）数据。
glVertexAttribPointer
- 函数原型：glVertexAttribPointer (GLuint indx, GLint size, GLenum type, GLboolean normalized, GLsizei stride, const GLvoid* ptr)
- 功能：上传顶点数据到显存的方法（设置合适的方式从buffer里面读取数据）
  参数列表
- 参数解析：
  - index：指定要修改的顶点属性的索引值
  - size：每次读取数量。（如position是由3个（x,y,z）组成，而颜色是4个（r,g,b,a）,纹理则是2个.）
  - type：指定数组中每个组件的数据类型。可用的符号常量有GL_BYTE, GL_UNSIGNED_BYTE, GL_SHORT,GL_UNSIGNED_SHORT, GL_FIXED, 和GL_FLOAT，初始值为GL_FLOAT。
  - normalized：指定当被访问时，固定点数据值是否应该被归一化（GL_TRUE）或者直接转换为固定点值（GL_FALSE）
  - stride：指定连续顶点属性之间的偏移量。如果为0，那么顶点属性会被理解为：它们是紧密排列在一起的。初始值为0
  - ptr：指定一个指针，指向数组中第一个顶点属性的第一个组件。初始值为0

//顶点坐标数据
glEnableVertexAttribArray(GLKVertexAttribPosition);
glVertexAttribPointer(GLKVertexAttribPosition, 3, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 5, (GLfloat *)NULL + 0);

//纹理坐标数据
glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
glVertexAttribPointer(GLKVertexAttribTexCoord0, 2, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 5, (GLfloat *)NULL + 3);

纹理矩阵

获取纹理图片路径

NSString *filePath = [[NSBundle mainBundle]pathForResource:@"test" ofType:@"jpg"];

设置纹理参数

由于纹理坐标系是跟手机显示的Quartz 2D坐标系的y轴正好相反，纹理坐标系使用左下角为原点，往上为y轴的正值，往右是x轴的正值，所以需要设置一下GLKTextureLoaderOriginBottomLeft。

NSDictionary *options = [NSDictionary dictionaryWithObjectsAndKeys:@(1),GLKTextureLoaderOriginBottomLeft, nil];
    
GLKTextureInfo *textureInfo = [GLKTextureLoader textureWithContentsOfFile:filePath options:options error:nil];

使用苹果GLKit 提供GLKBaseEffect 完成着色器工作(顶点/片元)

cEffect = [[GLKBaseEffect alloc]init];
cEffect.texture2d0.enabled = GL_TRUE;
cEffect.texture2d0.name = textureInfo.name;

绘制

glClear(GL_COLOR_BUFFER_BIT);
    
//准备绘制
[cEffect prepareToDraw];
    
//开始绘制
glDrawArrays(GL_TRIANGLES, 0, 6);

GLKBaseEffect使用小结

GLKBaseEffect是一个辅助类，为你实现一些通用的着色器。
要使用GLKBaseEffect，你需要这样做：

[1] 创建一个GLKBaseEffect。通常当你创建OpenGL上下文的时候，你都会创建一个。对于不同的几何图形，你可以（或者说应该）重用相同的GLKBaseEffect，只是要重新设置其属性。在后台，GLKBaseEffect只会向它的着色器传播刚刚变化的属性。
[2] 设置GLKBaseEffect的属性。这里你可以配置光，转化，和其他GLKBaseEffect的着色器用来渲染几何图形的属性。
[3] 调用GLKBaseEffect的prepareToDraw方法。任何时候如果你改变了GLKBaseEffect的一个属性，你都要先调用prepareToDraw方法让着色器得到正确的配置。这也让GLKBaseEffect的着色器作为“当前”的着色器程序（就是让GLKBaseEffect的着色器起作用）。
[4] 使能预定义属性。通常当你使用自定义着色器时，他们会使用称为属性的参数，你要写代码获得它们的ID。对于GLKBaseEffect的内建着色器，这些属性已经用常量值预先定义好了，比如GLKVertexAttribPosition或者GLKVertexAttribColor。所以你要使能所有需要传给着色器的参数，并保证他们指向了数据。
[5] 绘制你的几何图形。一旦你东西要配置，你都可以使用普通的OpenGL绘图指令，比如glDrawArrays或者glDrawElements，它会使用你刚刚配置好的效果进行渲染！

GLKBaseEffect的好处是如果你使用它们，你根本就不需要去写任何的着色器！当然如果你喜欢，你还是可以像原来那样做，并且你可以使用GLKBaseEffect混合、匹配并渲染一些东西，还可以使用你自定义的着色器。