iOS開発-OpenGL ES入門チュートリアル4

チュートリアル

OpenGL ES入門チュートリアル1-Tutorial 01-GLKit OpenGL ES入門チュートリアル2-Tutorial 02-shader入門OpenGL ES入門チュートリアル3-Tutorial 03-3 D変換今回はGLKitを使って、グラフィック変換、テクスチャマップ、シェーディング、深度テスト(コードはこちら)をより簡単に実現します.
OpenGL ESシリーズチュートリアルはこちらです.OpenGL ESシリーズチュートリアルのコードアドレス-あなたのstarとforkは私のソースで、あなたの意見は私をもっと遠くに行かせることができます.

効果の表示

コア構想

GLKitを使用してグラフィック変換、テクスチャマップロード、深度テストを行い、GLKBaseEffectを使用してテクスチャマップを管理し、シェーディングを行います.

詳細

1、頂点のプロパティ

typedef NS_ENUM(GLint, GLKVertexAttrib)
{
    GLKVertexAttribPosition,
    GLKVertexAttribNormal,
    GLKVertexAttribColor,
    GLKVertexAttribTexCoord0,
    GLKVertexAttribTexCoord1
} NS_ENUM_AVAILABLE(10_8, 5_0);

GLKEffectsで使用される頂点プロパティは定義されており、使用時に直接列挙量で値を割り当てます.次の図では、頂点の位置、色、テクスチャ座標を直接割り当てます.

    glEnableVertexAttribArray(GLKVertexAttribPosition);
    glVertexAttribPointer(GLKVertexAttribPosition, 3, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 8, (GLfloat *)NULL);
    // 
    glEnableVertexAttribArray(GLKVertexAttribColor);
    glVertexAttribPointer(GLKVertexAttribColor, 3, GL_FLOAT, GL_FALSE, 4 * 8, (GLfloat *)NULL + 3);
    
    glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
    glVertexAttribPointer(GLKVertexAttribTexCoord0, 2, GL_FLOAT, GL_FALSE, 4 * 8, (GLfloat *)NULL + 6);

2、テクスチャ

カスタムshaderでテクスチャを使用するには、CoreGraphicsで画像をbitmapdataに変換し、テクスチャメモリを申請し、画像データを転送し、最後にbitmapdataを解放する必要があります.GLKitでは、次の3行のコードだけでテクスチャのロードを完了できます.

    // 
    NSString* filePath = [[NSBundle mainBundle] pathForResource:@"for_test" ofType:@"png"];
    NSDictionary* options = [NSDictionary dictionaryWithObjectsAndKeys:@(1), GLKTextureLoaderOriginBottomLeft, nil];
    GLKTextureInfo* textureInfo = [GLKTextureLoader textureWithContentsOfFile:filePath options:options error:nil];

GLKTextureLoaderOriginBottomLeftパラメータは、テクスチャ座標系と世界座標系の原点が異なるため、テクスチャの上下が逆転しないようにします.
最後にシェーダを作成し、テクスチャを有効にし、作成したtextureInfoのnameをシェーダに割り当てます.

    // 
    self.mEffect = [[GLKBaseEffect alloc] init];
    self.mEffect.texture2d0.enabled = GL_TRUE;
    self.mEffect.texture2d0.name = textureInfo.name;

3、図形変換

OpenGL ESでは,グラフィック変換の表現形式がマトリクス操作であり,GLKitも多くのマトリクス操作関数を提供している.

    // 
    CGSize size = self.view.bounds.size;
    float aspect = fabs(size.width / size.height);
    GLKMatrix4 projectionMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(90.0), aspect, 0.1f, 10.f);
    projectionMatrix = GLKMatrix4Scale(projectionMatrix, 1.0f, 1.0f, 1.0f);
    self.mEffect.transform.projectionMatrix = projectionMatrix;
    
    GLKMatrix4 modelViewMatrix = GLKMatrix4Translate(GLKMatrix4Identity, 0.0f, 0.0f, -2.0f);
    self.mEffect.transform.modelviewMatrix = modelViewMatrix;
    

GLKMatrix4MakePerspectiveはパース投影変換GLKMatrix4Translateはパン変換

/**
 *   
 */
- (void)update {
    GLKMatrix4 modelViewMatrix = GLKMatrix4Translate(GLKMatrix4Identity, 0.0f, 0.0f, -2.0f);
    
    modelViewMatrix = GLKMatrix4RotateX(modelViewMatrix, self.mDegreeX);
    modelViewMatrix = GLKMatrix4RotateY(modelViewMatrix, self.mDegreeY);
    modelViewMatrix = GLKMatrix4RotateZ(modelViewMatrix, self.mDegreeZ);
    
    self.mEffect.transform.modelviewMatrix = modelViewMatrix;
}

シーン変換関数では,GLKMatrix4RotateYがY軸回りに回転し,その他の分はそれぞれX軸回り,Z軸回りに回転する.

4、深さテスト

前のチュートリアルで説明したように、深度テストを開くには、深度テストのバッファを割り当て、対応するフレームバッファにマウントする必要があります.GLKitコードでは,深さテストのオンは非常に簡単である.glEnable(GL_DEPTH_TEST);を呼び出して、新しいコンテキストで深さテストを開始します.

    // OpenGL ES  
    self.mContext = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2];
    
    GLKView* view = (GLKView *)self.view;
    view.context = self.mContext;
    view.drawableColorFormat = GLKViewDrawableColorFormatRGBA8888;
    view.drawableDepthFormat = GLKViewDrawableDepthFormat24;
    
    [EAGLContext setCurrentContext:self.mContext];
    glEnable(GL_DEPTH_TEST);
    

シーンをレンダリングする場合は、glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glClearパラメータをGL_DEPTH_BUFFER_BITに追加します.

/**
 *   
 */
- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect {
    glClearColor(0.3f, 0.3f, 0.3f, 1.0f);
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    
    
    [self.mEffect prepareToDraw];
    glDrawElements(GL_TRIANGLES, self.mCount, GL_UNSIGNED_INT, 0);
}

まとめ

OpenGL ESの入門はもう少なく、後には多くの知識があり、必要に応じて勉強すればいい.このいくつかのチュートリアルをまとめるのに1週間ほどかかりました.学習の過程で最もつらい部分はいくつかあります.

第1部はOpenGL ESの頂点属性、テクスチャマップであり、頂点から図形への過程が理解されず、OpenGL ESのデータキャッシュメカニズムが理解されず、無知は人に困難を知らせやすく退く.

第2部はshaderとglslで、glslはデバッグできない、コンパイル情報は表示できない、文法が分からないなど、1.0+1は間違いを報告するが、自分はわけがわからず、二分注釈コードで問題を特定するしかなく、特に気を落とす.

第3部はOpenGLESの3次元グラフィック変換や光照射などであり、この部分は数学知識や物理知識が多く、コードは一般的に簡単である.この部分は前よりも難しいですが、どこが欠けているか知っているので、分かりませんが、慌てず、ちょっとつらいだけです.

最後の感想は、コンピュータグラフィックと線形代数は結局基礎であり、自分で多くの時間をかけて勉強し、核心競争力に育成するのは非常に良い.