PhoneGapセットアップ〜プロジェクト作成（Xcode）

仕事でPhoneGapを使うことにしたので、Xcodeへのセットアップ、プロジェクト作成のメモ。

ソースがASFに寄贈されたようで、Apache Cordovaという名前で呼ばれるようにもなったようです。
ところどころでCordovaと出てきますが、PhoneGapのことだと思ってしまっていいと思います。

今回使用したバージョン
Xcode4.3.1
PhoneGap-1.5.0

PhoneGapのダウンロードとインストール
PhoneGapのサイト（http://phonegap.com/）から最新版をダウンロードします。

ダウンロードしたファイルを解凍し、「ios」の中の「Cordova-1.5.0.dmg」を実行します。

「Cordova-1.5.0.pkg」を実行し、画面に従ってインストールを進めます。

以上でインストールは完了です。
これをやっておくことで、XcodeからPhoneGapアプリを作るためのテンプレートプロジェクトを作成できるようになります。

PhoneGapプロジェクトを作成
プロジェクトの新規作成を行い、「Cordova-based Aplication」を選択します。

※前は「PhoneGap-based Application」という名前でした。公式サイトの写真も古い場合があります。

プロジェクト名を入力します。「Use Automatic Reference Counting」のチェックは外します。

プロジェクト作成先を選択します。
Gitを使う場合は「Create local git repository for this project」にチェックをつけてください。

プロジェクトが出来上がってシミュレーターで実行すると、起動はしますが、
「Start Page at 'www/index.html' was not found.」というエラーが出ると思います。

プロジェクトのフォルダにいつのまにか「www」というフォルダーと中身が出来上がっているので、
これをプロジェクトに追加します。

「Copy items into destination group's folder (if needed)」と「Create folder references for any added folders」に
チェックを付けておきます。

もう一度シミュレーターで実行すると、今度は動作するようになります。

シミュレーターを実行すると最初に表示されるのはindex.htmlなので、index.htmlを修正してみます。

反映されました。

手順さえわかってしまえば、そんなに難しくはないと思います。
HTML・CSS・JavaScriptでアプリのデザイン・開発ができるので、Webをやってきた人は
入りやすいのではないでしょうか。