【JQueryMobileとPhoneGap】 環境構築編

【JQueryMobileとPhoneGapで開発する目的】

 JQueryMobileとPhoneGapを採用することで、マルチプラットフォーム開発を目指す。
異なる、ディスプレイの大きさに対応したアプリ開発を目指す。

【環境】
Eclipse　3.7　（基本的な設定済みとする。）
Jquery mobile  1.0.1
Phone Gap 1.5
Android1.6 is01
Android2.3 003sh端末
Android4.0 Galaxy Nexus

【手順】
JQueryMobileとPhoneGapで、初期設定をまとめる。 
手順としては、JqueryMobileを移植→PhoneGap移植→ザックリ表示
です。

1.現在の安定版であるJquery　mobile 1.0.1　をダウンロードする。


２．解凍する。

解凍したファイル

３．とりあえず、Androidプロジェクトのassetes/www/にindex.html
を作成する。

４． JQueryMobileでいくつかプラグインがありますが、とりあえずdemosファルダにある下記ファイルをindex.htmlと同階層にコピペする。
・jquery.js
・jquery.mobile-1.0.1.min.css
・jquery.mobile-1.0.1.min.js


5．現在リリースされているPhone Gap１．５をダウンロードする。

6．解凍する。

7．とりあえず、lib\androidへ移動する

８．まず、xmlフォルダをコッピペし、Androidプロジェクトのresファルダ配下に貼り付ける。
→これによって、PhoneGapプラグインの読み込み設定完了。

９．AndroidManifestをいじる。
・ まずは、マルチディスプレイ対応のため、下記を追加


・次に、Phone Gapのルール？みたいで、端末を縦横切り替えをした時に、onCreateが走らないように設定をする。


１０．libsフォルダを作成

１１．cordova-1.5.0.jarをlibsフォルダにコピペし、ビルドパスを通す。
さらに、cordova-1.5.0.jsをassets/www/
配下に置く。（今回、PhoneGap機能は使っていないので、詳しい説明はあとで・・かな？）

１２．こんどは、PhoneGapをActivityへ実装する。

１３．端末にインストールしてみる。

インストールができた画面

以上で、環境構築が完了した。