• 26
    Like
  • 1
    Comment
More than 1 year has passed since last update.

openFrameworks (以下oF)を iOS アプリで使用してみます。

とりあえず、ボタン、ラベル、ログ出力あたりができれば色々と試しやすくなる(と思ってる)ので、そこまでやります。

あと、oF といえばアドオン、みたいな雰囲気があるので、どこかから拾ってきたアドオンを追加する方法も。

(2015.12.18 追記)oF 0.9.0, Xcode 7.2, iOS 9.2 で試して更新しました。

導入(v0.9.0)

  1. oF 公式サイトの download ページから iOS 用のをダウンロード
  2. of_v0.9.0_ios_release.zip を解凍する
  3. examples/ios/emptyExample にあるプロジェクトを開く
  4. ビルド

これで何も処理が書かれていない空白のアプリが実機で動作します。

新規プロジェクト作成

emptyExample を利用

openFrameworks入門 では、emptyExample をリネームして新規プロジェクトとして使う方法が紹介されています。

これでもOKですが、Xcode のプロジェクト名等も直す必要があります。

projectGenerator を利用

コメント欄で教えていただきました。

projectGeneratorっていうソフトウェアが付いてるので、それを使うという方法もあるです。OF_ROOT/projectGenerator/projectGenerator.appにあります。

ちゃんと iOS 用のが、projectGenerator-ios/projectGenerator.app にありました。GUIに従って新規プロジェクトを作成できます。

ログ出力

C++なので普通にprintfとか、

printf("Hello World!\n");

Hello World!

あと std::cout とか。

iOSのプロジェクトなので、NSLogも使えました。

NSLog(@"Hello World!");

2013-12-04 10:23:23.551 emptyExample[1511:70b] Hello World!

(printfプラス、日時がついてくる)

ofLog というクラスもあるようなのですが、それはまた別途。

ラベル(文字列表示)

Bitmapフォントを描画する

ofDrawBitmapString を使用して文字列をビットマップとして描画できます。第2,3引数は描画するx, y座標。

void testApp::draw(){

    ofDrawBitmapString("Hello world!", 100, 100);
}

文字色は、 ofSetColor でRGBで指定します。

void testApp::draw(){

    ofSetColor(0, 0, 0);
    ofDrawBitmapString("Hello world!", 100, 100);
}

TrueTypeフォントを描画する

利用したいフォントファイル(.ttf)を、プロジェクト配下の bin/data フォルダに入れておきます。

ヘッダでメンバ変数を宣言し、

ofTrueTypeFont font;

フォントを読み込みます。第2引数は フォントサイズ

font.loadFont("xxxx.ttf", 30);

あとは drawString メソッドで描画。

font.drawString("Hello world!", 100, 100);

ボタン

ググってみたり、入門書をパラパラみてみた感じだと、oFには標準ではボタンクラスみたいなのが用意されてないようでした。

touchDown とか touchUp といったタッチイベントのハンドラと、あとは図形描画や文字列描画でよしなにやってくれということなのでしょう。

ofxControlPanel とか、GUI系のアドオンがいくつかありそうなので、また別途調べてみます。

アドオンを使用する

  1. アドオンのフォルダごと、addons フォルダに入れる
  2. アドオンをプロジェクトに追加する
  3. 依存アドオン(あれば)も同様にプロジェクトに追加する
  4. ヘッダを #include する

ちなみに Addon を探すには、 ofxAddons というサイトが良さそう。

その他基本事項

  • 画面左上隅が座標原点 (0, 0) となる(UIKitと同様)
  • draw ごとに画面全体が再描画される。
    • つまりずっと表示しておくには draw メソッド内で描画命令を呼び続けないといけない
    • 逆に、消去命令とかはない