メニュー・モデルでのページ・コンポーネントの使用

メニューのレンダリングでは、PanelPageコンポーネントを使用するかわりに、Pageコンポーネントの柔軟なレンダリング機能を利用して、Pageコンポーネントをメニュー・モデルに値バインドできます。これによって、メニュー・コンポーネントのルック・アンド・フィールを簡単に変更でき、Pageコンポーネントに対して新規のレンダラを作成するだけで済みます。panelPageコンポーネントを使用する場合は、メニュー・コンポーネントごとにレンダラを変更する必要があります。

たとえば、次のメニューのmenu2ファセットとmenu3ファセット(青のメニュー・バーと左側のナビゲーション・リスト)のコードを考えてみます。

左側に「Benefits」、メニューに「Insurance」と「Paid Time off」

この内容を手動で入力すると、次のようになります。

<f:facet name="menu2">
 <af:menuBar>
   <af:commandMenuItem text="Insurance" action="go.insurance"/>
   <af:commandMenuItem text="Paid Time Off" action="go.pto"/>
 </af:menuBar>
</f:facet>
<f:facet name="menu3">
 <af:menuList>
   <af:commandMenuItem text="Health" action="go.health"/>
   <af:commandMenuItem text="Dental" action="go.dental"/>
 </af:menuList>
</f:facet>    

PanelPageを使用してコンポーネントをメニュー・モデルにバインドする場合のコードは、次のようになります。

<f:facet name="menu2">
  <af:menuBar var="node" value="#{menuModel.model}">
    <f:facet name="nodeStamp">
      <af:commandMenuItem text="#{node.label}"
                          action="#{node.getOutcome}"/>
    </f:facet>
  </af:menuBar>
</f:facet>
<f:facet name="menu3">
  <af:menuList var="node" value="#{menuModel.model}">
    <f:facet name="nodeStamp">
      <af:commandMenuItem text="#{node.label}"
                          action="#{node.getOutcome}"/>
    </f:facet>
  </af:menuList>
</f:facet>    

Pageコンポーネントをバインドできるため、前述のコードのかわりに次のコードを使用できます。

<af:page title="Title 1" var="node" value="#{menuModel.model}">
  <f:facet name="nodeStamp">
    <af:commandMenuItem text="#{node.label}" 
 						 action="#{node.getOutcome}"type="#{node.type}"/>
  </f:facet>
</af:page>    

メニュー・コンポーネントごとにJSFページにコードを記述する必要はありません。

メニュー・モデルを使用してコンポーネントをバインドするメニュー階層を作成する手順は、次のとおりです。

  1. 各ノードに対して複数のナビゲーション・ケースがあるグローバル・ナビゲーション・ルールを1つ作成します。次に例を示します。
    <navigation-rule>
      ...
      <navigation-case>
        <from-outcome>go.insurance</from-outcome>
        <to-view-id>pages/insurance.jsp</to-view-id>
      </navigation-case>
      ...
    </navigation-rule>        
  2. メニュー・モデルの作成手順に従います。
  3. 前述のコードを参照して、メニュー階層のノードごとにJSFページを作成します。
    メニュー・モデルでは、階層(つまり、各メニュー・コンポーネントに表示されるリンク)が動的に決定され、フォーカス・パスに沿って項目が"selected"に設定されるため、実際には、各ページのメニューに同じコードを使用できます。必要なのは、Pageタグのtitleプロパティの変更のみです。

メニュー階層について
メニュー・モデルについて
ADF Facesメニューのファセットおよびコンポーネントについて
ADF Facesコンポーネントの使用