開発者ブログ
HTML5資料室 » PhoneGap

PhoneGap

Last modified by mtakeuchi on 2013/11/29, 17:27
資料目次

PhoneGapとは

PhoneGapは、Adobe社により公開されている、スマートフォン向けハイブリッドアプリケーション制作のためのフレームワークです。
オープンソースとして公開されており、オープンソースの名前はCordovaとなっています。
HTML+Javascriptの技術を使って、iPhone/Androidのネイティブアプリケーションを開発する手法を一般的に「ハイブリッドアプリケーション」と呼びます。
つまり、PhoneGapを使えばObjective-CやJavaを書かずに、Webアプリケーションの技術を用いて、ネイティブアプリケーションを作ることが可能なのです。

phonegap-fan より引用

サポート環境

Android

  • 2.2～2.3、4.0以上

iOS

  • OS X 10.7(Lion)以上
  • iOS SDK 6.0以上

その他のプラットフォームのサポート対象についてはこちらを参照下さい。

開発環境の作り方

PhoneGap3.0.0からNode.jsが必須になりました。
PhoneGapのダウンロードからエミュレータでの動作確認まで全てnodeのコマンドラインから実行します。

※注意

プロキシ環境下ではPhoneGapをインストールできない可能性があるため、非プロキシ環境下で以下の手順を実行して環境を構築して下さい。

Node.jsをインストールする

  1. パッケージをダウンロードする
    • こちらからバイナリファイルをダウンロードします。
      1*.Mac用、Windows用とLinux用があり、それぞれ32bitと64bit用に分かれていますので、環境にあったファイルをダウンロードして下さい。
  2. インストールする
    • ウィザードに従って、node.jsをインストールします。

必要なライブラリをインストールする

Android

以下のパッケージをインストールまたは配置する。

SDK Managerを起動してライブラリをインストールする

  1. Android SDKのフォルダにあるSDK Manager.exeを起動します。
  2. SDK Managerが起動するので、以下のライブラリを選択してインストールする。
    • Android SDK Tools
    • Android SDK platform-tools
    • Android SDK Build-tools
    • Android 4.4 (API 19)
    • Android 4.2 (API 17)
    • Google USB Driver

AVD Managerを起動して仮想デバイスを追加する

  1. Android SDKのフォルダにあるAVD Manager.exeを起動します。
  2. Android Virtual Device Managerが起動するので、Newボタンから仮想デバイスを1件以上登録する。

iOS

以下のパッケージをインストールする。

  1. XCodeをインストールする。
  2. XCodeを起動後、メニューから [XCode] - [Preferences]を開き、[Downloads]タブからiOSシミュレータをインストールする。

PhoneGapのインストール・プロジェクトの作成

  1. プロンプトを起動し、以下のコマンドを実行してPhoneGapをインストールします。
npm install -g phonegap

2. プロジェクトを作成する
phonegap createコマンドを実行して、プロジェクトを作成します
以下の例では「HelloWorld」という名前のプロジェクトを作成しています。

phonegap create HelloWorld

エミュレータでプロジェクトを実行する

Android

コマンドラインで以下のコマンドを実行する。

phonegap local build android

エミュレータが起動して、index.htmlが表示されれば成功です。

iOS

コマンドラインで以下のコマンドを実行する。

phonegap local build android

iOSシミュレータが起動して、index.htmlが表示されれば成功です。

Copyright (C) 2012-2017 NS Solutions Corporation, All Rights Reserved.