検索
連載

PhoneGapでAndroidアプリを作るための基礎知識PhoneGapで始めるWeb→スマホアプリ制作入門(1)(3/3 ページ)

HTMLやJavaScriptなどWeb技術でiOSやAndroidのネイティブアプリを作れる「ハイブリッドアプリ開発」を紹介します。

PC用表示 関連情報
Share
Tweet
LINE
Hatena
前のページへ |       

HTMLをAndoridネイディブアプリとして「Hello World」

 以上で、PhoneGap開発環境のセットアップが一通り完了したことになります。ここからは、簡単なサンプルアプリを開発していきます。

Activityファイルの修正

 Eclipse上で「src/com.example.helloworld/HelloActivity.java」をダブルクリックします。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 これを下記のように、変更します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 【1】は、PhoneGapのフレームワークを利用できるようにするためのimport宣言です。

 【2】は、PhoneGapフレームワークで用意されたDroidGapクラスを、HelloWorldクラスの親クラスに指定します。

 【3】は、DroidGapのloadUrlメソッドで、アプリケーション画面を記述しているHTMLファイルを呼び出します。「file:///android_asset/www/index.html」は、「assets」フォルダ内のindex.htmlのことです。

Manifestファイルの修正

 「AndroidManifest.xml」を右クリック、[Open With]→[Text Editor]を選択します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 これを下記のように変更します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 要素は、どの解像度にアプリを対応させるかなどの設定を行う記述です。

 要素は、アプリが端末に要求する機能を許可するかどうかを設定する記述です。本来は必要な機能にのみ許可を与えるようにします。「android:configChanges」には、アクティビティを再起動せずに処理を続けさせたい場合の情報を記述します。

index.htmlの編集

 「/assets/www/index.html」ファイルを下記のように編集します。Eclipseで開く場合は、「index.html」を右クリックして、[Open with]→[Text Editor]です。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

シミュレータや実機でアプリを試す

 作成したサンプルアプリを試してみましょう。まずは、AVDを使います。

シミュレータでテストする

 「HelloWorld」を右クリックし、[Run as]→[Android Application]を選択してください。

 AVDが起動し、アプリを仮想的にテストできます。

 シミュレータの起動は多少遅いと感じるかもしれませんが、気長に待ってください。また、一度起動したシミュレータは閉じないようにするといいでしょう。

 このような画面が表示されれば、アプリ起動に成功しています。

実機端末でアプリを起動する

 Android端末の設定で、[アプリケーション]→[開発]→[USBデバッグ]として、USBデバッギングが有効になっていることを確認し、端末をコンピュータに接続します。

 プロジェクトを右クリックし、[Run as]→[Android Application]を選択してください。端末にアプリがインストールされます。

 Android端末上で、このような画面が表示されたら、アプリの転送に成功しています。また、メニュー画面に「Hello」というアプリが見つかるはずです。

 Macでは特に必要ありませんが、Windowsの場合、端末ごとにドライバをインストールする必要があります。PCが端末を正常に認識していないと、アプリを転送できないので、注意してください。

次回から、Dreamweaver CS 5.5でPhoneGapを使う

 以上、駆け足でPhoneGapの開発環境セットアップから、Hello World!の制作までの紹介となります。

 次回はDreamweaverでのPhoneGapを使った制作について紹介します。セットアップの手順も紹介しますが、余裕のある方は、Dreamweaver CS 5.5の試用版を

ダウンロードして準備を進めておいてください。

著者プロフィール


鴨田 健次(かもた けんじ)

1980年生まれ。東京都出身。アシアル株式会社所属。

大学卒業後、Web制作会社やデザイン事務所、コンテンツポータル会社で、Webデザイナ・HTMLコーダー・グラフィックデザイナとして腕を磨く。2010年よりアシアル株式会社にてWEBディレクタ/デザイナとして勤務。

座右の銘はSimple is Best。シンプルで見やすいデザインがモットー。

共著に『PhoneGap 入門ガイド(Smart Mobile Developer)』(翔泳社)がある



Copyright © ITmedia, Inc. All Rights Reserved.

前のページへ |       
ページトップに戻る