控制器使用GLKViewController

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

@interface ViewController : GLKViewController

@end

//.m檔案
#import <OpenGLES/ES3/gl.h>
#import <OpenGLES/ES3/glext.h>

@interface ViewController ()

@end

@implementation ViewController
{
    EAGLContext *_content;//上下文
    GLKBaseEffect *effect;//繪製工具類
}
複製程式碼
 

1.初始化上下文&設定當前上下文

- (void)setBaseContent{
    //creat context
    _content = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES3];
    if (!_content){
        NSLog(@"content failed");
    }
    //set context
    [EAGLContext setCurrentContext: _content];
    //view 關聯context
    //注意:ViewController在storyBoard內,其view型別修已經改為了GLKView
    GLKView *glkView = (GLKView *)self.view;
    glkView.context = _content;
    //清屏顏色
    glClearColor(0.5,0.5,1.0);
}
複製程式碼
 

在初始化context時，我們需要選擇我們使用的OpenGL ES的版本，分別有如下幾種：

     kEAGLRenderingAPIOpenGLES1 = 1,固定管線
     kEAGLRenderingAPIOpenGLES2 = 2,kEAGLRenderingAPIOpenGLES3 = 3,複製程式碼

EAGLContext是蘋果iOS平臺下實現OpenGL ES渲染層。其中kEAGLRenderingAPIOpenGLES1類似前幾篇文章說的固定管線。而kEAGLRenderingAPIOpenGLES2和kEAGLRenderingAPIOpenGLES3，在這裡使用哪個，區別不大，只是版本不同而已。

下面需要配置檢視建立的渲染緩衝區，以及設定背景顏色

glkView.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;
glkView.drawableDepthFormat = GLKViewDrawableDepthFormat24;
複製程式碼

drawableColorFormat: 顏色緩衝區格式 在OpenGL ES中有一個快取區，它用以儲存在螢幕中顯示的顏色。你可以使用其屬性設定緩衝區中的每個畫素的顏色格式。 GLKViewDrawableColorFormatRGBA8888 = 0 預設值，緩衝區的每個畫素的最小組成部分(RGBA)使用8個bit，(所以每個畫素4個位元組， 4*8個bit) GLKViewDrawableColorFormatRGB565 如果你的APP允許更小範圍的顏色，即可設定這個。會讓你的APP消耗更小的資源(記憶體和處理時間)

drawableDepthFormat: 深度快取區格式 GLKViewDrawableDepthFormatNone = 0,意味著完全沒有深度緩衝區 GLKViewDrawableDepthFormat16,GLKViewDrawableDepthFormat24,如果你要使用這個屬性（一般用於3D遊戲），你應該選擇GLKViewDrawableDepthFormat16或GLKViewDrawableDepthFormat24。這裡的差別是使用GLKViewDrawableDepthFormat16將消耗更少的資源

載入紋理資料(使用GLBaseEffect)

使用本地圖片作為紋理

- (void)loadTexture{
    //讀取圖片紋理
    NSString *filePath = [[NSBundle mainBundle] pathForResource: @"summerDay" ofType: @"png"];
    //設定紋理引數
    NSDictionary *options = [NSDictionary dictionaryWithObjectsAndKeys: @(1),GLKTextureLoaderOriginBottomLeft,nil];
    //紋理資訊類
    GLKTextureInfo *texInfo = [GLKTextureLoader textureWithContentsOfFile: filePath options:options error:nil];
    //GLKit 提供GLKBaseEffect 完成著色器工作(頂點/片元)
    effect = [[GLKBaseEffect alloc] init];
    effect.texture2d0.enabled = GL_TRUE;
    effect.texture2d0.name = texInfo.name;
}
複製程式碼

注意: 在設定紋理引數的時，需要注意一點，紋理座標預設左下角為原點(0,0)，而iOS座標系中，預設手機螢幕的左上角為原點(0,0)，所以需要特別注意這一點，需要設定GLKTextureLoaderOriginBottomLeft，不然圖片顯示的時候，會發生翻轉。

載入頂點&紋理資料

設定繪製的頂點/紋理資料

