OpenGL + GLUT講座

2006/09/10

　 OpenGL + GLUT講座　第10回

今回は、前回作った日本語表示対応GLUIを、前々回のアプリケーションに組み込んでみましょう。



まず、「glui.h」と「libglui.a」を日本語表示のものと置換ます。さらにフォントが必要ですので、「sjis.fnt」を追加します。

ついでに、メニュー表示も日本語表示させたいので、「InfoPlist.strings」に日本語言語環境を追加します。





これで、ビルドし実行すると、メニューバーは日本語化され、GLUIも日本語表示可能になります。



ただし、ウインドウバーの表示はGLUTが行うので日本語表示できません。また、Shift JISフォントを使用しているので、ソースファイルのエンコードをShift JISにしておいてください。

今回のソースファイルはこちら（main10.cpp）です。

2006/08/22

　 OpenGL + GLUT講座　第9回

今回は、GLUIでの日本語表示をやってみたいと思います。
もっとも、プログラム初心者の私に、一から日本語表示対応にさせる能力はないので他の方のされている方法を参考させていただきました。

さ〜さんの「GLUI日本語対応計画」

上記リンクより、GLUI version 2 日本語対応版をダウンロードして参考にさせていただきました。また、付属のフォントを流用させていただきました。
ソースコードがWindows用でしたので、Mac OS X用に書き直し、GLUI Version 2.2に組み込みました。

組み込んだついでに、ターミナルから「make」一発でライブラリ・サンプルプログラムまでビルド出来るように、ソースファイル、makefileなどを書き直しました。

ちなみに、makeを確認した環境は、PowerBook G4 Al + Mac OS X 10.4.7 + Xcode 2.4です。その他、ソースのコンパイルなどで色々いじってある環境ですので、もしかしたら他のマシンではコンパイル出来ないかもしれません。

GLUI Version 2.2 日本語表示対応版（Mac OS X 用）

コンパイル不可能な時の為に日本語対応ライブラリを置いておきます
libglui.a（日本語表示対応版 Mac OS X用）+ glui.h

さ〜さんが配布されているファイルの中から「sjis.fnt」を取りだし、適切なディレクトリに配置する事が必要です。

GLUI Version 2.2 日本語表示対応版を「make」して、サンプルプログラムで日本語表示をさせるためには、ホームディレクトリ直下に「sjis.fnt」を置いておく必要があります。

サンプルプログラムは、「bin」ディレクトリに作成されると思います。example1を実行すると、以下のようになります。


このMac OS X版では、EditTextは日本語表示出来ると思いますが、日本語入力には対応できていませんので、あしからず・・・。

念のため、makeの方法を・・・・。 「glui_v2_2_j.tgz」を解凍し、ターミナルから「cd」で解凍したフォルダに移動。
例えば、デスクトップに解凍したのなら「cd ~/Desktop/glui_v2_2_J/」
そのあと「make」。 もし、ビルドエラーが出るようでしたら、エラーメッセージに従い、ソースファイルなどを書き直してください。

Apple Store（Japan）

2006/08/18

　 OpenGL + GLUT講座　第8回

今回は、第6回で作成した正多角形のソースファイルを流用して、GLUIによるユーザーインターフェイスを作成したいと思います。
今回のソースファイルは、こちら（main8.cpp）です。

さっそく、プロジェクトに「libglui.a」と、「glui.h」を組み込みましょう。
以下のようになります。


まず、GLUIのヘッダファイルをインクルードしましょう。

#include "glui.h"

GLUIのv2以降は、メインウインドウの中にUIを組み込む事は出来ますが、今回は別ウインドウを作成します。
この為、以前にも触れていたように、ウインドウを識別させる為の変数などを用意します。

int main_window;
GLUI *glui;
GLUTのウインドウ用と、GLUIのウインドウ用です。

メインウインドウ作成のところで、返り値を設定します。

main_window = glutCreateWindow("Main Window");

「glutReshapeFunc」も、GLUI用に変更します。

GLUI_Master.set_glutReshapeFunc( reshape_func );

この他にも、GLUIを使用する場合はいくつか変更しないといけない部分もありますが、GLUIライブラリのソースファイルについていたサンプルファイルを見ていただければ、ある程度の事は分かると思います。ここでも、いろいろ機能を追加していく過程でおいおい説明したいと思います。

今回は、「GLUI_Window();」中で、GLUIのインターフェイスを用意します。

詳しくは、ソースファイルを見てください。

