| Oracle® Fusion Middleware Oracle Application Development Frameworkモバイル・ブラウザ開発者ガイド 11g リリース2(11.1.2.4.0) B66158-04 |
|
 前 |
 次 |
| Oracle® Fusion Middleware Oracle Application Development Frameworkモバイル・ブラウザ開発者ガイド 11g リリース2(11.1.2.4.0) B66158-04 |
|
前 |
次 |
この章では、ADFモバイル・ブラウザ・アプリケーションに適した開発環境を構成する方法およびモバイル・ブラウザ・アプリケーションを構築してテストする方法について説明します。
この章の内容は次のとおりです。
ADFモバイル・ブラウザ・アプリケーションの開発方法は、ADF Webアプリケーションの開発方法とほぼ同じですが、ADFモバイル・ブラウザ・アプリケーションの開発ではApache MyFaces Trinidadコンポーネントで構成されるモバイルJSFページのみを使用する点が異なります。
|
注意: ページ・フラグメント、ダイアログ内のポップアップおよびリージョン・サポートを除き、ADFモバイル・ブラウザ・アプリケーションの開発にはADFページ・フローを使用できます。ADFページ・フローを使用するADFモバイル・ブラウザ・アプリケーションでは、 |
ADFモバイル・ブラウザ・アプリケーションを作成するには、次の手順を実行します。
アプリケーションおよびプロジェクトの作成による環境の構成
Webプロジェクトの追加
Apache MyFaces Trinidadコンポーネントを使用したJSFページの追加
デスクトップ・ブラウザ、デバイス・シミュレータまたは実際のデバイスでのアプリケーションのテスト
ADFモバイル・ブラウザ・アプリケーションとデスクトップ・ブラウザ用のADF Webアプリケーションの開発方法は、Webプロジェクトの作成の点でのみ異なります。詳細は、2.3項「ADFモバイル・ブラウザ・アプリケーションの開発」を参照してください。
環境を構成するには、まず、ADFモバイル・ブラウザ・テクノロジを備えたプロジェクトを含むADFモバイル・ブラウザ・アプリケーションを作成します。
ADFモバイル・ブラウザ・アプリケーションおよびADFモバイル・ブラウザ・プロジェクトを作成するには、次の手順を実行します。
「ファイル」を選択し、「新規」を選択します。
「新規ギャラリ」で「一般」を展開し、「アプリケーション」、続いて「Fusion Webアプリケーション(ADF)」を選択し、「OK」をクリックします。
図2-2に示すように、「Fusion Webアプリケーション(ADF)の作成」ウィザードの「アプリケーションの名前付け」ページでアプリケーションの名前を入力し、必要に応じて「ディレクトリ」フィールドにアプリケーションの場所を入力します。
「終了」をクリックします。
「Fusion Webアプリケーション(ADF)」を選択すると、モバイル・ビュー・プロジェクトで使用するモバイル・プロジェクトが作成されます。これは、生成済のビュー・コントローラ・プロジェクトのかわりに作成します。図2-3は、「アプリケーション・ナビゲータ」に表示された、アプリケーションのモデル・プロジェクトおよびその生成済のビュー・コントローラ・プロジェクトを示しています。
|
注意: 生成されたビュー・コントローラ・プロジェクトを使用してモデル・プロジェクト内でビジネス・ロジックを設計しないでください。かわりに、次の手順を実行してモバイル・ビュー・コントローラ・プロジェクトを作成します。 |
次のように、モバイル・ビュー・コントローラ・プロジェクトを作成します。
「ファイル」、「新規」を選択して作成します。「新規」ギャラリが表示されます。
「新規ギャラリ」で「カテゴリ」を展開し、「プロジェクト」、続いて「カスタム・プロジェクト」を選択し、「OK」をクリックします。
「カスタム・プロジェクトの作成」ウィザードで、まずプロジェクト名を入力します。たとえば、mvc(モバイル・ビュー・コントローラの省略名)と入力します。
|
ヒント: モバイル・デバイスのブラウザでより容易に識別される、短いURL文字列を作成するには、小文字、ADFモバイル・ブラウザ・プロジェクトの短縮名、およびその |
「ADFモバイル・ブラウザ」を「選択可能」リストから「選択済」リストに移動することによって、プロジェクト用にADFモバイル・ブラウザ機能を選択します。
図2-4は、「選択可能」ウィンドウ内の「ADFモバイル・ブラウザ」機能を示しています。「ADFモバイル・ブラウザ」機能を「選択済」ウィンドウに移動すると、Java、JavaServer Faces(JSF)、JSPおよびサーブレット・テクノロジがプロジェクトで使用可能になり、図2-5に示すようにこれらも「選択済」ウィンドウに表示されます。
アプリケーションでADFページ・フローを使用する場合は、「ADFページ・フロー」機能を「選択済」ウィンドウに追加します。図2-6に示すように、「ADFページ・フロー」機能により、ADF Faces、ADFページ・フロー、TrinidadおよびXMLテクノロジが追加されます。
「次へ」をクリックして「Java設定の構成」ページをナビゲートし、「終了」をクリックします。
図2-7に示すように、「アプリケーション・ナビゲータ」のADF Fusion Webアプリケーション(adfm)内に、モバイル・ビュー・コントローラ・プロジェクト(mvc)が表示されます。
モバイル・ビュー・コントローラ・プロジェクトを作成することで、モバイル・アプリケーションのページ・フロー定義ファイルfaces-config.xmlも作成されます。ページ・フロー作成の詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド』「ページ・フローの定義」を参照してください。
ADFモバイル・ブラウザ機能を追加したため、Apache MyFaces Trinidadライブラリが自動的にワークスペースにロードされており、図2-10に示すように、モバイルJSFページの作成時にはTrinidadコンポーネント・パレットがロードされます。
モバイル・ブラウザ・アプリケーションの開発では、Webプロジェクト内にWebページを作成します。通常、アプリケーションには、ユーザー・インタフェースを実装する場合はWebプロジェクトを、ビジネス・レイヤーを実装する場合はADFビジネス・コンポーネントまたはOracle EclipseLinkプロジェクトを作成します。
ADFモバイル・ブラウザ・アプリケーションの開発では、最初にJSPページを作成してから、そこにApache MyFaces Trinidadコンポーネントを移入します。
モバイルJSFページを作成するには、次の手順を実行します。
「ファイル」を選択し、「新規」を選択します。
「新規ギャラリ」で「カテゴリ」を展開し、「Web層」、続いて「JSF/Facelets」を選択し、「ページ」を選択します。「OK」をクリックします。
|
注意: 「フィルタ条件」リストから、「プロジェクト・テクノロジ」(デフォルト)を選択する必要があります。 |
図2-9に示すように、「JSFページの作成」ダイアログでJSFページの名前を入力します。必要に応じて、ページのディレクトリの場所を入力します。
図2-10は、home.jspxというモバイルJSPページのデザイナを示しています。
「コンポーネント・パレット」で、図2-10のように「Trinidad」を選択してから、Apache MyFaces Trinidadコンポーネントを使用してページを作成します。これらのコンポーネントを最適化する方法については、第4章「スキニング」のスタイルとパターンの説明を参照してください。
「モバイル機器での表示」オプションが「JSFページの作成」ダイアログでデフォルトで選択されているため、図2-10のように、ページ・デザイナを調整して、モバイル・デバイスのサイズを反映できます。このオプションにより、次のADFスキン関連の構成ファイルとスタイルシートも作成され、ADFモバイル・ブラウザに構成されます。表2-1は、ADFモバイル・ブラウザのビュー・コントローラ・プロジェクトのWebコンテンツ・フォルダにある、これらのファイルを示しています。
表2-1 スキニング関連のアーティファクト
| スキニング・ファイル | 場所 | 説明 |
|---|---|---|
|
|
モバイル・ビュー・コントローラ・プロジェクトのWEB-INFノード |
ADFモバイル・ブラウザ・アプリケーションで使用されるスキンを定義します。このファイルをモバイル・コンテキストで使用する場合の詳細は、4.2項「ADFモバイル・ブラウザのスキニングの実装」を参照してください。『Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド』のtrinidad-config.xmlでの構成に関する項も参照してください。 |
|
|
モバイル・ビュー・コントローラ・プロジェクトのWEB-INFノード |
モバイルJSFページを作成すると自動的に生成されるスキン・ファイルをリストします。デフォルトでは、これらは |
|
|
モバイル・ビュー・コントローラ・プロジェクトのスタイル・ノード |
基本的なHTMLブラウザと、古いバージョンのスマートフォンで使用されるブラウザに使用されます。 |
|
|
モバイル・ビュー・コントローラ・プロジェクトのスタイル・ノード |
iOSまたはAndroidで動くブラウザなど、Webkitベースのスマートフォン・ブラウザに使用されます。 |
ADFモバイル・ブラウザ・アプリケーションは、モバイル・デバイス、モバイル・デバイス・エミュレータまたはデスクトップ・ブラウザでテストできます。ただし、実際にモバイル・デバイスやモバイル・デバイス・エミュレータでテストするほうが正確な結果になります。
デスクトップ・ブラウザを使用したADFモバイル・ブラウザ・アプリケーションのテストでは、テスト環境がかなり画一的になるため、おおよその結果しか得られません。これは、どのタイプのデスクトップ・ブラウザでも、Webページの外観および動作が似ており、ビジネス・ロジックがまったく同じように実行されるためです。一方で、実際のモバイル・デバイスを使用したアプリケーションのテストでは、モバイル・ブラウザの機能によってデスクトップ・ブラウザの場合とは異なる方法で動作が制御されるため、より正確な結果が得られます。Webサーバーがモバイル・ブラウザに固有のページを生成してページのルック・アンド・フィールを最適化するため、デスクトップ・ブラウザよりも通常は小さいモバイル・ブラウザでは、デスクトップ・ブラウザとは異なる方法でページがレンダリングされます。
また、ADFモバイル・ブラウザ・アプリケーションをモバイル・デバイス上で直接テストする場合には、テストが必要なすべてのデバイスにアクセスできない可能性があります。さらに、多くのモバイル・デバイスは、インターネットのみにアクセスでき、ファイアウォールの後ろにある開発環境にはアクセスできないため、ファイアウォールによってテストが複雑になることがあります。このような場合は、モバイル・デバイス・エミュレータを使用して、代替のテスト方法を採用します。たとえば、BlackBerryスマートフォン・シミュレータ(図2-11)またはWindows Mobileデバイス・エミュレータ(図2-13)でアプリケーションをテストするには、RIM社の開発者サイト(http://us.blackberry.com/)からスマートフォン・シミュレータをダウンロードするか、Microsoft社の開発者サイト(http://www.microsoft.com)からデバイス・エミュレータをダウンロードします。その後、それらを構成してWebサーバーに接続する必要があります。ADFモバイル・ブラウザのシミュレータおよびエミュレータのダウンロードおよび構成の詳細は、Oracle Technology NetworkのOracle ADFモバイルでのモバイル・アプリケーション開発に関するページにある、ADFモバイルおよびJDeveloperでのモバイル・デバイス・シミュレータの実行に関するドキュメントを参照してください。このページにアクセスするには、Oracle Technology NetworkのOracle Application Development Frameworkの概要ページ(http://www.oracle.com/technetwork/developer-tools/adf/overview/index.html)で「Oracle ADF Mobile」を選択します。
アプリケーションは、デスクトップ・ブラウザでテストした後、エミュレータでテストできます。デスクトップ・ブラウザに表示されたURLを使用できますが、localhostのIPアドレス(127.0.0.1)を使用している場合は、コンピュータのネットワークIPアドレスに変更する必要があります。
|
ヒント: ネットワークIPアドレスを取得するには、Windowsシステムの場合は |
たとえば、Windows Mobile 6エミュレータを使用してアプリケーションをテストする場合は、アドレスをデスクトップのlocalhostのIPアドレス(127.0.0.1、図2-12)からコンピュータのネットワークIPアドレス(192.0.2.253、図2-13)に変更します。
また、ページ名の後に続くセッション指定を削除する必要があります。ページ名には通常、.jspxまたは.jspが追加されます。図2-12では、ページ名homeに.jspxが追加されています。
アプリケーションをデバッグするには、一般的に、コードのサイクルを繰り返した後でアプリケーションをテストします。変更されたアプリケーションをテストするには、次のいずれかまたは両方を実行する必要があります。
ページのリフレッシュ
ブラウザ・キャッシュのクリア
|
ヒント: 同じアプリケーションを開発する場合、URLは変化しないため、再入力する必要はありません。 |
ADFモバイル・ブラウザ・アプリケーションを適切に表示するには、Windows MobileおよびBlackBerryのブラウザ用にブラウザの設定を調整する必要があります。
Microsoft Windows Mobile 5および6、Microsoft Pocket Internet Explorer
表示を最適化するには、「Fit to Screen」表示を選択します(「Menu」、「View」、「Fit to Screen」の順に選択するとアクセスできます)。
|
注意: 「1列」ビューを選択すると、レイアウトに問題が生じます。このオプションは選択しないでください。 |
BlackBerryブラウザ4.n
ADFモバイル・ブラウザは、JavaScriptのサポートが有効になっている場合にのみ動作します。JavaScriptサポートが有効になっていることを確認するには、次の手順を実行します。
「Options」→「Browser Configuration」を選択します。
次の表が選択されていることを確認します。
Support JavaScript
Allow JavaScript Popup
Support HTML Tables
