OpenGL ES 是OpenGL针对嵌入式系统设置的标准图形库。它是OpenGL的简化版。但是基本的渲染管线没有大的变化。
虽然iOS13开始不再支持OpenGL ES，已转向metal，但是OpenGL ES 仍然可以在iOS中仍可以使用，且其它嵌入式设备仍支持OpenGL ES。同时学习Open GL ES能更好的学习metal。
渲染管线
顶点缓存区 —>顶点着色器 —> 细分控制器 —> 细分中着色器 —> 图元转配 —>光栅化 —> 片元着色器
其中顶点着色器、片元着色器是可以供开发者使用的，而iOS也提供了默认实现好的着色器。
由于OpenGL ES只是一个渲染库，所以还需要其他功能库配合使用。
GLKView 提供绘制场所(View)
GLKViewController(扩展于标准的UIKit 设计模式. ⽤于绘制视图内容的管理与呈现.)
本节主要已加载图片案例为主。
准备工作
xcode创建一个iOS 项目
在main.storyboard 中将viewcontroller 中的view变为GLKView
使viewcontroller继承GLKViewController
#import <UIKit/UIKit.h>
#import <GLKit/GLKit.h>
@interface ViewController : GLKViewController
{
EAGLContext *context;
// 简单的光源和着色系统（固定着色器）
GLKBaseEffect *effect; //
}
@end
初始化设置
//1.初始化设置
-(void)setupConfig{
//1.初始化openGLEs上下文
context = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES3];
//2.
if (!context) {
NSLog(@"失败");
return;
}
//3.设置当前上下文，可以有多个上下文，但是只能有一个当前上下文
[EAGLContext setCurrentContext:context];
//4. 接管view
GLKView *view = (GLKView *)self.view;
view.context = context;
//4.1颜色缓冲区格式
view.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;
//4.2 深度缓冲区渲染格式， GLKViewDrawableDepthFormat16 和 GLKViewDrawableDepthFormat24两中，值越大z-fighting的概率就越小，但现代设备很少出现z-fighting
view.drawableDepthFormat = GLKViewDrawableDepthFormat24;
//5. 背景色
glClearColor(0, 0, 1, 1);
}
EAGLContext：管理OpenGL ES渲染上下文—状态信息，命令和资源。
设置顶点数据
顶点是空间坐标系中的一个点(x,y,z)。空间中每个点之间的连接方式，可以称为图元装配。而OpenGL ES 支持三种图元，即点、线、三角形。一条线需要两个顶点，三角形需要3个顶点，长方形则需要2两个三角形即6个顶点。
//2.设置顶点数据
-(void) setupVertexData {
//1.顶点数组，在内存中
GLfloat vertexData[] = {
// 顶点坐标 纹理坐标
0.5f, -0.5f, 0.0f, 1.0f, 0.0f, // 右下
0.5f, 0.5f, 0.0f, 1.0f, 1.0f, // 右上
-0.5f, 0.5f, 0.0f, 0.0f, 1.0f, // 左上
0.5f, -0.5f, 0.0f, 1.0f, 0.0f, // 右下
-0.5f, 0.5f, 0.0f, 0.0f, 1.0f, // 左上
-0.5f, -0.5f, 0.0f, 0.0f, 0.0f, // 左上
};
//2.顶点缓冲区 -> GPU显存
GLuint bufferID;
glGenBuffers(1, &bufferID);
//3.绑定顶点缓冲区
glBindBuffer(GL_ARRAY_BUFFER, bufferID);
//4.顶点从内存中复制到顶点缓冲区
glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);
//顶点着色器在服务端的属性是关闭的，所以需要手动开启
//4. 打开顶点数据的通道
glEnableVertexAttribArray(GLKVertexAttribPosition);
//5. 读取顶点数据 顶点缓冲区 -> 顶点着色器
// size
glVertexAttribPointer(GLKVertexAttribPosition,//打开的是哪个属性，现在是顶点
3, // 每次读取vertexData 3个数据
GL_FLOAT,
false,
sizeof(GL_FLOAT) * 5 //步长，间隔多少去从一位数组中取顶点数据
, (GLfloat *)NULL + 0);// 从哪个位置取
//6.打开纹理数据通道
glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
glVertexAttribPointer(GLKVertexAttribTexCoord0, //打开纹理属性
2, //每次从vertexData 2个数据
GL_FLOAT,
false, sizeof(GL_FLOAT) * 5 , //步长
(GLfloat *)NULL + 3);
}
vertexData 顶点数组，左侧为顶点坐标，右侧为纹理坐标。加载纹理（图片）需要纹理坐标与openGLES中的坐标进行一一映射。就如同手机贴膜一样，手机是在OpenGLES坐标系中，手机膜在纹理坐标系中，需要做好映射关系。（OpenGL ES 屏幕中间是原点，纹理坐标左下交是原点）
顶点初始化后是在内存中，根据渲染管线，顶点会从顶点缓冲区复制顶点到顶点着色器。
绑定顶点缓冲区
glBufferData 将顶点会从顶点缓冲区复制顶点到顶点着色器。
参数
target：指定目标缓冲区对象。GL_ARRAY_BUFFER、GL_ELEMENT_ARRAY_BUFFER。
size：指定缓冲区对象的新数据存储的大小（以字节为单位）。
data：指定将复制到数据存储区以进行初始化的数据的指针，如果不复制数据，则指定NULL。
usage指定数据存储的预期使用模式。 GL_STREAM_DRAW，GL_STATIC_DRAW或GL_DYNAMIC_DRAW。
5.在iOS中, 默认情况下，出于性能考虑，所有顶点着色器的属性（Attribute）变量都是关闭的.意味着,顶点数据在着色器端(服务端)是不可用的。必须由glEnableVertexAttribArray 方法打开通道.指定访问属性.才能让顶点着色器能够访问到从CPU复制到GPU的数据。
6.由于我们加载图片需要用到顶点坐标GLKVertexAttribPosition和纹理坐标GLKVertexAttribTexCoord0，所以需要打开这个两个属性。
加载纹理
纹理可以理解为图片，OpenGL读取图片会对图片进行解压获取图片中的RGBA数据存储到帧缓存冲去中
-(void)setUpTexture{
//1.获取图片路径
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"for_test" ofType:@"jpg"];
//2.设置纹理的参数
//翻转坐标系， 纹理坐标原点：左下角，图片的原点：坐上
NSDictionary *options = @{GLKTextureLoaderOriginBottomLeft:@(1)};
//3.加载图片
GLKTextureInfo *textureInfo = [GLKTextureLoader textureWithContentsOfFile:filePath options:options error:nil];
//4. baseEffect 固定着色器，（顶点和片元着色器）
effect = [[GLKBaseEffect alloc] init];
effect.texture2d0.enabled = GL_TRUE;
//把纹理交给固定着色器，
effect.texture2d0.name = textureInfo.name;
}
获取图片路径
设置参数，在ios中我们都知道坐标原点在左上角，而纹理坐标是在坐下角，需要反转下
加载纹理，获取纹理信息
GLKBaseEffect 是iOS提供的固定着色器，只需要将加载的纹理数据交给固定着色器。
渲染
-(void)glkView:(GLKView *)view drawInRect:(CGRect)rect{
glClear(GL_COLOR_BUFFER_BIT );
//准备绘制
[effect prepareToDraw];
//开始绘制
glDrawArrays(GL_TRIANGLES, //图元类型
0, //从第几个顶点开始
6); //顶点数量
}
glkView:drawInRect是GLKViewController的代理方法，必须要实现的。该代理方法会不断地循环调用。
网友评论