Oracle JDeveloper 11g Release 2 Tutorials - Consuming a Web Service from a Web Page

Webページを使用したWebサービスの利用

ここでは、ウィザードを使用して短時間でアプリケーションとプロジェクトを作成し、外部Webサービス定義を使用してデータ・コントロールを作成します。

詳細表示

目的	所要時間	アプリケーション
このチュートリアルでは、外部のWebサービスを使用してデータ・コントロールを作成し、利用する方法について説明します。これから作成するアプリケーションの完成版を確認するには、「Download」ボタンをクリックして最終アプリケーションのzipファイルをダウンロードし、JDeveloperの`mywork`フォルダに解凍します。	30分

注：アプリケーションの完成版をダウンロードしている場合

詳細表示

ステップ1：新規アプリケーションとプロジェクトの作成

メイン・メニューから「File」→「New」を選択します。 New Galleryで「General」カテゴリを展開し、「Applications」を選択します。 Itemsリストで「Custom Application」を選択し、「OK」をクリックします。

JDeveloperアプリケーションは、組織構造の最上位レベルです。アプリケーションの開発中に、操作しているオブジェクトの情報がここに格納されます。

詳細表示

この例に合わせるため、アプリケーション名としてWSDataControlAppと入力し、「Next」をクリックします。

初期プロジェクト構造（アプリケーションの作業領域内にある名前付きプロジェクト・フォルダ）および追加されるアプリケーション・ライブラリは、選択したアプリケーション・テンプレートによって決まります。

詳細表示

プロジェクト名としてModelと入力します。
「Finish」をクリックします。

アプリケーション・ナビゲータのProjectsパネルは、次のように表示されます。

テンプレートから作成された新規アプリケーションは、プロジェクト階層に分割されてアプリケーション・ナビゲータに表示されます。各プロジェクトには関連する機能が設定されています。

詳細表示アプリケーション・ナビゲータでは、プロジェクトは階層内の最上位レベルとして表示されます。アプリケーションで使用したCustom Applicationテンプレートによって、1つのプロジェクトが作成されています。このプロジェクトには、デフォルトのプロジェクト名または事前に入力されたプロジェクト名が指定されています。

アプリケーション・ナビゲータのパネルはいずれも任意に開閉できます。パネルのサイズを調整するには、2つのパネルの間にある分割線をドラッグします。 Projectsパネルで項目のグループ化やソートを行うには、「

」Navigator Display Optionsドロップダウン・メニューを使用します。アプリケーションを操作するには、「

」Application Menuをクリックしてドロップダウン・メニューからオプションを選択します。

JDeveloperには多種多様なファイル・タイプを識別する機能が備わっており、アプリケーション・ナビゲータでファイルをダブルクリックすると、適切なビューアまたはエディタでファイルが表示されます。アプリケーションまたはプロジェクトを終了すると、そのアプリケーションまたはプロジェクトのファイルを表示していたすべてのエディタまたはビューアが閉じられ、メモリからファイルがアンロードされます。

注：アプリケーション・ナビゲータのイタリック体のノードは、これらの要素が保存されていないことを示しています。プロジェクトに含まれるファイルが選択されている場合、プロジェクト・ノードは太字で表示されます。

メイン・メニューから「Application」→「Show Overview」を選択します。エディタ・ウィンドウ領域にApplication Overviewウィンドウが開きます。

Application Overviewウィンドウの一部

Application Overviewのファイル概要ページには、JDeveloper内で作成されるすべてのオブジェクトがオブジェクト・タイプごとに分類されて表示されます。新規作成したファイルとアーチファクトは、ステータスやプロジェクトでフィルタして表示できます。

このアプリケーションのオブジェクトを作成する際には使用しないので、任意でApplication Overviewウィンドウを閉じることができます。

ステップ2： Webサービス定義を使用したデータ・コントロールの作成

アプリケーション内でWebサービスを使用するもっとも一般的な方法は、外部のWebサービスに対応するデータ・コントロールを作成することです。

詳細表示

メイン・メニューから「Tools」→「Preferences」を選択します。 Preferencesダイアログの左側で「Web Browser and Proxy」をクリックしてから、右側で「Use HTTP Proxy Server」を選択して、サーバーからインターネットへのアクセスにプロキシが使用されるようにします。組織のプロキシ・サーバーのURLまたはDNS名と、プロキシ・サーバーへのアクセスに使用するマシンのポート番号を入力します。

ファイアウォールの内部にあるマシンから外部のWebサービスにアクセスするには、JDeveloperのプロキシ設定を変更しなければならない場合があります。

詳細表示

