iOS OpenGL ES簡單繪製紋理

  

OpenGL 中任何複雜的圖形都是由點,線 和三角形組成的. 那麼一個矩形 就須要有兩個三角形組成.

紋理, 能夠理解爲一張圖片, 我麼能夠將整張or部分圖片繪製到圓形, 矩形等目標圖形中. 

 

下圖表示了頂點數據 對應 的紋理中的點.

左側表明定點數據, 其座標原點是屏幕中央 ; 右側圖片(紋理), 座標原點是左下角

 

GLKBaseEffect讓咱們避開了寫shader Language 着色器語言, 至關於對glsl的封裝

 

typedef struct {
    GLKVector3 positonCoords;//頂點
    GLKVector2 textureCoords;//紋理
}SceneVertex;

@interface GLViewController ()

@property(nonatomic,strong)GLKBaseEffect *baseEffect;
@property(nonatomic,assign)GLuint vertexBufferID;//緩存ID屬性

@end

@implementation GLViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    //1.建立OpenGLE ES上下文
    GLKView *view = (GLKView *)self.view;
    view.context = [[EAGLContext alloc]initWithAPI:kEAGLRenderingAPIOpenGLES2];
    [EAGLContext setCurrentContext:view.context];
    
    //2.GLKBaseEffect屬性, 使咱們不須要編寫shader language(着色器)代碼就能夠簡單完成繪製
    self.baseEffect = [[GLKBaseEffect alloc]init];
    self.baseEffect.useConstantColor = GL_TRUE;//使用靜態顏色繪製
    self.baseEffect.constantColor = GLKVector4Make(1.0f, 1.0f, 1.0f, 1.0f);//設置繪製顏色 rgba
    glClearColor(0.0f, 0.0f, 0.0f, 1.0f);//背景顏色
    
    //3.定點數據
    //矩形的六個頂點
    static const SceneVertex vertices[] = {
        {{1, -1, 0.0f,},{1.0f,0.0f}}, //右下
        {{1, 1,  0.0f},{1.0f,1.0f}}, //右上
        {{-1, 1, 0.0f},{0.0f,1.0f}}, //左上
        
        {{1, -1, 0.0f},{1.0f,0.0f}}, //右下
        {{-1, 1, 0.0f},{0.0f,1.0f}}, //左上
        {{-1, -1, 0.0f},{0.0f,0.0f}}, //左下
    };
    
    //4.生成緩存,併爲緩存提供數據
    glGenBuffers(1, &_vertexBufferID);//申請一個標識符
    glBindBuffer(GL_ARRAY_BUFFER, _vertexBufferID);//將標識符綁定到GL_ARRAY_BUFFER
    glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);//複製定點數據從CPU 到 GPU
    
    glEnableVertexAttribArray(GLKVertexAttribPosition);//頂點緩存數據
    glVertexAttribPointer(GLKVertexAttribPosition, 3, GL_FLOAT, GL_FALSE, sizeof(SceneVertex), NULL + offsetof(SceneVertex, positonCoords));
    glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
    glVertexAttribPointer(GLKVertexAttribTexCoord0, 2, GL_FLOAT, GL_FALSE, sizeof(SceneVertex), NULL + offsetof(SceneVertex, textureCoords));

    
    //5.生成紋理
    //使用GLkit中的GLKTextureInfo方便的生成圖片紋理。
    CGImageRef imageRef = [[UIImage imageNamed:@"1.png"]CGImage];
    //GLKTextureInfo封裝了紋理緩存的信息，包括是否包含MIP貼圖
    //option 防止圖片是倒立了，這個是由於CoreGraphics的座標系問題
    NSDictionary* options = [NSDictionary dictionaryWithObjectsAndKeys:@(1), GLKTextureLoaderOriginBottomLeft, nil];
    GLKTextureInfo *textureInfo = [GLKTextureLoader textureWithCGImage:imageRef options:options error:nil];
    self.baseEffect.texture2d0.name = textureInfo.name;
    self.baseEffect.texture2d0.target = textureInfo.target;
    
    //6.代理, 繪製
    
}

//系統給咱們回調的繪製消息，該方法會一直被調用，和display方法一致
- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect{
   
    //清除背景色
    glClearColor(0.0f,0.0f,0.0f,1.0f);
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    [self.baseEffect prepareToDraw];
    glDrawArrays(GL_TRIANGLES, 0, 6);
    
}

- (void)dealloc{
    GLKView *view = (GLKView *)self.view;
    [EAGLContext setCurrentContext:view.context];
    if (_vertexBufferID != 0) {
        glDeleteBuffers(1, &_vertexBufferID);
        _vertexBufferID = 0;
    }
    
    
}



@end