これをビルドすると、以下のようになります。



多角形の角数を自由自在に操れるのが分かりますね！

OpenGLにしても、GLUTにしても、GLUIにしても、日本語を取り扱えないのが問題ですね。
そこで、次回はGLUIの表示を日本語にしてみたいと思います。

2006/08/17

　 OpenGL + GLUT講座　第7回

今回は、3Dにせずに、いきなりGLUIを使ってみたいと思います。
というのも、たぶん、3Dの表示に関しては、今までやったものにちょっと追加するだけでいいからです。でも、GLUIに関しては、Mac情報少ない気がします。なので。

今回は、GLUIライブラリの準備をしましょう。
必要なものは、GLUIのサイトからダウンロードできます。

http://glui.sourceforge.net/

といっても、ソースファイルですが・・・・。
ダウンロードのところから、Version 2.35のソースと、ついでにVersion 2.2の所にあるPDFのマニュアルをダウンロードしておきましょう。

まずは、Version 2.35のソースからライブラリをビルドします。ターミナルから、srcディレクトリにcdで移動し、makeするだけです。たぶん、サンプルアプリケーションのビルドは失敗すると思いますが、ライブラリがビルドできると思います。ビルドされたライブラリは、「lib」フォルダに「libglui.a」として作られます。
自分のプロジェクトにGLUIを組み込むのに必要なファイルは、この「libglui.a」と、「include」フォルダの中の「GL」フォルダの中にある「glui.h」だけです。

自分でビルドするのは、ターミナルの操作が必要になるので、ビルドしたものを置いておきます。
libglui_2.3.5_Mac_OS_X.tgz

次回は、第6回で作成した多角形の角数を、GLUIのインターフェイスを使って変えてみるというものを作りたいと思います。
このために、第5回のソースファイルを準備したというのは秘密です。

2006/08/16

　 OpenGL + GLUT講座　第6回

今回は、多角形の描画を行います。角数を増やす事で、円みたいにもなります。
とりあえず、今回のソースファイル（main6.cpp）を見てください。

多角形の描画は、以下のコードで行いました。

glBegin(GL_POLYGON);
for(i=0;i glVertex2f(x_hankei*cos(2*PI*i/bunkatusuu),
y_hankei*sin(2*PI*i/bunkatusuu));
glEnd();

sin、cosを使って何角形かによって、その分だけ「glVertex2f」を繰り返させるというものです。
sin、cosを使用する為に、「math.h」をインクルードしておく必要があります。

サンプルでは、「bunkatusuu」に6を指定しているので、6角形になりますが、これを20とか30にしていくと、円みたいになります。

また、今回、正多角形にする為に小細工がしてあります。

具体的には、「glutReshapeFunc」の時に、描画エリアの縦横を取得できるので変数に取得しておき、これで縦横比が出せるので縦横1:1になるように

if( w > h ){
x_hankei = hankei*h/w;
y_hankei = hankei;
}
else{
x_hankei = hankei;
y_hankei = hankei*w/h;
}

で処理をすることで、画面のサイズをどんなにしても、常に正多角形になります。

6角形だとこんな感じ


20角形だとほとんど円に見えます



と、今日はここまで。

次回は、このまま3Dやってもおもしろくないので、いきなりGLUIを組み込んでみたいと思います。

2006/08/14

　 OpenGL + GLUT講座　第5回

3Dに手を出そうかと思ったのですが、ちょっと思うところあって、今回は、ダブルバッファリングと、正多角形の描画を行う事にしました。
まずは、ダブルバッファから。

今の、表示では必要無いのですが、今後アニメーションをさせる場合に画面のちらつきを押さえる必要があるからです。
やり方は、簡単。

glutInitDisplayMode

のところで、

glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE);

と、「GLUT_DOUBLE」を追加します。

あとは、ディスプレイアップデートの部分で、

glFlush();

で描画更新をしていたのを、

glutSwapBuffers();

で行います。
ダブルバッファに関しては、こんなところです。

正多角形の描画は、疲れたので次回（汗）

2006/08/13

　 OpenGL + GLUT講座　第4回

今回は、2Dので各描画方法の説明をしたいと思います。
まず、今回のソースファイル（main4.cpp）を見てください。

OpenGL赤本の説明通り、10種類の書き方で書いてみています


ビルドしてみると、こんな感じになります。


同じように長方形を描くにしても、色んなやり方があるのが分かると思います。

