openFrameworks＋ofxiPhoneでiPhone・iPad用Hello, world!: Kawanet Blog II

2011年01月12日

openFrameworks＋ofxiPhoneでiPhone・iPad用Hello, world!

openFrameworks では、Windows・Mac 向けアプリに限らず、ofxiPhone アドオンで
iPhone・iPod touch・iPad 上で稼働するアプリケーションを開発することができます。
OpenCV など openFrameworks のライブラリを手軽に iPhone 上で使えるらしい。

今日は、Mac OS X 10.6 (Snow Leopard)で、openFrameworks 0.062 を使って
iPhone 4・iPad 上で Hello, world! するまでの手順を確認してみます。

http://kawa.at.webry.info/201101/article_1.html
openFrameworks で Hello, world! してみる (Mac OS X)
http://kawa.at.webry.info/201101/article_2.html
openFrameworks＋ofxKinect アドオンで Kinect の深度センサーを試す
http://kawa.at.webry.info/201101/article_3.html
openFrameworks＋ofxiPhoneでiPhone・iPad用Hello, world!　（※本記事）

1. まだインストールされてなければ Xcode をインストールする

http://developer.apple.com/devcenter/mac/index.action
から最新の『Xcode 3.2.5 and iOS SDK 4.2 Nov 22, 2010』を選択し、
xcode_3.2.5_and_ios_sdk_4.2_final.dmg をダウンロードする。
インストールは20～30分くらいかかるかも。気長に待つ。
ダウンロードには、Apple のディベロッパー登録が必要です。（これは無料）

2. openFrameworks のパッケージをダウンロードする

http://www.openframeworks.cc/download
から最新の『iphone: iPhone 0062 FAT』を選択し、
http://www.openframeworks.cc/versions/preRelease_v0.062/of_preRelease_v0062_iphone_FAT.zip
をダウンロードして展開する。
展開先は Documents（書類）の中でも、デスクトップでもどこでも OK。

3. ディレクトリ構成を確認する

of_preRelease_v0062_iphone_FAT フォルダの中身は以下のようになります。

addon - アドオン（プラグイン的なライブラリ）が入っています
apps - サンプルアプリが入っています。
libs - openFramework 本体と標準ライブラリが入っています
scripts - iPhone 版では使えないみたい
xcode templates - iPhone 版では使えないみたい

このうち、アプリ開発者が主に使うのは、apps になります。
自分のアプリもここに入れて、ディレクトリ階層レベルを揃えると分かりやすい。

4. サンプルアプリを実行してみる

iPhone 版では buildAndRunAllExamples.sh が使えません。
apps/iPhoneExamples/advancedGraphics フォルダの
iPhoneAdvancedGraphicsExample.xcodeproj を開きます。

概要欄が『Base SDK Missing』となっているので、
概要欄を alt＋クリックして、ベース SDK を選択します。
アクティブ SDK『iOS シミュレータ 4.2』を選択すると、
以下の構成に変わります。

Simulator
アクティブな構成：Debug
アクティブターゲット：emptyExample
アクティブな実行可能ファイル：emptyExample - iPhone Simulator 4.2
アクティブアーキテクチャ：i386

そこで「ビルドと実行」ボタンを押すと、iPhone シミュレータが起動して、
以下のような画面になれば成功です！

場合によっては、libs/openFrameworksCompiled/project/iphone フォルダにある
iPhone+OF Lib.xcodeproj を別途、ビルドしておく必要があるかしれません。

5. iPhone 実機で実行してみる

iPhone シミュレータでなくて、iPhone や iPad 実機で実行してみましょう。
gihyo.jp の目指せ！iPhoneアプリ開発エキスパートの記事などを参考に、実機で動かせる環境を作ります。

＜余談＞自分の iPhone 上で動くアプリを自分の Mac で開発するだけなのに、
Apple に 10,800円を払わなければならないのは、ちょっと残念な感じですが、
「このまま AppStore で販売もできるから」と自分に言い聞かせます。＜／余談＞

準備ができたら、iPhoneAdvancedGraphicsExample.xcodeproj を開きます。
iPhone 実機を USB ケーブルで Mac に接続してから、
概要欄を alt＋クリックして、アクティブ SDK『iOS 4.2』を選択すると、
以下の構成に変わります。

Device
アクティブな構成：Debug
アクティブターゲット：emptyExample
アクティブな実行可能ファイル：emptyExample - iPhoneの名前
アクティブアーキテクチャ：armv6

改めて「ビルドと実行」ボタンを押すと、
コンパイルされたアプリが自動的に iPhone 実機に転送されて、起動します。
実機にいちいちコピーとかしなくて動作確認できて、楽ですね！

6. iPad で実行してみる

上記 5. の状態で、iPad を接続していれば、iPad でもアプリを実行できます。
デフォルトでは、iPhone 3G/3GS 用アプリを iPad で実行したちょっと残念な状態になります。

グループとファイル＞ターゲット＞emptyExample を選択し、
ターゲット＞現在のターゲットをiPad用にアップグレード を実行すると、
openFrameworks の iPhone アプリも iPad 両対応に変換できます。

ただし、iPhone 4（Retinaディスプレイ）の対応手順は、確認できていません。

7. 「Hello, openFrameworks!」を作る

その他のサンプルアプリもひと通り試してみたら、自分のアプリを作ってみます。
0062 の iPhone 版のプロジェクトテンプレートは、うまく使えないようです。
そこで、テンプレートを使わずに、新しいプロジェクトを作成します。

apps/iPhoneExamples/emptyExample フォルダをまるごと
apps/myapps/hello2 などとコピーします。
コピーした iPhoneEmptyExample.xcodeproj を開き、
プロジェクト＞名称変更＞プロジェクト名を変更：
に新しいプロジェクト名『hello2』を入力すると、
hello2.xcodeproj など必要なファイル名を一括変更してくれます。

次に、src/testApp.mm を開き、draw メソッドを書き換えます。

void testApp::draw(){
ofDrawBitmapString("Hello, openFrameworks!", 80, 240);
}

「ビルドと実行」ボタンを押して、右の表示が出れば成功です！

Mac OS X 版の openFrameworks アプリと同様に、
iPhone 上でもTrue Type フォントも利用可能です。
（デフォルトではジャギーが多いので、そのままでは
ちょっと使いにくいかもしれない）

大事なのは、testApp.mm（iOS用ソースコード）と
testApp.cpp（Mac OS X用ソースコード）で
ほぼ同じプログラムが使えること。Mac 用アプリを作って、
基本的に iPhone でも同じアプリを動かすことができます。
アプリの I/F や使い勝手などは別々に作り込みが必要でも
ロジックや表現などは同じソースコードが使えそうです。