前回解説したこちらの「頂点配列を使った三角形の描画」では色が設定されていません(デフォルトの白のまま)でした。
(Mac・iPhone)頂点配列を使った三角形の描画 - 強火で進め
http://d.hatena.ne.jp/nakamura001/20081221/1229857148
今回はこちらの三角形に色を付ける方法を解説します。
基本的には前回のものとの差分について解説します。今回のサンプルコードはこちらにMac版、iPhone版がありますのでダウンロードして下さい。
Mac版の解説
追加するコマンドは以下の2つだけです。
glColorPointer(4, GL_UNSIGNED_BYTE, 0, triangleColors); glEnableClientState(GL_COLOR_ARRAY);
glColorPointer() でカラー配列をを設定し、 glEnableClientState(GL_COLOR_ARRAY) で有効化します。
glColorPointer()の引数は先頭から順番に
- カラー情報の数(RGBで表現する場合は3、RGBAで表現する場合は4となります。なおRGBで指定した場合のA(アルファ値)は常に255となります)
- データの型
- オフセット(配列のどの部分から使用するかを指定)
- 実際にカラー情報を格納した配列へのポインタ
カラー情報はR、G、B、Aの順番で指定します。
今回はデータの型を GL_UNSIGNED_BYTE としたので値の範囲は 0〜255 となります。今回は赤、緑、青の順で指定しています。
// カラー配列情報 const GLbyte triangleColors[] = { 255, 0, 0, 255, // 1つ目のカラー情報(RGBA) 0, 255, 0, 255, // 2つ目のカラー情報(RGBA) 0, 0, 255, 255, // 3つ目のカラー情報(RGBA) };
こちらの実際の描画を実行している glDrawArrays() にはまったく変更はありません。
glDrawArrays(GL_TRIANGLES, 0, 3);
こちらのコマンドは
- カラー配列のデータが設定されている
- カラー配列が有効化されている
の条件が整っていればカラー情報を使いますがそれ以外の場合は「デフォルトの白で描画される」というルールになっているようです。
なお、RGBの3つのデータで指定する事もでき、その場合はカラー配列はRGBのみの指定となり、
const GLbyte triangleColors[] = { 255, 0, 0, // 1つ目のカラー情報(RGB) 0, 255, 0, // 2つ目のカラー情報(RGB) 0, 0, 255, // 3つ目のカラー情報(RGB) };
データ数の指定も3にする変更で設定できます。
glVertexPointer(3, GL_FLOAT, 0, triangleVertices);
※なおこちらはiPhoneで指定した場合、正しく描画されませれませんでした。おそらくiPhone(OpenGL ES)では対応していないのではないかと思います。iPhoneの場合はRGBAで指定しましょう。