個人的には、3Dの表示の事もそうなのですが、
glBegin(GL_TRIANGLES);
で表示するのが楽です。なぜかというと、3つの座標で１つの面を描けるのですが、他のものでは、順番を考えて書かないとおかしな図形になってしまいますが、これだと、適当に3つ並べるだけでちゃんとした3角形が表示されるからです。4角形書くにも、3角形2つでOKですよね。これを上手に使っていけば、細かい3D表現なども可能になります。
では、今回はこれまで。次回は・・・・そろそろ3Dに手を出しましょうか？

2006/08/11

　 OpenGL 赤本

色んな事が出来そうなのに、私の更新のペースが遅いから、いらいらするという方・・・。
The OpenGL Programming Guide - The Redbook
で勉強してください。これを見れば、もう、あっさりと、色んな事が出来ちゃいます。英語ですが、専門用語ばかりなので、問題ないでしょう。

2006/08/11

　 OpenGL + GLUT講座　第3回

今回は、2D表示に関して行ってみたいと思います。
参考ファイル（main.cpp）をダウンロードして、見てください。
まず、main関数内に、

glutReshapeFunc(reshape_func);
を追加しました。これは、ウインドウサイズが変更された時に合わせて、描画を行うものです。これに合わせて、以下の関数も制作しておきます。

void reshape_func(int width, int height)
{
//表示範囲設定
glViewport(0, 0, width, height);
}
これで、ウインドウサイズが変更されても、それに合わせて描画させます。
では、実際に線を描画させます。

void display_func(void)
関数内に作成します。

glColor3ub(255, 255, 255);
で色の指定を行います。RGBの値を順番に代入します。この0〜255で代入される値は、カラーパレットなどで、どんな色がどの数値か分かるので便利です。テキストエディットなどで簡単に表示させられるパレットなので使ってみてください。


今回のように、すべて255という事は、白ですね。

void glBegin( GLenum mode )
で2Dの描画を行います。詳しくは、Xcodeのオンラインマニュアルから参照してみてください。次回で詳しく説明します。
今回は、「GL_LINES」を設定しました。
これは、単純に線を書くだけです。今回、順に4つ座標を指定しましたが、２つの座標を指定する事で、１つの線を書きます。座標は、自動的に順番に適用されていきます。
今回の例で行けば、1番目の座標から2番目の座標への線を描画、更に、3番目の座標から4番目の座標へ描画といった具合です。
glBeginではじめたら、必ずglEnd();で終わらせてください。その間にある座標が、glBeginの「GLenum mode」で参照され、描画されていきます。

今回のソースコードにより、以下のように作成されたと思います。



次回は、「GLenum mode」の部分に関して、説明します。

2006/08/10

　 OpenGL + GLUT講座　第2回

AppleからXcode 2.4がreleaseされました。ADCのオンライン会員でもダウンロード可能なので、もしダウンロード出来る環境の方は、インストールしておいてください。
とくに、新しい機能を使うわけではありませんが、私の環境が、Mac OS X 10.4.7 + Xcode 2.4ですので、それ以外では、何か違うところがあるかもしれません。

さて、今回は、前回のソースコードの解説をしたいと思います。 その前に、まずXcodeの便利機能を知っておいてください。これを知っていれば、そのAPI（関数）がなにをするのか大体分かります。

やり方は、ソース文中の関数を選択して、「ヘルプ」メニューから、「APIリファレンス内で選択したテキストを検索」を選びます。 そうすると、マニュアルの該当部分が表示されます。便利ですね。

void glutInit(int *argcp, char **argv);

まず、GULTを使用する場合、ライブラリを初期化する為の関数です。それぞれの変数には、main関数で指定したものを代入します。

void glutInitDisplayMode(unsigned int mode);

modeには、今回は「GLUT_RGB」のみを指定しましたが、今後アルファチャネルの表示や3D表示させる場合、「GLUT_RGBA」や「GLUT_DEPTH」を指定します。複数指定可能です。XcodeからAPIリファレンスを参照していただくと、詳しい解説を見る事が出来ると思います。

void glutInitWindowSize(int width, int height);
void glutInitWindowPosition(int x, int y);

これらは、ソース文中の説明通りです。表示させるウインドウサイズと左上端の位置を指定します。

int glutCreateWindow(char *name);

これで、ウインドウを作成します。返り値にintが指定可能な事が分かると思います。今回ウインドウは１つのみですので、特に返り値は指定していませんが、今後GLUIなどで複数のウインドウを作成する場合、intとしてウインドウの識別子が返ってきますので、これを用いて、ウインドウ別の処理を行えます。

