版本记录

前言

OpenGL ES图形库项目中一直也没用过，最近也想学着使用这个图形库，感觉还是很有意思，也就自然想着好好的总结一下，希望对大家能有所帮助。下面就开始进行实践，写一些小程序。

新建工程

这个是新手必须面对的问题，我也尝试好几分钟才弄好，下面给出步骤。

• 选择单视图应用

选择单视图应用

• 继承自GLKViewController，建立控制器。

• 添加库

添加几个相关库

上面就是新建工程的步骤，并不难，新手可能不知道要导入哪几个库，我也是上网找的。

代码演示

下面我们就进行代码演示，下面我们就直接看代码。

1. JJOpenGLVC.h

#import <UIKit/UIKit.h>
#import <GLKit/GLKit.h>

@interface JJOpenGLVC : GLKViewController

@end

2. JJOpenGLVC.m

#import "JJOpenGLVC.h"

@interface JJOpenGLVC()

@property (nonatomic ,strong) EAGLContext* context;
@property (nonatomic ,strong) GLKBaseEffect* effect;

@end

@implementation JJOpenGLVC

#pragma mark - Override Base Function

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    //配置上下文等
    [self beginConfig];
    
    //加载顶点着色器数据
    [self loadVertexArray];
    
    //添加纹理
    [self loadTexture];
}

#pragma mark - Object Private Function

//配置上下文等

- (void)beginConfig
{
    //新建OpenGLES 上下文
//    typedef NS_ENUM(NSUInteger, EAGLRenderingAPI)
//    {
//        kEAGLRenderingAPIOpenGLES1 = 1,
//        kEAGLRenderingAPIOpenGLES2 = 2,
//        kEAGLRenderingAPIOpenGLES3 = 3,
//    };
    self.context = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2];
    GLKView* view = (GLKView *)self.view;
    view.context = self.context;
    view.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;  //颜色缓冲区格式
    [EAGLContext setCurrentContext:self.context];
}

//加载顶点着色器数据

- (void)loadVertexArray
{
    //顶点数据，前三个是顶点坐标，后面两个是纹理坐标  GLfloat 就是Float的别名
    GLfloat squareVertexData[] =
    {
        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, //左下
    };
    
    //顶点数据缓存
    GLuint buffer;
    glGenBuffers(1, &buffer);
    glBindBuffer(GL_ARRAY_BUFFER, buffer);
    glBufferData(GL_ARRAY_BUFFER, sizeof(squareVertexData), squareVertexData, GL_STATIC_DRAW);
    
    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);
}

//添加纹理

- (void)loadTexture
{
    //纹理贴图
    NSString *filePath = [[NSBundle mainBundle] pathForResource:@"sea" ofType:@"jpg"];
    
    //GLKTextureLoaderOriginBottomLeft 纹理坐标系是相反的
    NSDictionary *options = [NSDictionary dictionaryWithObjectsAndKeys:@(1), GLKTextureLoaderOriginBottomLeft, nil];
    GLKTextureInfo *textureInfo = [GLKTextureLoader textureWithContentsOfFile:filePath options:options error:nil];
    
    //着色器
    self.effect = [[GLKBaseEffect alloc] init];
    //打开纹理
    self.effect.texture2d0.enabled = GL_TRUE;
    //纹理的名称glGenTextures()
    self.effect.texture2d0.name = textureInfo.name;
}

#pragma mark - GLKViewDelegate

/**
 *  渲染场景代码, 在试图上开始着色并显示
 */

- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect
{
    //四个参数分别为RGBA
    glClearColor(0.7f, 0.2f, 1.0f, 1.0f);
    //清除32位色值
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    
    //启动着色器
    [self.effect prepareToDraw];
    
    //着色的矩阵，第一个参数三角形模式，三个参数均为32位
    glDrawArrays(GL_TRIANGLES, 0, 6);
}

@end

下面我们就看效果图。

效果图

大家如果想要不同的底色，可以任意调整RGBA的值。

 glClearColor(0.7f, 0.2f, 1.0f, 1.0f);

后记

这个是我学习和上网找大神写的第一个相关的小程序，大家凑合着看吧，后续我会继续完善我的理论体系和代码组织水平，谢谢大家。

flower