このページの本文へ

iPhoneがPhoneGapで簡易電子書籍リーダーに (2/4)

2011年09月21日 11時00分更新

文●古籏一浩

  • この記事をはてなブックマークに追加
本文印刷

ChildBorwserでWebページを表示

 準備が完了したら、さっそくChildBorwserを使ってみましょう。以下のように記述すると、指定したWebページがChildBorwserで表示されます。

●書式


PhoneGap.exec("ChildBrowserCommand.showWebPage", 【URL】);

 これだけですので特に細かい説明はありません。実際のプログラムは以下のようになります。

【図】9.png

実際のプログラム

 ページが読み込まれると私の運営する「OpenSpace」のページが表示されます。実際に表示されるかどうか、iOSシミュレータで確認してみましょう。iOSシミュレータが起動すると以下のような画面になります。

【図】10.png

Webページが表示された

 この状態で画面左下にある「Done」ボタンをタップすると、以下のようにPhoneGapの画面に戻ります。ChildBrowserは同一のアプリ内で起動するので、すぐに表示され、PhoneGapにすぐに戻れます。

【図】11.png

PhoneGapの画面に戻る


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <script type="text/javascript" charset="utf-8" src="phonegap.0.9.5.1.min.js"></script>
  <script type="text/javascript" charset="utf-8">
  function onBodyLoad()
  { 
    document.addEventListener("deviceready",onDeviceReady,false);
  }
  function onDeviceReady()
  {
    PhoneGap.exec("ChildBrowserCommand.showWebPage", "http://www.openspc2.org/");
  }
  
  </script>
 </head>
 <body onload="onBodyLoad()">
   <h1>ChildBrowser Sample</h1>
 </body>
</html>

この連載の記事

一覧へ
Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く