OpenGLES(二)- GLKit: 纹理贴图
运行结果
思维导图
准备工作
代码语言:javascript复制//1.导入头文件
#import <GLKit/GLKit.h>
#import <OpenGLES/ES3/gl.h>
#import <OpenGLES/ES3/glext.h>
//2.将控制器(UIViewController)改为GLKViewController
//3.创建私有属性
EAGLContext *content;
GLKBaseEffect *bEffect;
以下配置上下文、配置坐标、加载纹理数据都是在-viewDidLoad中调用
配置上下文
代码语言:javascript复制//创建EAGL上下文,并设置使用GLES3标准
content = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES3];
if (!content){
NSLog(@"create eagl failed");
return;
}
//创建GLKView
GLKView *view = (GLKView *)self.view;
view.context = content;
//将content设置为当前EAGLContext
[EAGLContext setCurrentContext:content];
//设置GLKView的缓存区参数
view.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;
view.drawableDepthFormat = GLKViewDrawableDepthFormat24;
glClearColor(0.3, 0.2, 0.7, 1);
配置坐标
代码语言:javascript复制GLfloat versArr[] = {
-0.6, -0.5, 0.0f, 0.0f, 0.0f, //左下
0.6, -0.5, 0.0f, 1.0, 0.0, //右下
0.6, 0.5, 0.0f, 1.0, 1.0, //右上
0.6, 0.5, 0.0f, 1.0, 1.0, //右上
-0.6, 0.5, 0.0f, 0.0, 1.0, //左上
-0.6, -0.5, 0.0f, 0.0f, 0.0f, //左下
};
//创建顶点缓冲区
//创建顶点缓存区标识符ID
GLuint bufferId;
glGenBuffers(1, &bufferId);
//绑定缓冲区为顶点缓存区
glBindBuffer(GL_ARRAY_BUFFER, bufferId);
//将顶点数组copy进顶点缓存区
glBufferData(GL_ARRAY_BUFFER, sizeof(versArr), versArr, GL_STATIC_DRAW);
//允许顶点着色器访问顶点缓存区的Position数据
glEnableVertexAttribArray(GLKVertexAttribPosition);
//将顶点数据读入顶点着色器
/*
将顶点缓存区的数据上传到顶点着色器
index: 指定修改的顶点缓存区属性索引值
size: 每次读取的数量(如position是由3个(x,y,z)组成,而颜色是4个(r,g,b,a),纹理则是2个(x,y).)
type: 指定数组中每个组件的数据类型。
normalized: 指定当被访问时,固定点数据值是否应该被归一化(GL_TRUE)或者直接转换为固定点值(GL_FALSE)
stride:步长,第一个点的X值距离下一个点的X值的数组下标偏移量
ptr:指定一个指针,指向数组中第一个顶点属性的第一个组件。初始值为0
*/
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);
加载纹理数据
代码语言:javascript复制NSString *filePath = [[NSBundle mainBundle] pathForResource:@"cat" ofType:@"jpg"];
/*
GLKTextureLoaderOriginBottomLeft:
纹理坐标原点是左下角,但是图片显示原点应该是左上角.
此键指定是否应垂直翻转图像数据以匹配OpenGL的坐标系。
如果为否,则不翻转图像数据。如果是,则在加载图像数据之前将其翻转。
GLKTextureLoaderGenerateMipmaps:
是否开启mipmap
*/
NSDictionary *option = [NSDictionary dictionaryWithObject:@(1) forKey:GLKTextureLoaderOriginBottomLeft];
//读取纹理文件
GLKTextureInfo *info = [GLKTextureLoader textureWithContentsOfFile:filePath options:option error:nil];
//创建固定效果器(着色器)
bEffect = [[GLKBaseEffect alloc] init];
//将纹理绑定到效果器上
bEffect.texture2d0.enabled = GL_TRUE;
bEffect.texture2d0.name = info.name;
GLKViewDelegate代理方法
代码语言:javascript复制- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
//效果器(固定着色器)准备绘制
[bEffect prepareToDraw];
glDrawArrays(GL_TRIANGLES, 0, 6);
}