OpenGL ESが大変な3Dアプリ開発を楽にするUnity：ここが大変だよiPhone開発（5）（1/5 ページ）

iPhoneゲーム開発に必須のOpenGL ES。そのコーディングに手こずっている方に有用なツールを紹介し簡単なサンプルを作成します

[高浦二三康, 岩田和宏，株式会社コニット]

iPhoneゲーム開発に欠かせないOpenGL ESだが……

　iPhone用のゲーム開発には、OpenGL ES（※）が欠かせません。

※OpenGL ES（OpenGL for Embedded Systems）
携帯情報端末や組み込み向けのOpenGLのサブセット。OpenGLは、一般的に普及しているグラフィックスプログラミング用のC/C++のAPIのこと

　しかし、初めてOpenGL ESを触る人には、結構とっつきにくいのではないでしょうか？ iPhoneで面白いアイデアを思い付き、ゲームアプリを開発したいと思ったときに、プログラマであっても、OpenGL ESを独学で習得することは、多少ハードルが高いことも事実です。

　そこで、連載最終回である今回は、まず新規プロジェクトのテンプレートをカスタマイズしていくことで、ピラミッドを描くプログラムを作ってみましょう。

　また、デザイナやFlash開発者にとっても、OpenGL ESの習得には大幅な時間がかかることが予想されます。そんな人々にとって有用であるゲーム開発プラットフォーム「Unity」も紹介し、その説明（画面構成やメニューなど）をしながら、簡単なサンプルを作成し、実機のiPhoneにインストールして動かします。

UNITY: Overview via kwout

ここが大変だよ。OpenGL ESのiPhoneアプリ

　Unityを紹介する前に、まずはiPhone SDKによる開発で、OpenGL ESを使ったピラミッドの描画をしてみましょう。新規プロジェクト作成にて「OpenGL ES Application」を選びます。

iPhone SDKの［新規プロジェクト］で「OpenGL ES Application」を選択

　プロジェクト名は「GLPyramid」としました。

□ レンダラを生成

　プロジェクトのClassesフォルダを見てみると、ES1Rendererと、ES2Rendererがあると思います。ES2Rendererの方は、OpenGL ES 2.0を用いるときに使用するもので、ES1Rendererを用いるよりも複雑なことが可能です。iPhone3Gでは使えず、iPhone3GSでしか使えません。今回は、ES1Rendererを採用します。

　EAGLView.mのinitWithCoderの中で、レンダラを生成していますが、その際OpenGL ES 2.0が使えるかどうか判定して、使えるならばES2Rendererを、使えなければES1Rendererを指定する仕組みになっています。OpenGL ES 2.0が使えるとしても、initWithCoderの中でES1Rendererを採用するように書き換えてみましょう。

EAGLView.m - (id) initWithCoder:(NSCoder*)coderの中

renderer = [[ES2Renderer alloc] init];
↓
renderer = [[ES1Renderer alloc] init];

□ デフォルトで実装されているアクションを止める

　デフォルトの状態では、虹色の四角形が上下運動します。これを止めましょう。下記の部分をコメントアウトします。

ES1Renderer.m 　- (void) renderの中

//static float transY = 0.0f;
…【中略】…
//glTranslatef(0.0f, (GLfloat)(sinf(transY)/2.0f), 0.0f);
//transY += 0.075f;

　glTranslatef関数は、座標を指定した位置に移動する役割を持っています。この関数の第2引数はy座標を示すもので、ここに毎回0.075ずつ増加するtransYをsinf関数に入れたものを入れることで、上下運動のための座標変換を行っています。コメントアウトして実行すると、上下運動が止まったのが分かります。

□ 視体積を定義

　無限に広がる3D空間の中のどの部分を描画するか（視体積）をglFrustumf関数で定義します。視体積は手前の小さな四角形、奥の大きな四角形に挟まれた空間です。OpenGL ESでは、視点は(0,0,0)となっています。

ES1Renderer.m 　- (void) renderの中

    glMatrixMode(GL_PROJECTION);
    glLoadIdentity();
    
    // 視体積を定義
    glFrustumf(-0.3f, 0.3f, -0.2f, 0.2f, 0.5f, 50.0f);
    
    glMatrixMode(GL_MODELVIEW);
    glLoadIdentity();

　第1引数から順に、以下を表しています。

1. 手前の小さな四角形の左端のx座標
2. 手前の小さな四角形の右端のx座標
3. 手前の小さな四角形の下端のy座標
4. 手前の小さな四角形の上端のy座標
5. 視点から手前の小さな四角形までの距離
6. 視点から奥の四角形までの距離

□ 頂点にz座標のパラメータを追加

　デフォルトではz座標は使わずに、2次元空間にsquareVertices[]で頂点を指定して四角形を描画していました。先ほど視体積を定義したので、2次元空間ではなく3次元空間にオブジェクトが描画されるようになりました。そこで、squareVertices[]の頂点にz座標も追加してみましょう。

ES1Renderer.m 　- (void) renderの中

    static const GLfloat squareVertices[] = {
        -0.5f,  -0.33f, -1.0f,
         0.5f,  -0.33f, -1.0f,
        -0.5f,   0.33f, -1.0f,
         0.5f,   0.33f, -1.0f,
    };

　次に、このsquareVerticesを読み取って頂点を実際に生成している部分を訂正しましょう。デフォルトでは、squareVerticesの要素を2個ずつ読み取って頂点を(x,y)の形で生成します。これを3個ずつ読み取って(x,y,z)の形で生成するように書き換えましょう。

ES1Renderer.m 　- (void) renderの中

    glVertexPointer(2, GL_FLOAT, 0, squareVertices);
↓
    glVertexPointer(3, GL_FLOAT, 0, squareVertices);

　次ページでは、もう少しでOpenGL ESを使ったピラミッドの描画ができます。その後、冒頭で紹介したUnityについて解説します。