アプリケーション・ナビゲータでプロジェクトを右クリックし、「New」→「Business Tier」→「Data Controls」→「Web Service Data Control」の順にクリックして、「OK」をクリックします。
ウィザードのステップ1のData Source画面で、データ・コントロール名としてGetWeatherを入力します。
URLフィールドに、WSDLのURLであるhttp://www.webservicex.net/WeatherForecast.asmx?WSDLを入力します。

WSDL（Webサービス記述言語）は、Webサービスとの通信方法を定義した記述言語です。

詳細表示

[Tab]キーを押します。

サービスの使用状況によって異なりますが、しばらくするとServiceドロップダウン・リストに{http://www.webservicex.net}WeatherForecastが移入され、表示されます。
Serviceドロップダウン・リストに値が移入されたら、「Next」をクリックします。
ステップ2のData Control Operations画面で、「」矢印アイコンを使用して、WeatherForecastSoap12の下に表示されたGetWeatherByZipCodeを、AvailableペインからSelectedペインへ移動します。
「Finish」をクリックします。

JDeveloperによって、プロジェクトにデータ・コントロール定義ファイル（DataControls.dcx）が追加され、このファイルが概要エディタ内に開きます。
「」Save Allをクリックして作業内容を保存します。
アプリケーション・ナビゲータで「Data Controls」パネルを展開します。

作成したデータ・コントロールが表示されていない場合、パネル・ツールバーの「」Refreshアイコンをクリックします。

Data Controlsパネルには、先ほど作成し、アプリケーションから使用できるようになったGetWeatherデータ・コントロールが表示されています。

詳細表示

ステップ3：ページ・フローの作成とJSFページの追加

ここではデフォルトのページ・フロー・ダイアグラムを使用して、2つのJSFページを作成します。

メイン・メニューから「File」→「New」→「General」→「Projects 」→「ADF ViewController Project」の順に選択し、「OK」をクリックします。
プロジェクト名として「ViewController」を受け入れます。
「Finish」をクリックします。

アプリケーション・ナビゲータにViewControllerプロジェクトが表示されています。
アプリケーション・ナビゲータのViewControllerプロジェクトでWEB-INFの下にある「adfc-config.xml」ダブルクリックし、デフォルトのページ・フロー・ダイアグラムを開きます。

ダイアグラムは最初、空白のキャンバスです。ダイアグラマが現在のエディタとして選択されていない場合、エディタ・ウィンドウの一番下にある「Diagram」タブをクリックします。

デフォルトで、ViewControllerプロジェクトには、JDeveloperによって空のアンバウンド・タスク・フロー（ソース・ファイルはadfc-config.xml）が含まれています。

詳細表示

コンポーネント・パレットで、ADF Task FlowページのComponentsパネルの Activitiesセクションに対して、ダイアグラム上に「」Viewをドラッグ・アンド・ドロップし、ビュー・アクティビティの名前を変更します。次のビュー・アクティビティ名を使用して、このページに対して同じ操作を2回繰り返します。

InputPage
ResultsPage

もっとも重要なタスク・フロー・アクティビティ・タイプはViewです。ViewタイプはJSFページを表します。タスク・フロー・ダイアグラムでは、通常、エンドユーザーのタスクを完了するために相互作用するアクティビティとコントロール・フロー・ルールを定義します。

詳細表示 2つのビュー・アクティビティを定義したら、これらを接続して、InputPageとResultsPageを交互にナビゲートする簡単なページ・フローを作成します。

タスク・フロー・ダイアグラム上の2つのページ・アイコンには最初、黄色の警告記号が表示されており、ビュー・アクティビティに物理的なページ・ファイル（例：InputPage.jsf）が関連付けられていないことが示されています。ページ・ファイルが作成されると、黄色の警告記号はページ・アイコン上に表示されなくなります。

コンポーネント・パレットのComponentsパネルのControl Flowセクションで、「」Control Flow Caseをクリックします。ダイアグラムで、「InputPage」ページ・アイコンをクリックしてから、「ResultsPage」ページ・アイコンをクリックします。コントロール・フロー・ケース要素の名前をshowに変更します。
コンポーネント・パレットで、「」Control Flow Caseを再度クリックします。ダイアグラムで、「ResultsPage」ページ・アイコンをクリックしてから、「InputPage」ページ・アイコンをクリックします。コントロール・フロー・ケース要素の名前をbackに変更します。
ダイアグラムで「InputPage」ページ・アイコンをダブルクリックし、Create JSF Pageダイアログを開きます。
ドキュメント・タイプとして「Facelets」を選択し、InputPage.jsfというデフォルトのファイル名を受け入れます。

アプリケーション向けに作成するJSFページには、Faceletsドキュメント（ファイル拡張子は.jsf）、またはXML構文で記述されたJSPドキュメント（ファイル拡張子は.jspx）を使用できます。

詳細表示

Page Layoutページで「Blank Page」を選択します。 Managed Beanページで、「Do Not Automatically Expose UI Components in a Managed Bean」を選択します。

Create JSF Pageダイアログでは、新しいページのルック・アンド・フィールの一部を任意で定義でき（PageLayoutタブ）、また、ページ上のコンポーネントをマネージドBeanで公開するかどうかを指定できます（Managed Beanタブ）。

詳細表示

「OK」をクリックします。

デフォルトではビジュアル・エディタに新規のJSF Faceletsページが表示されます。

新しいJSFページをFaceletsドキュメント･タイプ（ファイル拡張子は.jsf）として作成すると、JSFコア・タグ・ライブラリ向けのxmlns属性とOracle ADF Facesタグ・ライブラリ向けのxmlns属性を1つずつ持つ初期ページ構造が、JDeveloperによって自動的に作成されます。

詳細表示初期ファイルに含まれるその他の要素には、ページのレイアウト用要素、とくに<f:view>と</f:view>で囲まれた他のすべての要素が挙げられます。

ページ・コードを表示するには、「Source」タブをクリックしてビジュアル・エディタからXMLエディタへ切り替えます。たとえば、新しいページに対しては次のようなコードが生成されます。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<f:view xmlns:f="http://java.sun.com/jsf/core"
        xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <af:document title="InputPage.jsf" id="d1">
    <af:form id="f1"></af:form>
  </af:document>
</f:view>

エディタ・ウィンドウで、「adfc-config.xml」ドキュメント・タブを選択して、ダイアグラムを前面に表示します。「ResultsPage」ページ・アイコンをダブルクリックして、Create JSF Pageダイアログを開きます。
ドキュメント・タイプとして「Facelets」を選択します。ファイル名はデフォルトのResultsPage.jsfのままにします。 Page Layoutページで「Blank Page」を選択します。 Managed Beanページで、「Do Not Automatically Expose UI Components in a Managed Bean」を選択します。「OK」をクリックします。
コンポーネント・パレットのADF FacesページのLayoutパネルで、「」Panel Stretch Layoutをドラッグしてビジュアル・エディタの空白ページにドロップします。

ビジュアル・エディタにコンポーネントをドラッグすると、ページ上にFormという名前の長方形の領域が表示されます。これは、ドラッグしているコンポーネントがターゲット・コンポーネント内に挿入されることを意味します。
「」Save Allをクリックして作業内容を保存します。

ページ・フローとJSFページの作成ステップが完了すると、アプリケーション・ナビゲータのViewControllerプロジェクトは次のように表示されます。

詳細表示

ステップ4：パラメータ・フォームの作成

最初のページに、エンドユーザーが郵便番号を入力するためのフォームを追加します。このフォームには入力テキスト・フィールドとコマンド・ボタンが含まれています。ボタンがクリックされると、アプリケーションによって、入力値が渡される2番目のページにナビゲートされます。

エディタ・ウィンドウで、上部にある「InputPage.jsf」タブをクリックして、ページを前面に表示します。

まだ開いていない場合は、アプリケーション・ナビゲータのViewControllerプロジェクトにある「InputPage.jsf」をダブルクリックして、ビジュアル・エディタ内にページを開きます。
Data Controlsパネルで、「GetWeather」を展開します。

データ・コントロールはビジネス・サービスを表すものであり、使用可能なビジネス・オブジェクト（コレクション、属性、メソッドなど）の階層表示で構成されています。

詳細表示

「GetWeatherByZipCode(String)」メソッドをビジュアル・エディタにドラッグして、ページにドロップします。 Createコンテキスト・メニューから「ADF Parameter Form」を選択します。
Edit Form Fieldsダイアログで、デフォルトの値を受け入れて「OK」をクリックします。

ビジュアル・エディタでページが次のように表示されます。

Data Controlsパネルを使用してパラメータ・フォームを作成すると、JDeveloperによって次のOracle ADF Facesタグがページに追加されます。

詳細表示

<af:messages>：ユーザーに重要なメッセージ情報を提供するため、アプリケーション・ページの最上部で使用されます。
<af:panelFormLayout>：ラベルとフィールドが垂直に並ぶように、入力コンポーネントを位置付けるために使用されます。
<af:inputText>：ブラウザの入力テキスト・フィールドを作成するために使用されます。
<af:commandButton>：クリックするとアクション・イベントを生成するボタンを作成するために使用します。

Data Controlsパネルを使用してコンポーネントを挿入する場合、JDeveloperによって自動的に必要なコードとオブジェクトが作成され、選択したデータ・コントロールに対してコンポーネントがバインドされます。ページに定義されたOracle ADFデータ・バインディングを表示するには、ビジュアル・エディタの下部にある「Bindings」をクリックします。

Bindingsタブ、InputPage.jsf

ページ定義ファイルであるInputPagePageDef.xmlによって、このページに対するOracle ADFバインディング・コンテナが定義されます。 1つのページのすべてのOracle ADFバインディング・オブジェクトへの実行時アクセスは、このバインディング・コンテナによって提供されます。ページにOracle ADFバインディングが定義されている場合は、常に、そのページで使用されるバインディング・オブジェクトを定義したページ定義ファイルが必要になります。

ページ上に挿入されたコンポーネントには、Oracle ADFバインディングへの参照が含まれています。バインディング・オブジェクトのデータを表示するか、プロパティを参照するすべてのコンポーネント属性に対して、Oracle ADFデータ・バインディング式が追加されています。エディタ・ウィンドウで「Source」タブをクリックすると、XMLエディタでコンポーネント属性とOracle ADFデータ・バインディング式を確認できます。 EL（式言語）を使用したバインディング式は実行時に評価されます。ページを表示する際、バインディング・オブジェクトから値が取得され、コンポーネントにデータが移入されます。

一般的なOracle ADFデータ・バインディングのEL式では、次の構文を使用して、バインディング・コンテナに含まれる各種のバインディング・オブジェクトを参照します。

#{bindings.BindingObject.propertyName}

bindingsは、式から参照されているバインディング・オブジェクトが、現在のページのバインディング・コンテナ内にあることを識別する変数です。すべてのOracle ADFデータ・バインディングのEL式には、最初にbindings変数を指定する必要があります。

BindingObjectは、JSFページのページ定義ファイルに定義されたバインディング・オブジェクトのIDまたは一意の名前です。バインディング・オブジェクトの例としては、パラメータや実行可能ファイルがあります。

propertyNameは、データバインドされたコンポーネントのデフォルト表示特性や固有のパラメータを決定し、バインディング・オブジェクトのプロパティを実行時に設定する変数です。各種のバインディング・オブジェクトに対して、さまざまなバインディング・プロパティ（labelやinputValueなど）が提供されています。

ビジュアル・エディタで、ページ上の入力フィールドを選択します。 Input Textのプロパティ・インスペクタで、Labelフィールドからバインディング値を削除し、Enter zip codeというテキストで置き換えます。

Input TextコンポーネントのValue属性に対するバインディングに注意してください。

詳細表示

#{bindings.ZipCode.inputValue}

ZipCodeは、GetWeatherByZipCodeメソッドに含まれるパラメータ・オブジェクトです。後で、このバインディングを使用して2番目のページにパラメータを渡します。

ビジュアル・エディタで、ページ上のボタンを選択します。ボタンのプロパティ・インスペクタで、Actionドロップダウン・リストから「show」を選択します。

showという要素名を使用したコントロール・フロー・ケースは、タスク・フロー・ダイアグラム上のInputPageとResultsPage間に前もって追加してあります。

詳細表示コントロール・フロー・ケースによって、コントロール・フローで実行するアクティビティが識別されます。また、2つのアクティビティを結ぶ矢印によって、コントロール・フロー・ケースまたはナビゲーションの方向が示されます。

InputPageとResultsPage間のコントロール・フロー・ケース

要素名showは、コントロール・フロー･ケースのfrom-outcomeの値です。

<control-flow-rule id="__1">
  <from-activity-id>InputPage</from-activity-id>
  <control-flow-case id="__2">
    <from-outcome>show</from-outcome>
    <to-activity-id>ResultsPage</to-activity-id>
  </control-flow-case>
</control-flow-rule>

コマンド・ボタンのaction属性に対して、showというfrom-outcome値を設定すると、アクションから返された静的な結果値がfrom-outcome値と一致する場合にのみ、コントロール・フロー･ケースが実行されます。つまり、ボタンがクリックされると、InputPageからResultsPageへとナビゲーションが移ります。

ActionListenerフィールドからデフォルト値の#{bindings.GetWeatherByZipCode.execute}を削除し、空白のままにします。

アプリケーションが天気予報Webサービスを2回呼び出さないようにするには、コマンド・ボタンのActionListener属性からバインディング値を削除する必要があります。

詳細表示

コンポーネント・パレットのADF Facesページで、「Operations」パネルを展開します。 Listenersセクションまでスクロールしたら、「」Set Property Listenerをビジュアル・エディタにドラッグし、ページのボタン上にドロップします。

Set Property Listenerを使用すると、ボタンがクリックされた際に2番目のページに値が渡されます。
Set Property Listenerダイアログで、Fromフィールドの横にあるドロップダウン・メニューから「Expression Builder」を選択します。
Expression Builderで、「ADF Bindings」→「bindings」→「ZipCode」の順に展開します。
ZipCodeの下で、inputValueが表示されるまで下方向にスクロールしたら、これを選択します。

「inputValue」を選択すると、Expressionボックスに#{bindings.ZipCode.inputValue}というEL式が表示されます。「OK」をクリックして、Expression Builderを閉じます。
Insert Set Property Listenerダイアログで、Toフィールドに#{pageFlowScope.ZipCode}と入力します。次に、Typeドロップダウン・リストから「action」を選択し、「OK」をクリックします。

setPropertyListenerタグは、イベントの発生時に値を割り当てるための宣言的な構文を提供します。このタグは、さまざまなイベントのリスナー・インタフェースを実装します。

詳細表示

リスニングするイベント・タイプを指定するには、type属性を設定します。コマンド・ボタンがクリックされると、アクション・イベントが実行されるため、Insert Set Property ListenerダイアログのTypeフィールドにactionを設定します。

ダイアログの設定が完了したら「OK」をクリックします。JDeveloperによって次のコード（太字で表示）がコマンド・ボタンに挿入されます。

<af:commandButton id="cb1" text="GetWeatherByZipCode"
 disabled="#{!bindings.GetWeatherByZipCode.enabled}" action="show">
  <af:setPropertyListener from="#{bindings.ZipCode.inputValue}" 
                          to="#{pageFlowScope.ZipCode}"
                          type="action"/>
</af:commandButton>

実行時にコマンド・ボタンがクリックされると、次の処理が実行されます。

#{bindings.ZipCode.inputValue}の値が取得されます。この値は、フォームの入力フィールドに入力された値です。
この値がpageFlowScopeのZipCodeプロパティとして保管されます。つまり、タスク・フローが持続されている間、この値は有効になります。
showの結果に相当するページへと、アプリケーションがナビゲートします（af:commandButtonのactionプロパティに指定されているため）。

「」Save Allをクリックして作業内容を保存します。

ビジュアル・エディタで、InputPageは次のように表示されます。

アプリケーション・ナビゲータで、ViewControllerプロジェクトは次のように表示されます。

詳細表示

ステップ5：結果表の作成

ここでは、最初のページ上のパラメータ・フォームに入力された値を使用して、Webサービスのメソッドから返された天気データを表示するための表を、2番目のページに追加します。

エディタ・ウィンドウで、「ResultsPage.jsf」タブをクリックして、ページを前面に表示します。

まだ開いていない場合は、アプリケーション・ナビゲータのViewControllerプロジェクトにある「ResultsPage.jsf」をダブルクリックして、ビジュアル・エディタ内にページを開きます。
コンポーネント・パレットのADF FacesページのLayoutパネルで、「」Decorative Boxをビジュアル・エディタにドラッグし、ページ上のパネル拡張レイアウト・コンポーネントのcenterファセットにドロップします。

この例に従って作業している場合、ページ上にパネル拡張レイアウト・コンポーネントが表示されているはずです。このコンポーネントはステップ3のサブステップ14で追加されています。
Data Controlsパネルで、「GetWeatherByZipCode(String)」→「Return」→「GetWeatherByZipCodeResult」→「Details」の順に展開します。
「WeatherData」コレクション・オブジェクトをドラッグし、先ほど追加したDecorative Boxのcenterファセット内にドロップします。 Createコンテキスト・メニューから「Table」→「ADF Read-only Table」を選択します。
Edit Table Columnsダイアログで「Enable Sorting」を選択し、「OK」をクリックします。
Edit Action Bindingダイアログでデフォルト値を受け入れます。

ほとんどの値は、データ・コントロールによって公開されたWebサービスのメソッドに基づいて、宣言的に設定されています。 ZipCodeパラメータの値は後で設定します。
「OK」をクリックします。

ビジュアル・エディタで、このページは次のように表示されます。
コンポーネント・パレットのLayoutパネルで、「」Panel Group Layoutをドラッグし、ビジュアル・エディタのページ下部近くにあるbottomファセットにドロップします。
プロパティ・インスペクタのCommonセクションで、Halignをcenterに変更し、Layoutをscrollに変更します。次に、「Style」セクションを展開し、InlineStyleフィールドにpadding:5px;と入力して[Enter]を押します。
コンポーネント・パレットのGeneral Controlsパネルで、「」Buttonをドラッグし、先ほど追加したパネル・グループ・レイアウトにドロップします。
プロパティ・インスペクタで、ボタンのText値をReturnに変更します。次に、Actionドロップダウン・リストから「back」を選択します。

ビジュアル・エディタで、ResultsPageの下部は次のように表示されます。

backという要素名を使用したコントロール・フロー・ケースは前もって追加してあります。このケースはタスク・フロー・ダイアグラム上の矢印の方向が示すとおり、ResultsPageからInputPageへ接続されています。

詳細表示

要素名backは、コントロール・フロー･ケースのfrom-outcomeの値です。

<control-flow-rule id="__3">
  <from-activity-id>ResultsPage</from-activity-id>
  <control-flow-case id="__4">
    <from-outcome>back</from-outcome>
    <to-activity-id>InputPage</to-activity-id>
  </control-flow-case>
</control-flow-rule>

コマンド・ボタンのaction属性に対して、backというfrom-outcome値を設定すると、アクションから返された静的な結果値がfrom-outcome値と一致する場合にのみ、コントロール・フロー･ケースが実行されます。つまり、ボタンがクリックされると、ResultsPageからInputPageへとナビゲーションが移ります。

ResultsPage.jsfのビジュアル・エディタで、「Bindings」タブをクリックします。 Bindings and ExecutablesページのBindingsボックスで、「GetWeatherByZipCode」を選択します。

WeatherDataなどのツリー値バインディング・オブジェクトは、表全体をデータ・コレクションに対してバインドします。ツリー値バインディング・オブジェクトはイテレータを使用して値を取得します。

詳細表示このイテレータがデータ・コントロール内のメソッドにアクセスし、コレクションを返します。

GetWeatherByZipCodeなどのメソッド・アクション・バインディング・オブジェクトには、バインドされたコマンド・ボタンのメソッド起動方法と、（パラメータを使用する場合は）メソッドに渡されるパラメータの詳細がカプセル化されています。この例では、ZipCodeパラメータがメソッドに渡されます。

ResultsPageのページ定義ファイルを開くと（view/pageDefs/ResultsPagePageDef.xmlをクリック）、JDeveloperによって、methodActionバインディングに引数としてZipCodeが定義されていることが分かります。次のコードのNamedData要素を参照してください。

<bindings>
  <methodAction id="GetWeatherByZipCode" RequiresUpdateModel="true" 
   Action="invokeMethod" MethodName="GetWeatherByZipCode" 
   IsViewObjectMethod="false" DataControl="GetWeather" 
   InstanceName="data.GetWeather"
   ReturnName="data.GetWeather.methodResults
    .GetWeatherByZipCode_GetWeather_GetWeatherByZipCode_result">
    <NamedData NDName="ZipCode" NDValue="" 
     NDType="java.lang.String"/>
  </methodAction>
  ...
</bindings>

NamedData要素とNDName属性は、パラメータが予想されるメソッドに対して何を渡す必要があるかをアプリケーションで把握するために必要です。次のステップでは、ZipCode引数のNDValue属性を設定することで、引数の値を指定します。

ResultsPagePageDef.xmlのStructureウィンドウで、bindingsの下にある「GetWeatherByZipCode」を展開し、「ZipCode」を選択します。
プロパティ・インスペクタのNDValueフィールドに#{pageFlowScope.ZipCode}と入力し、[Enter]を押します。

ステップ4のサブステップ12では、最初のページのコマンド・ボタンにSet Property Listenerタグを追加する際、入力フィールドから取得されたパラメータ値を格納するために、pageFlowScopeのZipCodeプロパティを使用しました。

詳細表示

<af:commandButton id="cb1" text="GetWeatherByZipCode"
 disabled="#{!bindings.GetWeatherByZipCode.enabled}" action="show">
  <af:setPropertyListener from="#{bindings.ZipCode.inputValue}" 
                          to="#{pageFlowScope.ZipCode}"
                          type="action"/>
</af:commandButton>

NDValueに#{pageFlowScope.ZipCode}というEL式を設定することで、メソッドに渡す引数の値をプログラムから設定するように、アプリケーションが構成されました。渡される引数の値は、最初のページの入力テキスト・フィールドに入力される値です。 2番目のページはページ・フロー・スコープから値を取得し、必要に応じて使用できます。

ステップ6：結果表の完成とアプリケーションの実行

ResultsPage.jsfのエディタ・ウィンドウで、下部にある「Design」タブをクリックし、ビジュアル・エディタに切り替えます。
ページ上で、表の列見出しをクリックします。
Structureウィンドウで「af:table」を展開し、次に、2番目の列「af:column - #{...WeatherImage.label}」を展開します。

JDeveloperはデフォルトで、すべての表の列に対してOutput Textコンポーネントを挿入しています。しかし、WeatherImage列は図を表示するため、Imageコンポーネントが必要です。

詳細表示

コンポーネント・パネルのGeneral Controlsパネルで、「」Imageをドラッグし、Structureウィンドウのaf:column - #{...WeatherImage.label}にドロップします。
Insert Imageダイアログで、何も値を入力せずに「OK」をクリックします。
Imageコンポーネントのプロパティ・インスペクタで、Sourceフィールドの横にあるドロップダウン・メニューから「Expression Builder」を選択します。
Expression Builderダイアログで、「JSP Objects」→「row」の順に展開し、「WeatherImage」を選択します。

Expressionボックスに#{row.WeatherImage}という式が移入されることを確認します。
「OK」をクリックします。

ビジュアル・エディタで、ページ上の表は次のように表示されます。
Structureウィンドウで、「af:outputText - #{...WeatherImage.label}」を選択し、[Delete]キーを押してコンポーネントを削除します。

2番目の列af:column - #{...WeatherImage.label}は、Structureウィンドウで次のように表示されます。
エディタ・ウィンドウで、「adfc-config.xml」タブをクリックして、ダイアグラムを前面に表示します。「InputPage」アイコンを右クリックし、「Run」を選択します。

Create Default Domainダイアログが表示されたら、PasswordフィールドとConfirm Passwordフィールドにデフォルト・パスワード（例：weblogic1）を入力し、「OK」をクリックします。

最初のページは、ブラウザで次のように表示されます。
入力フィールドに94065と入力し、「GetWeatherByZipCode」をクリックします。

サービスの使用状況によって異なりますが、2番目のページにデータが返されるまでしばらくかかる場合があります。

2番目のページの表に、今後数日間の天気予報が表示されています。

列見出しの間にカーソルを合わせ、左右にドラッグすると、表の列幅を調整できます。

列見出しのSort AscendingアイコンやSort Descendingアイコンを選択すると、列のソート機能を使用できます。
ブラウザに表示された2番目のページで、「Return」ボタンをクリックします。別の郵便番号に対する天気予報を表示してみます。

IDEからJSFアプリケーションを実行すると、JDeveloperは次の処理を自動的に実行します。

詳細表示

ステップ7：ラベルの設定

エディタ・ウィンドウで、「DataControls.dcx」タブをクリックして、DCX概要エディタを前面に表示します。

DCXファイルが開かれていない場合は、アプリケーション・ナビゲータのModelプロジェクトにある「DataControls.dcx」をダブルクリックし、ファイルを開きます。
「GetWeather」→「GetWeatherByZipCode()」→「Return」→「GetWeatherByZipCodeResult」→「Details」の順に展開します。次に、「WeatherData」を選択し、「」Editをクリックして、概要エディタをもう1つ開きます。
WeatherData.xml概要エディタの左側にある「Attributes」をクリックします。
Attributes表でDayが選択された状態で、「UI Hints」タブをクリックします。次に、LabelフィールドにDay of the weekと入力します。

Oracle ADFコントロール・ヒントは、JavaBeansベースのどのビジネス・サービスのデータ項目も、すべてのクライアント・タイプを通じて同じようにレンダリングさせるメカニズムが集約されています。

詳細表示コントロール・ヒントと呼ばれるこのメカニズムを使用すると、アプリケーション開発者は複数のクライアントにまたがる特定のUI設定を一元管理できるため、UIとデータ項目とのインタラクション方法をさまざまな側面から制御できます。コントロール・ヒントはビジネス・サービス・レベルで設定されるため、UIコーディング量も削減されます。

Oracle ADFコントロール・ヒントのメカニズムでサポートされているコントロール・ヒント・プロパティのうち、カスタマイズできるものは次のとおりです。

Display Hint：属性を表示するかしないかを決定します。
Label：データ項目の値の前に表示されるプロンプトまたは表ヘッダーに使用されるテキスト。
Tooltip：ツールチップまたはマウスオーバーしたときの表示に使用されるテキスト。 Webアプリケーションの場合は、HTMLのALT属性の値として表示されます。
Format Type：データ項目を表示するときに使用するフォーマッタを定義します。フォーマッタとは基本的に書式マスクの集合であり、<JDeveloperのインストール先>/jdeveloper/systemn.n.n.../o.BC4J/formatinfo.xmlファイル内に定義できます。
Format：選択したフォーマッタで使用される特定の書式マスク。
Control Type：クライアントUIに含まれるデータ項目の表示に使用されるコントロールのタイプ。 Editを指定するとコントロールの編集が可能になり、Dateを指定するとカレンダ・ピッカーが表示され、Defaultを指定するとクライアントで選択されたもっとも適切なコントロールに変換されます。
Display Width：データ項目を表示するコントロールの文字幅を定義します。
Display Height：データ項目を表示するコントロールの文字列の数を定義します。
Form Type： DetailモードとSummaryモードのいずれで属性を表示するかを決定します。 Detailモードを指定すると長いフォームが生成され、Summaryモードを指定すると短いフォームが生成されます。このプロパティはOracle ADF Swingアプリケーションに対してのみサポートされます。Business Components Webアプリケーションでは使用できません。
Field Order：カテゴリ内で属性がレンダリングされる順番を定義します。
Category：動的にレンダリングされるユーザー・インタフェースで、表示する属性をグループ化するときに使用される識別子。ユーザー・インタフェースには、同じカテゴリに含まれる他の属性とともにこの属性がレンダリングされます。カテゴリ・ヒントを使用すると、大規模なビュー・オブジェクト属性リストをカテゴリで関連付けられた小さなグループに分割して、ユーザー・インタフェースに表示できます。このコントロール・ヒントは、動的にレンダリングして属性を表示するあらゆるユーザー・インタフェースで活用できます。
Auto Submit： trueに設定（有効化）されている場合、ユーザー・インタフェースの値が変更されると、部分送信を起動します。

Attributes表で「WeatherImage」を選択し、LabelフィールドにGraphicと入力します。

ビジネス・サービス・レベルでコントロール・ヒントを追加すると、プロジェクトに対するテキスト・リソースを含む.propertiesファイルがJDeveloperによって作成されます。

詳細表示

設定したコントロール・ヒントに対する値が定義されたこのファイルは、プロジェクトで使用される固有のビジネス・サービスによって異なります。 Beanベースのビジネス・サービスの場合（JavaBeans、Enterprise JavaBeans、Oracle TopLinkを含む）、JDeveloperはデフォルトで、プロジェクトのテキスト・リソースを含む標準の.propertiesファイルを生成し、翻訳可能な文字列としてコントロール・ヒントを保存します。

アプリケーション・ナビゲータのModelプロジェクトには、ModelBundle.propertiesが追加されていることに注意してください。

アプリケーション・ナビゲータ、DataControlプロジェクト

コントロール・ヒントを保存する際にJDeveloperで使用されるプロジェクト・レベルのリソース・バンドル・オプションは、Project PropertiesダイアログのResource Bundleページで決定されます。 Resource Bundle TypeオプションはデフォルトでProperties Bundleに設定されており、.propertiesファイルが生成されます。

プロジェクトのコントロール・ヒントを初めてカスタマイズする際に、ModelBundle.propertiesファイルが作成されます。 ModelBundle.propertiesファイルには、ユーザーが追加したコントロール・ヒント定義に変換できるキー文字列が含まれます。たとえば、ソース・エディタでModelBundle.propertiesを開くと、次のコードが表示され、翻訳可能な文字列を特定できます。

# 
 model.GetWeather.GetWeatherByZipCode.GetWeatherByZipCodeResult.
  Details.WeatherData.Day_LABEL=Day of the week
 model.GetWeather.GetWeatherByZipCode.GetWeatherByZipCodeResult.
  Details.WeatherData.WeatherImage_LABEL=Graphic

エディタ・ウィンドウで、「adfc-config.xml」タブをクリックして、ダイアグラムを前面に表示します。「InputPage」アイコンを右クリックし、「Run」を選択します。

ブラウザに2番目のページが表示されたら、表の左側の2つの列見出しに設定した新しいラベルを確認します。

まとめ

このチュートリアルでは、サービスのWSDLを使用して、既存のWebサービスに対するデータ・コントロールを作成しました。このチュートリアルで学習した内容は、以下のとおりです。

JDeveloperのウィザードおよびダイアログを使用した、アプリケーション、プロジェクト、初期ページの作成
ビジュアル・エディタ、コンポーネント・パレット、プロパティ・インスペクタを使用した、UIページの作成
Webサービス定義URLを使用した、データ・コントロールの作成
Data Controlsパネルを使用した、コーディングなしでのデータバインドUIコンポーネントの作成
一元化された場所での、ビジネス・サービスに対するラベルの設定
統合WebLogic Serverを使用したOracle ADF Facesアプリケーションの実行

Oracle ADFデータ・バインディングおよびデータバインド・アプリケーションの開発について、詳しくは下記のWebサイトを参照してください。

すべて表示 | すべて非表示

トップへ戻る