develog.me

into VR

Cordova(PhoneGap)でAndroidApp作る その1 環境構築編

注意!2013/04/14現在の情報です。

Cordova(PhoneGap)を使ってAndroidアプリ開発環境をMac上に構築

  • JDKは入っているけどEclipseもSDKも無い状態から、Cordovaの空のプロジェクトを作成するまでを書く。
  • 設定が済んでいて、空のCordovaプロジェクトだけ作りたいのであれば Getting Started with Androidの、3.プロジェクトを作る を参照

前書きと概要

初Android端末購入に浮かれて、早速SIMアダプタぶっ壊して鬱状態です。こんにちは!0^ みなさんはSIMのゲタだけ入れて、引っこ抜くときにピンが引っかかって欠けさせることが無いようご注意くださいまし。 (修理はDOCOMO契約あれば5,000円くらい。なければ20,000円くらい。死にたい)

それでははりきってまいりましょうρ(・ω・、)

  • Cordovaとは iPhoneでもAndroidでも動くアプリをHTML+Javascriptで作れるFrameworkです。 CordovaとPhoneGapと呼び名が2つあるのは、(以下私見)Adobeが買収してアホな判断を下したから。 この記事では、呼び名を統一せず、contextで適当に呼び名を変えます。

ちなみに日本語のコミュニティの情報でさえも古いので、 英語の公式Getting Started Guides をチェックするのが良いです。

じゃつまらないので、以下の構成としてとりあえず書く(゜△゜;)

  • Mac Mountain Lion 10.8.3
  • PhoneGap 2.6.0 [ DL page ] 適当なディレクトリに展開
  • Android SDK [ DL page ]
    • eclipse入りの adt-bundle-mac-x8664-20130219 適当なディレクトリに展開

Getting Started with Android

大まかにはこれの手順に則って行う。

  1. SDKとかPhoneGapをローカルの適当なディレクトリに配置
  2. PATH通す Documentではこうなってるけど、SDKを解凍するとadt-bundle-mac-x8664-20130219なので適当に読替える。
    export PATH=${PATH}:/Development/android-sdk-macosx/platform-tools:/Development/android-sdk-macosx/tools
    ↓
    export PATH=${PATH}:/Development/Android/Toolkit/adt-bundle-mac-x86_64-20130219/sdk/platform-tools:/Development/Android/Toolkit/adt-bundle-mac-x86_64-20130219/sdk/tools
    

    Path通さないと、プロジェクト作る際に

    An unexpected error occurred: ANDROID_BIN="${ANDROID_BIN:=$( which android )}" exited with 1
    

    とおこられる

  3. プロジェクト作る
    ./create <projectルートPATH> <package_name> <project_name>
    
    <project_folder_path> is the path to your new Cordova Android project
    <package_name> is the package name, e.g. com.YourCompany.YourAppName
    <project_name> is the project name, e.g. YourApp (Must not contain spaces)
    
    • Nya プロジェクトを作成 フルパスは説明のためなんだからね(//)
      % /Development/Android/Toolkit/phonegap-2.6.0/lib/android/bin/create /Development/Android/Cordova/Nya me.develog.Nya Nya 
      
  4. eclipse起動 Documentではeclipse classicを入れてプラグイン入れてと、七面倒な手順なので、 最初からeclipse入りのSDKを使いましょう。
    • 作ったプロジェクトを開く New Projectから、 Android の中にある Android Project from Existing Code 選択
  5. Emulatorで動かす Documentでは 5A. Deploy to Emulator あたり。 なにやらエミュレータ用のなんかを入れないといけない。 ドロイド↓矢印のアイコンから適当に入れる。
  6. 実行設定
    1. Run Configurations から、 Android Application 選んで追加。
    2. Android タブ の Project: に プロジェクト名 Nyaを選択
    3. Target タブの ところで追加したEmulatorを指定してあぷらい 右下の Run で実行。初回は ANDROID とイカしたロゴが出てエラい時間待たされる。 その後 APACHE CORDOVAとかわいらしいアイコンの画面が出たらOK

Further Reading