ADF UIXの使用経験があるユーザーは、名前付き子コンポーネントをすでに理解していると想定されます。ファセットは、名前付き子コンポーネントに類似しています。ファセットは親コンポーネントの内部で使用し、いくつかの子コンポーネントをページに表示する方法を制御します。
ADF UIXと同様に、一部のJSFコンポーネントでは、ファセット(f:facet
)という特別な要素を使用して、事前に定義した特定の位置に子コンポーネントをレンダリングできます。ファセットは、特定の子コンポーネントの事前定義の位置を管理する、ロール定義の名前付き要素です。
1つのファセットは1つの子コンポーネント用の空のプレースホルダと考えてください。各ファセットには名前があり、その名前によって、ファセットの目的と、親コンポーネントとページに相対する子コンポーネントのレンダリング位置が定義されます。通常、ファセットは、ページのコンポーネント・ツリーの親子関係から独立しているコンポーネント、または親子関係に対して直交のコンポーネントを表すために使用されます。
たとえば、h:panelGrid
タグにheader
とfooter
の2つのファセット要素があるとします。これらのファセット要素をpanelGrid
コンポーネント内で使用して、特定の子コンポーネントの配置方法を制御します。JSPコード内でのheader
とfooter
ファセット要素の配置場所とは関係なしに、レンダラでは、常に、header
ファセットの子コンポーネントが表の上部に、footer
ファセットの子コンポーネントが表の下部に配置されます。
たとえば、前述のイメージを生成するJSPコードは次のようになります。
<h:panelGrid columns="2">
<h:outputText value="Row1Col1"/>
<h:outputText value="Row1Col2"/>
<f:facet name="header">
<h:outputText value="A header child component renders here"/>
</f:facet>
<h:outputText value="Row2Col1"/>
<h:outputText value="Row2Col2"/>
<h:outputText value="Row3Col1"/>
<f:facet name="footer">
<h:outputText value="A footer child component renders here"/>
</f:facet>
<h:outputText value="Row3Col2"/>
</h:panelGrid>
または
<h:panelGrid columns="2">
<f:facet name="footer"> <h:outputText value="A footer child component renders here"/> </f:facet>
<h:outputText value="Row1Col1"/>
<h:outputText value="Row1Col2"/>
<h:outputText value="Row2Col1"/>
<h:outputText value="Row2Col2"/>
<f:facet name="header"> <h:outputText value="A header child component renders here"/> </f:facet>
<h:outputText value="Row3Col1"/>
<h:outputText value="Row3Col2"/>
</h:panelGrid>
ただし、生成されるHTMLコードは常に次のようになります。
<table>
<thead>
<tr>
<th colspan="2" scope="colgroup">A header child component renders here</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="2">A footer child component renders here</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Row1Col1</td>
<td>Row1Col2</td>
</tr>
<tr>
<td>Row2Col1</td>
<td>Row2Col2</td>
</tr>
<tr>
<td>Row3Col1</td>
<td>Row3Col2</td>
</tr>
<tr>
<td>Row4Col1</td>
<td>Row4Col2</td>
</tr>
<tr>
<td>Row5Col1</td>
<td>Row5Col2</td>
</tr>
<tr>
<td>Row6Col1</td>
<td>Row6Col2</td>
</tr>
<tr>
<td>Row7Col1</td>
<td>Row7Col2</td>
</tr>
</tbody>
</table>
注意: 1つの親コンポーネントに複数のファセット要素を設定できますが、各ファセットに設定できるのは1つの子コンポーネントのみです。1つのファセットで複数の子コンポーネントを使用する必要がある場合は、子コンポーネントの周囲でh:panelGroup
コンポーネントを使用します。次に例を示します。
<f:facet name="footer">
<h:panelGroup>
<h:outputText value="A footer child component renders here"/>
<f:verbatim>
<br/>
</f:verbatim>
<h:outputText value="A second footer child component renders here"/>
</h:panelGroup>
</f:facet>
ファセットを使用するADF Facesコンポーネントの例に、panelPage
コンポーネントがあります。たとえば、次のコード・スニペットで示すように、名前付きファセットのcorporateBranding
とcopyright
には、企業ロゴと著作権についての記述をページに配置する場所が事前に定義されています。
<af:panelPage title="Title 1"
<f:facet name="branding">
<af:objectImage source="images/someimg.jpg"/>
</f:facet>
<f:facet name="appCopyright">
<af:panelGroup>
<af:goLink text="goLink 1"/>
<af:goLink text="goLink 2"/>
<f:facet name="separator">
<af:objectSeparator />
</f:facet>
</af:panelGroup>
</f:facet>
</af:panelPage>
Copyright © 1997, 2007, Oracle. All rights reserved.