初めてのPhoneGap(cordova)_html5チュートリアルスキルに基づくアプリの詳細説明

WBOY

リリース： 2016-05-16 15:49:35

オリジナル

1649 人が閲覧しました

PhoneGap は、HTML5 を使用してローカル API インターフェイスを簡単に呼び出し、アプリケーションをストアに公開できるアプリケーション開発プラットフォームです。関係者は、低コスト、短い開発サイクル、軽量などの利点があると言っていますが、これらはまだ証明できないため、無視します。ただし、クロスプラットフォームがあることは明らかな利点です。アプリケーションの開発に HTML5 JavaScript モードを使用するためです。 PhoneGap は JavaScript を使用して、いくつかの主要なプラットフォーム (Andriod、IOS、WP8/7、WINRT) などのローカル API を均一にカプセル化します。。この場合、あるプラットフォームから別のプラットフォームに移植するときは、HTML コードと JS をそのまま取り出してパッケージ化するだけで済みます。 PhoneGap は後に Adobe に買収され、オープンソースコミュニティに貢献し、現在は Apache によって管理され、cordova と名前変更されました。

昨日の html5 描画ボードをモバイルデバイスに移植するために、片面だけを書いて実行するだけで済むように、phoneGap プラットフォームを使用することにしました。

今日はAndriod上にphoneGap環境をセットアップします。

1.phoneGap をダウンロードします

http://phonegap.com/download/#autodownload

それを解凍し、lib/android ディレクトリを見つけます。

2. 通常のプロジェクトと同じように、Eclipse 上で新しい Andriod プロジェクトを作成します。

3. アセットディレクトリ

に新しいフォルダー「www」を作成します。

lib/android ディレクトリにあるcordova-2.6.0.js をこのディレクトリにコピーします。 Cordova-2.6.0.jar を libs ディレクトリにコピーします。

初めてのPhoneGap(cordova)_html5チュートリアルスキルに基づくアプリの詳細説明

4. www ディレクトリに新しい HTML ファイルindex.html を作成します。ここでインターフェースを作成します。

初めてのPhoneGap(cordova)_html5チュートリアルスキルに基づくアプリの詳細説明

index のコードは次のとおりです:

コードをコピーします

コードは次のとおりです:

< ;!doctype html>

HTML5Paint

HTML5Paint

5. lib/android ディレクトリをコピーします。 xml フォルダー全体を res

初めてのPhoneGap(cordova)_html5チュートリアルスキルに基づくアプリの詳細説明

6. AndroidManifest.xml を変更してユーザー権限を追加します

次のコードをタグの先頭に追加します

コードをコピーします

コードは次のとおりです以下のように:

android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:xlargeScreens="true "
android:resizeable="true"
android:anyDensity="true"
/>

7.修改MainActivity.java

复制代码

代码如下:

public class MainActivity extends DroidGap {

@Override
public void onCreate(Bundle SavedInstanceState)
{
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
}

}

8.build では、前述のcordova-2.6.0.jar が buildpath に追加されていないため、次のエラーが発生する可能性があります。