void glutDisplayFunc(void (*func)(void));
画面を再描画する関数です。funcに今回は
void display_func(void)
として関数を作成指定しました。今後、ウインドウの描画などを行っていく時に、ここで処理を書いていきます。

void glutMainLoop(void);

ここがGULTのイベントループになります。

と、第1回で行ったのは、本当にミニマムエッセンスのみです。しかし、これに、サンプルコードから引っ張ってきた色々なものを付け加えると、簡単に面白いものが出来ますし、座標さえ指定していけば、思い通りのものが描けます。研究者にとって容易に自分のイメージを表現できる手段としても有用なのではないかと思います。
次回は、2Dで色々なものを描画していこうと思います。

2006/08/08

　 OpenGL + GLUT講座　第1回

こんにちは。
さっそく、作っていきましょう。細かい事は抜きです。
Xcodeを起動し、新規プロジェクトファイルを作成します。どれをえらんでいいのか、よく分からないので（爆）、とりあえず、Cocoa云々を選んでみます。


プロジェクト名を適当に付けます。今回は「GULT」と付けてみました。保存場所も、デスクトップ上に。分かりやすいように。


メインウインドウが開きましたでしょうか？　今回は、OpenGLとGLUTを使用しますので、これらのフレームワークを追加しておきます（下図）


フレームワークは、「/システム/ライブラリ/Frameworks/」の中にあります。

プロジェクトで、Cocoa云々と選んでしまったので、不要なファイルがたくさんプロジェクト中にありますね。。。


削除しましょう・・・。（下図参照）


え？みにくい？　必要なのはこれだけでいいです。


うん、すっきり。
さて、必要なのは、main()関数があるファイルです。Cファイルでもいいのですが、今後の事もあるので、C++のファイルとして作成します。新規ファイル作成から、以下のようにします。




main.cppを作成できましたでしょうか。

それでは、main.cppに以下の文をコピペしてください。

#include <OpenGL/gl.h>
#include <GLUT/glut.h>


void display_func(void)
{

}


int main (int argc, const char * argv[])
{
//初期化
glutInit(&argc, (char **)argv);

glutInitDisplayMode(GLUT_RGB);

//ディスプレイ上でウインドウを表示する場所（左上から）
glutInitWindowPosition (75, 100);

//ウインドウのサイズ横×縦
glutInitWindowSize (400, 300);

//ウインドウの作成
glutCreateWindow("test");

//ディスプレイに表示させる為の云々・・・
glutDisplayFunc(display_func);

//メインループ
glutMainLoop();

return 0;
}


えーと、HTMLで書いちゃうと、なにやら問題があるかもしれないので、サンプルファイル「main.cpp」を置いておきます。

さて、これをビルドしてみましょう。



こんな感じで、真っ白いウインドウが作成できましたでしょうか？
今日は、これまで、また来週？？？

2006.8.7

　 Macで綴るへーぼんな日々復活!?

こんばんは。
久しぶりに、ここのサイトで、物を書く事にしました。

深い理由はありません。ただ、他人のサイトのブログで書いていると、自分の書いたものを、どう保存するのかという、難しい問題に直面したわけです。
また、最近、OpenGLに凝っています。
OpenGLとは、実に簡単なプログラムですので、CocoaもCarbonも必要ありません。
さあ、OpenGLの世界にようこそ！！！


というわけで、不定期連載の始まり（爆）

とりあえず、用意するものは、XCodeです。インストールしておいてくださいね。
あと、Mac OS X 10.4以上が必要なはずです。なぜかというと、OpenGLのアプリを作るといっても、Cocoaで書くわけでも、Carbonで書くわけでもありません。
OpenGL + GLUTで始めます。そして、GLUI、OpenAL、ALUTと、展開していこうと思っています。
僕も素人ですし、今のところ作れているものは、その辺までですので、、、。
いろんな、サンプルコードを引っ張ってきて、作っていくのもいいですね！

さて、Xcodeインストールすんだら、
/Developer/Examples/OpenGL/GLUT/GLUTExamples.xcodeproj
というファイルを開いてください。OoenGL + GLUTのサンプルコードがたくさんあります。
とりあえず、これが何をしているのか？分かる程度になっていてくださいね。
基本てきなC言語の知識はあるものとして書いていきますので、あしからず。