2011年1月7日金曜日

phoneGap(HTML + CSS + JavaScript)でandroidアプリを作成してみた

phoneGap(HTML + CSS + JavaScript)でandroidアプリを作成してみたのでメモを残しときます。

いきなり結論

現状のversion(0.93)では、使用は控えましょう。

以下、手順と記録です。

使用したphoneGapのversionは0.9.3。
ダウンロードは以下のサイトから行えます。
http://www.phonegap.com/download

まずはお決まりのHello worldを作成してみる。

動作に必要なのは下記の二つのファイルらしい。

phonegap-0.9.3.jar
phonegap-0.9.3.js

とりあえず、普段どおりにeclipseからandroidプロジェクトを動作させる。
androidのversionは1.6を使用する

プロジェクトのrootディレクトリに以下のフォルダを作成してファイルを格納する

/libs/phonegap-0.9.3.jar
/assets/www/phonegap-0.9.3.js

wwwフォルダにindex.htmlを作成
sampleを見る限り、html5で記述するのがよさそう。
ファイルエンコードはUTF-8に設定

index.htmlの内容は
http://wiki.phonegap.com/w/page/30862722/phonegap-android-eclipse-quickstart
のCreating A New Projectのindex.htmlの部分を丸々コピー&ペースト。

続いて、Activityクラスを作成。
チュートリアルだとjarのパスを通す旨が記述されていないが、きっちりと通す必要あり。
通常はActivtyクラスを継承するのだが、DroidGapクラスを継承する。

私の場合、activityクラスを作る場合は「~Activity」としているのだが、「~DroidGap」とするべきなのだろうか…。
とりあえず無視。
setContentViewでなく、loadUrlを利用する。
urlにindex.htmlを指定する。

最後にmanifest.xmlファイルを記述。
http://wiki.phonegap.com/w/page/30862722/phonegap-android-eclipse-quickstart
のsupports-screensから下のtagを全てコピーして貼り付ける。

さらにandroid:configChanges="orientation|keyboardHidden"を追加。
これは指定したイベントが発生した場合に、index.htmlがリロードされないように必要なようである。
縦横対応できないのかな???
よくわからないので、後で要調査。

さて、あとはビルドしてエミュレーターでアプリを実行。仕様osはandroid2.3を利用する。
画像はキャプチャしないけど、うまく動きました。

続いて、apkファイルを作成。
これもいつも通り作成してみる。
と思ったら既にフォルダに出来てた…。自動生成か?keystoreファイルはいらないのか?
これも要調査。

とりあえずapkをインストール。
起動成功。若干もっさりな気がするが気のせいか?いや、気のせいじゃないな。

さらに画像などを組み込んで色々といじってみる。






微妙…。というかandroidでは現状のバージョンでは使い物にならない。
機種ごとに解像度が異なるandroidで、画像サイズの自動調整を行ってくれないのでは利用価値がない。
iphoneなら3と4でhtmlファイルを切り替えて画像対応、もしくはcanvasで画像サイズを切り替えるという手段が使えるので使えなくもないと思う。でも、objective-Cを使ったプログラミングのほうが安全だし、結局は楽。
私がジョブスでもこんなツールで作成したアプリは認めませんね。フリーソフトなら別ですけど…。
批判してごめんよ、ジョブス。あんたが正しい。

つまりのところ、javaScriptで満足のいくアプリが作れるのはまだまだ先のことになりそうです。
でも、待っているよりjavaとobjective-Cを覚えたほうが絶対早いです。
みんなnative言語やろうぜ!!










そんな感じです。

でわん

この記事がお役にたちましたらシェアをお願いします

このエントリーをはてなブックマークに追加

0 件のコメント:

コメントを投稿

Related Posts Plugin for WordPress, Blogger...