h2ospace

【ムービー解説】JavaScriptで iPhoneアプリが作れるすごいソフト『PhoneGap』をインストール!

2010-08-15 23:25:33

iPhoneアプリを作りたい! と思ったときに立ちふさがるのが「Objective-C」という厄介な敵。

しかし、HTML+CSS+JavaScriptというWebプログラマなら誰でも知ってる技術で、ネイティブのiPhoneアプリが作れてしまう素敵なソフトがありました。ここでは、「Getting Started with PhoneGap(iPhone)」を日本語にしつつ、手順をUSTREAMで録画したのでそちらの映像も合わせてご参照ください。

必要なもの

  • Leopard(10.5)または、SnowLeopard(10.6)の IntelベースMac OS X
  • iPhone
  • iPhoneデベロッパ登録
  • Gitのインストール

Step 1

  • a) ターミナルを起動して、PhoneGapをインストールしたいディレクトリに移動します。続いて「git clone git://github.com/phonegap/phonegap-iphone.git」と打込み、Enterキーを押します。
  • b) ターミナルで「cd phonegap-iphone」と打ち込んでPhoneGapをインストールしたディレクトリに移動します。この時、デスクトップフォルダは適切ではないので、書類フォルダなどで作業するとよいでしょう。(※翻訳合ってますか?(^^;
  • そして「git submodule init」と打ち込んでEnterを押します(1,2行メッセージが出ます)
  • 続いて「git submodule update」と打ち込んでEnterを押します(しばらく時間がかかります)
  • さらに「make」と打ち込んで Enterを押します。すると、ディレクトリ内に「PhoneGapLibInstaller.pkg」というファイルが出来上がります。
  • (もしXcodeが起動していたら終了させて)、今出来上がった「PhoneGapLibInstaller.pkg」をダブルクリックして起動します。これで、Xcodeに「PhoneGapLib」とXcode用のテンプレートが追加されます。
  • d) (※cがない?) Xcodeを起動して、[ファイル][新規プロジェクト]メニューを選びます
  • “User Templates”セクションに”PhoneGap”グループが追加されているので、これを選んで「PhoneGap-based Application”を選びます。
  • 「選択…」ボタンをクリックし、プロジェクトの名前と場所を設定します
  • /wwwディレクトリ内に、HTMLやCSS、JavaScriptを配置してプログラムを作成します
  • デベロッパライセンスを取得している場合は、「info.plist」を開いて「BundleIdentifier」の設定を書き換えます。もし、デベロッパライセンスを持っておらず、シミュレータで動作を試すだけならこのステップは省略します。
  • 続いて、iOS SDKのバージョンを設定します。
    • [プロジェクト][プロジェクトの設定]メニューを開きます
    • 「アーキテクチャ」を「Standard」に、「ベースSDK」を「iPhoneシミュレータ3.2」に設定します
    • 設定を閉じて、画面左上の「概要」の選択肢から「Simulator」を選びます。
  • ツールバーの「ビルドと実行」を選びます

Step2

  • 「info.plist」を選んで、「BundleDisplayName」をアプリの名前に変えます
  • 「icon.png」を57×57pxの画像で置き換えます。これが、アプリのアイコンになります
  • 「default.png」を320×480pxの画像で置き換えます。これは、起動直後の画面になります。

以上です。翻訳間違えなどありましたらご指摘ください。手順を撮影した映像はこちらです。

 

是非、チャレンジしてみてください!

※このエントリは ブロガーにより投稿されたものです。朝日インタラクティブ および ZDNet Japan編集部の見解・意向を示すものではありません。
  • 新着記事
  • 特集
  • ブログ
このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]