speg03の雑記帳

主に未来の自分のために試したことなどを記録しています

AndroidアプリのためのPhoneGap環境

PhoneGapはHTML+CSS+JavaScriptを使ってモバイルアプリを作成できる。複数のプラットフォームに対応していて、今回はAndroid向けの環境を作ったのでメモ。

環境

Ubuntu 10.10 Desktop Edition 64bitでEclipseの環境を作った。

64bit環境だけどSDKは32bit向けしかないみたい。それでも特に問題なさそう。android-sdk_r10-linux_x86.tgzを使った。

何でも良いと思うけどSpringSource Tool Suiteにした。springsource-tool-suite-2.6.0.RELEASE-e3.6.2-linux-gtk-x86_64.tar.gzを使った。

EclipseのInstall New Softwareで https://dl-ssl.google.com/android/eclipse/ を指定する。

phonegap-0.9.4.zipを使った。Androidディレクトリの中にあるphonegap-0.9.4.jsとphonegap-0.9.4.jarを使う。

Eclipseを使わない場合はこっちのコマンドベースの方法でやるのが良いと思う。

実行準備

たぶんどこにでも載っていることなので簡単にやったことだけ。全部Eclipse上の操作。

Window > Preferences > Android > SDK Location
  • 適当なSDK Platformを選択

手持ちが2.2なので2.2を選んだ。SDK Platform Android 2.2, API 8, revision 2だった。

Window > Android SDK and AVD Manager > Available packages > Android Repository

とりあえずデフォルト値で作成した。

同じくAndroid SDK and AVD Manager > Virtual devices


サンプル作成

公式のサンプル通りに進めた。(http://www.phonegap.com/start#android

  • Android Projectの新規作成
    • Project name: HelloPhoneGap
    • Build Targetを適当に選択
    • Application name: Hello
    • Package name: com.phonegap.helloworld
    • Create Activity: App
  • PhoneGap導入
    1. プロジェクトのルートにlibs, assets/wwwフォルダをそれぞれ作成
    2. libsにはphonegap-0.9.4.jar、assets/wwwにはphonegap-0.9.4.jsをコピー
    3. libsのphonegap-0.9.4.jarをビルドパスに追加
  • com.phonegap.helloworldパッケージのApp.java
package com.phonegap.helloworld;

import android.os.Bundle;

import com.phonegap.DroidGap;

public class App extends DroidGap {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        super.loadUrl("file:///android_asset/www/index.html");
    }
}
  • assets/www/index.html
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
</head>
<body>
  <h1>Hello World</h1>
</body>
</html>

最終的にプロジェクトはこんな感じ。

実行