- (void)setDrawContent{
    //1.設定頂點陣列
    GLfloat vertexData[] = {
        0.5,-0.5,0.0f,1.0f,//右下
        0.5,-0.0f,//右上
        -0.5,//左上
        0.5,//右下
        -0.5,//左上
        -0.5,//左下
    };
    //2.開闢頂點緩衝區
    //建立頂點快取區識別符號ID
    GLuint bufferId;
    glGenBuffers(1,&bufferId);
    //繫結頂點快取區
    glBindBuffer(GL_ARRAY_BUFFER,bufferId);
    //將頂點陣列的資料copy到頂點快取區中(GPU視訊記憶體中)
    glBufferData(GL_ARRAY_BUFFER,sizeof(vertexData),vertexData,GL_STATIC_DRAW);
    
    //3.開啟屬性通道讀取對應資料.
    //頂點資料
    glEnableVertexAttribArray(GLKVertexAttribPosition);
    glVertexAttribPointer(GLKVertexAttribPosition,3,GL_FLOAT,GL_FALSE,sizeof(GLfloat) * 5,(GLfloat *)NULL + 0);
    //紋理資料
    glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
    glVertexAttribPointer(GLKVertexAttribTexCoord0,2,(GLfloat *)NULL + 3);
}
複製程式碼

• 這個案例中，我們把頂點座標、紋理座標放在同一陣列中，也可以分開,但是為了簡化程式碼量，所以選擇放在一起寫。
• 開闢頂點緩衝區，主要目的是為了追求效能更高，提前分配一塊視訊記憶體，將頂點資料預先傳入到視訊記憶體中，而關於頂點相關的計算都是在GPU中進行的，所以這樣效能有了很大的提高。
• 方法glVertexAttribPointer表示上傳頂點資料到視訊記憶體的方法，即設定合適的方式從buffer裡讀取資料。

引數1: 指定要修改的屬性的索引值
引數2: 每次讀取數量(如position是由3個（x,y,z）組成，而顏色是4個（r,g,b,a）,紋理則是2個.)
引數3: 指定陣列中每個元件的資料型別。可用的符號常量有GL_BYTE,GL_UNSIGNED_BYTE,GL_SHORT,GL_UNSIGNED_SHORT,GL_FIXED,和 GL_FLOAT，初始值為GL_FLOAT。
引數4: 指定當被訪問時，固定點資料值是否應該被歸一化（GL_TRUE）或者直接轉換為固定點值（GL_FALSE）
引數5: 指定連續頂點屬性之間的偏移量。如果為0，那麼頂點屬性會被理解為：它們是緊密排列在一起的。初始值為0 引數6: 指定一個指標，指向陣列中第一個頂點屬性的第一個元件。初始值為0

上述程式碼中，對於頂點來說，每次讀取3個，資料型別為浮點型，偏移量即讀取下一組頂點資料，需要移動5個位置，頂點讀取位置對應從陣列的一開始讀取，所以最後一個引數寫成(GLfloat *)NULL + 0，這裡這樣的寫法是為了方便讀者理解，也可以直接寫成NULL。所以對於紋理的最後一個引數寫成(GLfloat *)NULL + 3也不難理解。

注意點：

在iOS中，預設情況下，出於效能考慮，所有頂點著色器的屬性(Attribute)變數都是關閉的，意味著，頂點資料在著色器（服務端）是不可用的。即使你已經使用glBufferData方法，將頂點資料從記憶體拷貝到頂點緩衝區中(GPU視訊記憶體中); 所以，必須由glEnableVertexAttribArray方法開啟通道，指定訪問屬性，才能讓頂點著色器能夠訪問到從CPU複製到GPU的資料。 注意： 資料在GPU端是否可見，即著色器能否讀取到資料，由是否啟用了對應的屬性決定，這就是glEnableVertexAttribArray的功能，允許頂點著色器讀取GPU（服務端）資料。 GLKVertexAttribPosition,// 頂點 GLKVertexAttribNormal,// 法線 GLKVertexAttribColor,// 顏色 GLKVertexAttribTexCoord0,// 紋理 GLKVertexAttribTexCoord1

繪製檢視的內容

- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect {
    //1.清除顏色快取區
    glClear(GL_COLOR_BUFFER_BIT);
    //2.準備繪製
    [cEffect prepareToDraw];
    //3.開始繪製
    glDrawArrays(GL_TRIANGLES,6);
}
複製程式碼

OK，案例內容結束，下面看實現效果（其實就是我們平時用UIImageView載入一張圖片而已）