2013-02 / 2013-02-25

前のエントリ: ツイートのサイト埋め込み [chalow]
次のエントリ: いつのまにかsymlinkを辿ってくれなくなっていたので設定変更 [samba]

PhoneGapを使ったhtmlベースのAndroid/iOSハイブリッドアプリ開発環境メモ
2013-02-25-1 / カテゴリ: [html][Android] / [permlink]

PhoneGapを使ったアプリ開発をする機会があった(というか現在進行形)ので簡単にメモ(Android視点)。
2013-02-25時点で2.4.0がリリース版は最新(2/7頃に更新されてて開発サイクルは結構速い)。ドキュメントも公式で日本語化されたものが公開されてる(ただし今日の時点で2.2まで)

PhoneGap用の開発環境があるわけではなく、PhoneGapを利用した動作に必要なライブラリ込みのAndroidアプリプロジェクトをツールを使って生成・ADTの「既存のコードからAndroidプロジェクト生成」を行い、通常のAndroid同様Eclipse(や信仰しているエディタ)で開発する流れ。



ちなみに2.2以降はこの手順だけど、2.1以前(というか少なくとも2.1)は、既存(というかADTで作った新規)のAndroidプロジェクトにPhoneGap用のjarなどを手作業で追加する。
具体的には cordova-*.jar を外部ライブラリとして、表示に使用するhtml + css + javascripをassets/www以下へ配置し、アクティビティでassetsにおいたhtmlをロードするためのコードを書く。こっちの手順の方が必要なファイルを手動で配置するから構成がわかりやすいかも(2.3のPhoneGapファイル郡を2.1の手順で構成しても動作する。というか最初の練習アプリ作業時は日本語ドキュメントが2.1までしかなくてそれを見ながらやったので間違えてこの手順で作成してしてたw)。


追記
ver2.1の手順そのままだとダメ。zipのlib/android/xml/config.xml をリソースファイルとして res/xml 以下に配置する必要がある。これを忘れると以下のエラーが出る。
02-25 14:27:12.786: E/PluginManager(1585): ERROR: plugin.xml is missing. Add res/xml/plugins.xml to your project.
02-25 14:27:12.796: E/PluginManager(1585): https://git-wip-us.apache.org/repos/asf?p=incubator-cordova-android.git;a=blob;f=framework/res/xml/plugins.xml
画面には
[ERROR] Error initializing
Cordova: Class not found
とアラートダイアログが表示される。



実行はWebView使った1つのActivity内でぐりぐり動かしてる感じで、前述の構成ができた後はほぼjQueryMobile等を使ったクライアントWeb系の開発になる。
パーミッションの設定やアプリ名なんかでManifestファイルを編集したり若干のAndroid開発の知識は要るけれど、Javaよりhtml + css + javascriptの方が使いこなせてる人には作るのは楽かも。
(プロジェクト生成時のパーミッションはフルで付加されているので不要なものを削る)

iOSは端末も開発環境もないのでわからず。あと、カメラやセンサーとかのネイティブの機能の利用も可能だけどまだノーチェック。

参考
…ということを2/8に始めてメモをモタモタ書いてたら2.5.0rcがリリースされてる始末(笑) 大人の事情で2.3.0で開発してるので日本語版ドキュメント早くでないかな。

ちなみに所謂Web2.0あたりからクライアントWeb開発はサパーリなので逆にツラい。
というかAndroidもiOSもUI/UXが同じになるのはやっぱアレ。
前のエントリ: ツイートのサイト埋め込み [chalow]
次のエントリ: いつのまにかsymlinkを辿ってくれなくなっていたので設定変更 [samba]

2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12

最終更新時間: 2013-05-02 16:12