iOS 用のデフォルトアプリ？をシミュレータで起動してみる

Xcode PhoneGap Cordova

PhoneGap を使うには、PhoneGap の外枠？が組み込まれているプロジェクトを最初に作る必要があります。
バージョン 1.x では Xcode に PhoneGap のテンプレートが用意されていて、それを選択すれば作成可能だったみたいですが、2.1.0 ではターミナルからコマンドを入力することになります。


まずターミナルを起動して、先ほどセットアップした PhoneGap の bin フォルダに移動します。
bin フォルダをターミナルアプリのアイコンにドラッグ＆ドロップしても良いですし、普通にターミナルを開いて cd で移動しても OK です。

iMac-i3-27:Cordova paraches$ cd ~/Cordova/bin
iMac-i3-27:bin paraches$ ls -l
total 80
-rwxr-xr-x@ 1 paraches  staff  1261  9 21 11:19 README.md
-rwxr-xr-x@ 1 paraches  staff   872  9 21 11:19 autotest
-rwxr-xr-x@ 1 paraches  staff  4173  9 21 11:19 create
-rwxr-xr-x@ 1 paraches  staff  5508  9 21 11:19 diagnose_project
-rwxr-xr-x@ 1 paraches  staff   431  9 21 11:19 package.json
-rwxr-xr-x@ 1 paraches  staff   937  9 21 11:19 replaces
drwxr-xr-x@ 3 paraches  staff   102  9 21 11:19 templates
-rwxr-xr-x@ 1 paraches  staff  1583  9 21 11:19 test
drwxr-xr-x@ 6 paraches  staff   204  9 21 11:19 tests
-rwxr-xr-x@ 1 paraches  staff  2351  9 21 11:19 update_cordova_subproject
iMac-i3-27:bin paraches$

ここで、Xcode 用のプロジェクトを作成するコマンドを入力します。
コマンドの説明は下記の通りです。

./create [作成するプロジェクトを入れるフォルダへのパス] [Bundle Identifier] [project名]

今回の確認用プロジェクトでは以下のようにしました。

  • [作成するプロジェクトを入れるフォルダへのパス] は先ほど bin と CordovaLib を入れたフォルダに project というフォルダを作ってそこにしました。
  • プロジェクト名は CordovaTest としました。（ちょっとテストとごっちゃになってわかり難い…）
  • Bundle Identifier は、いつも使っている com.paraches を使って com.paraches.cordova.CordovaTest としました。

実際に入力するコマンドは以下のようになります。

iMac-i3-27:bin paraches$ ./create ~/Cordova/project com.paraches.cordva.CordvaTest CordvaTest

これで project フォルダの中に CordvaTest プロジェクトが出来上がりました。
project フォルダの中身はこんな感じです。

CordvaTest.xcodeproj と CordvaTest フォルダは良くある Xcode でのプロジェクトの構成ファイルです。
www フォルダは PhoneGap が WebView で読み込む web page のファイルが入ります。
cordova フォルダは…なんだろう？


というわけで、早速 CordvaTest.xcodeproj をダブルクリックして Xcode を起動します。
で、いきなり scheme を CordvaTest/iPhone 5.1 Simulator にして Run をクリック！

これで iPhone Simulator が起動して PhoneGap のデフォルトアプリ？の最初の画面が表示されます。

シミュレータだと本当になんにも問題なくサクッとできちゃいます。