24章 PhoneGap

戻る

24章
PhoneGap

書籍

説明

このフォルダのサブフォルダに4つのPhoneGapサンプルを収録しています。ブラウザ経由ではなく、フォルダを直接参照してご利用ください。

pghello/

PhoneGapの基礎を説明するためのHello World的なPhoneGapのサンプルです。

pgsample/

PhoneGapの各APIの使い方を紹介するためのサンプルです。

flaggame/

21章で作成した旗取りゲームのPhoneGap版です。オフラインでも遊べます。

photoviewer/

23章で作成したフォトアルバムのPhoneGap版です。

使い方

これらのサンプルは、Eclipes、XCode、Visual Studio上でプロジェクトを作成し、各Android,iOS,Windows Phone用のアプリケーションとしてビルド、デプロイして利用する必要があります。本書24章の「開発環境のセットアップ」を参照して、ひな形プロジェクトを作成し、各サンプルを開発環境上のプロジェクトのWebフォルダ(wwwフォルダ)にコピーして利用してください。

このサンプルの対応するバージョンは、PhoneGap1.7.0です。他のバージョンで利用する場合は、ソースコード中のcordove-1.7.0.jsの読み込みの部分を変更してください。

pgsampleとphotoviewerは、

wwwフォルダ: スマートフォンアプリ用のファイル
serverフォルダ: Webサーバにコピーして利用するフォルダ

に分かれています。serverフォルダには、Webサーバ(Apache)に配備するファイルが入っています。ApacheのWebフォルダにファイルをコピーして利用してください。

pgsample

pgsampleの中のカメラを利用するサンプル(camera.html)には、サーバーへ写真をアップロードするサンプルコードを含んでおり、アップロードを動作させるために写真を受け取るPHPファイルをApacheへコピーする必要があります。

1. serverフォルダをApacheのWebフォルダ(htdocsフォルダ)にコピーしてください。

2. www/camera.htmlの下記のURLをserverフォルダの下の部分をApacheにコピーしたupload.phpにアクセスできるように書き換えてください。

// upload.phpをおいたURLを指定
UPLOADURL = "http://192.168.1.254/server/upload.php";
var imgUrl = null;

上記の例は、serverフォルダをホスト192.168.1.254上で動作するApacheのhtdocsにコピーした場合です。

photoviewer

photoviewerは、サーバと通信して画像を管理します。ApacheのフォルダにPHPファイルをコピーして利用する必要があります。また、サンプルコードの中で指定しているサーバのURLを書き換える必要があります。