詳細アイコン IDE内の表示

ステップを完了すると、ビジュアル・エディタは次のようになります。

ビジュアル・エディタ

エディタ・ウィンドウの「ソース」をクリックすると、JDeveloperによって追加されたコードが表示されます。レベル3のナビゲーション・ペインのコードは、hint属性とlevel属性の値以外は他のレベルとまったく同じです。

<af:navigationPane hint="list" level="3"
                   value=#{root_menu} var="menuInfo"..>
  <f:facet name="nodeStamp">
    <af:commandNavigationItem text="#{menuInfo.label}"
                              icon="#{menuInfo.icon}"
                              destination="#{menuInfo.destination}"
                              action="#{menuInfo.doAction}"../>
  </f:facet>
</af:navigationPane>

テンプレートの「body」ファセット定義を参照するファセット参照のコードは、次のようになります。

<af:facetRef facetName="body"/>

myTemplate.jspxの「構造」ウィンドウの「ソース」タブでは、「af:pageTemplateDef」の下の構造は次のようになります。

構造ウィンドウ、facetRef

「af:panelStretchLayout」「center」ファセットには、ネストされた3つの「af:decorativeBox」コンポーネントがあります。外側にある2つの各「af:DecorativeBox」コンポーネントには、その「top」ファセット(レベル1とレベル2のタブ)に1つの「af:navigationPane」コンポーネントがあります。最も内側にある「af:decorativeBox」コンポーネントの「top」ファセットには、「af:breadCrumbs」コンポーネントが1つあります。

最も内側にある「af:decorativeBox」コンポーネントの「center」ファセットには、「af:panelSplitter」コンポーネントが1つあります。「af:panelSplitter」「first」ファセットには、「af:navigationPane」コンポーネント(レベル3のリスト)が1つあり、その「second」ファセットには、「af:facetRef」コンポーネント(テンプレートの「body」ファセットを参照)が1つあります。

「af:panelStretchLayout」「top」ファセットには、「af:panelHeader」コンポーネントが1つあります。「af:panelHeader」「menuBar」ファセットには、「af:navigationPane」コンポーネント(レベル0のボタン)が1つあります。

注意: 用意されているサンプル・テンプレート・コードを使用して、各自が作成したページ・テンプレート定義が正しいかどうかを確認できます。