美文网首页
GLKit 加载正方体图形

GLKit 加载正方体图形

作者: 君幸食j | 来源:发表于2020-09-03 20:49 被阅读0次

    首先在 xcode 中新建一个工程,并导入一张图片。然后在 ViewController.m 写入以下代码:

    #import "ViewController.h"
    #import <GLKit/GLKit.h>
    
    typedef struct {
        
        GLKVector3 vertexCoordinate; //顶点坐标
        GLKVector2 textureCoordinate; //纹理坐标
    
    }VertexData;
    
    //顶点数
    static NSInteger const kVertexCount = 36;
    
    @interface ViewController ()<GLKViewDelegate>
    
    @property(nonatomic,strong)GLKView * glkView;
    @property(nonatomic,strong)GLKBaseEffect * baseEffect;
    @property(nonatomic,assign)VertexData * vertices;
    
    @property(nonatomic,strong)CADisplayLink * displayLink;
    @property(nonatomic,assign)NSInteger angle;
    @property(nonatomic,assign)GLuint * vertexBuffer;
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
        
        //1.设置背景颜色
        self.view.backgroundColor = [UIColor blackColor];
        
        //2.设置 OpenGL ES 相关初始化配置
        [self setUpConfig];
        
        //3.图形相关的顶点/纹理坐标数据
        [self setUpVertexData];
        
        //4.添加CADisplayLink
        [self addCADisplayLink];
    }
    
    
    -(void)setUpConfig
    {
        //1.创建context并设置当前context
        EAGLContext * context = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES3];
        [EAGLContext setCurrentContext:context];
        
        //2.创建GLKView并设置代理
        self.glkView = [[GLKView alloc] initWithFrame:CGRectMake(0, 100, self.view.bounds.size.width, self.view.bounds.size.width) context:context];
        self.glkView.backgroundColor = [UIColor clearColor];
        self.glkView.delegate = self;
        
        //3.设置使用的深度缓冲区个数
        self.glkView.drawableDepthFormat = GLKViewDrawableDepthFormat24;
        
        //4.添加GLKView
        [self.view addSubview:self.glkView];
        
        //5.获取纹理图片
        NSString * filePath = [[NSBundle mainBundle] pathForResource:@"mei" ofType:@"jpg"];
        UIImage * image = [UIImage imageWithContentsOfFile:filePath];
        
        //6.设置纹理参数
        NSDictionary * options = @{GLKTextureLoaderOriginBottomLeft:@(YES)};
        GLKTextureInfo * textureInfo = [GLKTextureLoader textureWithCGImage:image.CGImage options:options error:NULL];
        
        //7.创建GLKBaseEffect
        self.baseEffect = [[GLKBaseEffect alloc] init];
        self.baseEffect.texture2d0.name = textureInfo.name;
        self.baseEffect.texture2d0.target = textureInfo.target;
    }
    
    
    -(void)setUpVertexData
    {
        //1.开辟顶点数据空间
        self.vertices = malloc(sizeof(VertexData) * kVertexCount);
        
        //2.设置顶点/纹理坐标数据
        // 前面
        self.vertices[0] = (VertexData){{-0.5, 0.5, 0.5},  {0, 1}};
        self.vertices[1] = (VertexData){{-0.5, -0.5, 0.5}, {0, 0}};
        self.vertices[2] = (VertexData){{0.5, 0.5, 0.5},   {1, 1}};
        
        self.vertices[3] = (VertexData){{-0.5, -0.5, 0.5}, {0, 0}};
        self.vertices[4] = (VertexData){{0.5, 0.5, 0.5},   {1, 1}};
        self.vertices[5] = (VertexData){{0.5, -0.5, 0.5},  {1, 0}};
        
        // 上面
        self.vertices[6] = (VertexData){{0.5, 0.5, 0.5},    {1, 1}};
        self.vertices[7] = (VertexData){{-0.5, 0.5, 0.5},   {0, 1}};
        self.vertices[8] = (VertexData){{0.5, 0.5, -0.5},   {1, 0}};
        self.vertices[9] = (VertexData){{-0.5, 0.5, 0.5},   {0, 1}};
        self.vertices[10] = (VertexData){{0.5, 0.5, -0.5},  {1, 0}};
        self.vertices[11] = (VertexData){{-0.5, 0.5, -0.5}, {0, 0}};
        
        // 下面
        self.vertices[12] = (VertexData){{0.5, -0.5, 0.5},    {1, 1}};
        self.vertices[13] = (VertexData){{-0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[14] = (VertexData){{0.5, -0.5, -0.5},   {1, 0}};
        self.vertices[15] = (VertexData){{-0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[16] = (VertexData){{0.5, -0.5, -0.5},   {1, 0}};
        self.vertices[17] = (VertexData){{-0.5, -0.5, -0.5},  {0, 0}};
        
        // 左面
        self.vertices[18] = (VertexData){{-0.5, 0.5, 0.5},    {1, 1}};
        self.vertices[19] = (VertexData){{-0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[20] = (VertexData){{-0.5, 0.5, -0.5},   {1, 0}};
        self.vertices[21] = (VertexData){{-0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[22] = (VertexData){{-0.5, 0.5, -0.5},   {1, 0}};
        self.vertices[23] = (VertexData){{-0.5, -0.5, -0.5},  {0, 0}};
        
        // 右面
        self.vertices[24] = (VertexData){{0.5, 0.5, 0.5},    {1, 1}};
        self.vertices[25] = (VertexData){{0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[26] = (VertexData){{0.5, 0.5, -0.5},   {1, 0}};
        self.vertices[27] = (VertexData){{0.5, -0.5, 0.5},   {0, 1}};
        self.vertices[28] = (VertexData){{0.5, 0.5, -0.5},   {1, 0}};
        self.vertices[29] = (VertexData){{0.5, -0.5, -0.5},  {0, 0}};
        
        // 后面
        self.vertices[30] = (VertexData){{-0.5, 0.5, -0.5},   {0, 1}};
        self.vertices[31] = (VertexData){{-0.5, -0.5, -0.5},  {0, 0}};
        self.vertices[32] = (VertexData){{0.5, 0.5, -0.5},    {1, 1}};
        self.vertices[33] = (VertexData){{-0.5, -0.5, -0.5},  {0, 0}};
        self.vertices[34] = (VertexData){{0.5, 0.5, -0.5},    {1, 1}};
        self.vertices[35] = (VertexData){{0.5, -0.5, -0.5},   {1, 0}};
        
        //3.开辟数据缓存区
        glGenBuffers(1, &_vertexBuffer);
        glBindBuffer(GL_ARRAY_BUFFER, _vertexBuffer);
        GLsizeiptr bufferSize = sizeof(VertexData) * kVertexCount;
        glBufferData(GL_ARRAY_BUFFER, bufferSize, self.vertices, GL_STATIC_DRAW);
        
        //4.设置顶点数据读取方式
        glEnableVertexAttribArray(GLKVertexAttribPosition);
        glVertexAttribPointer(GLKVertexAttribPosition, 3, GL_FLOAT, GL_FALSE, sizeof(VertexData), NULL + offsetof(VertexData, vertexCoordinate));
        
        //5.设置纹理坐标读取方式
        glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
        glVertexAttribPointer(GLKVertexAttribTexCoord0, 2, GL_FLOAT, GL_FALSE, sizeof(VertexData), NULL + offsetof(VertexData, textureCoordinate));
    }
    
    
    -(void)addCADisplayLink
    {
        self.angle = 0;
        self.displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(update)];
        [self.displayLink addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];
    }
    
    
    -(void)update
    {
        //1.计算旋转的度数(度数->弧度)
        self.angle = (self.angle + 5) % 360;
        
        //2.修改GLKBaseEffect中模型视图矩阵堆栈
        self.baseEffect.transform.modelviewMatrix = GLKMatrix4MakeRotation(GLKMathDegreesToRadians(self.angle), 0.3f, 1.0f, -0.7f);
        
        //3.重新渲染
        [self.glkView display];
    }
    
    
    -(void)dealloc
    {
        //1.设置EAGLContext为nil
        if ([EAGLContext currentContext] == self.glkView.context)
        {
            [EAGLContext setCurrentContext:nil];
        }
        
        //2.释放顶点数据
        if (_vertices)
        {
            free(_vertices);
            _vertices = nil;
        }
        
        //3.删除缓存区
        if (_vertexBuffer)
        {
            glDeleteBuffers(1, &_vertexBuffer);
            _vertexBuffer = 0;
        }
        
        //4.停止CADisplayLink
        [self.displayLink invalidate];
    }
    
    
    #pragma mark - GLKViewDelegate
    - (void)glkView:(GLKView *)view drawInRect:(CGRect)rect
    {
        //1.开启深度测试
        glEnable(GL_DEPTH_TEST);
        
        //2.清除颜色/深度缓存区
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
        
        //3.准备绘制
        [self.baseEffect prepareToDraw];
        
        //4.开始绘制
        glDrawArrays(GL_TRIANGLES, 0, kVertexCount);
    }
    
    @end
    
    运行程序效果如下: 旋转立方体.png 以下是程序的思维导图: 思维导图.png

    相关文章

      网友评论

          本文标题:GLKit 加载正方体图形

          本文链接:https://www.haomeiwen.com/subject/kdnosktx.html