このトピックでは、ADF FacesのHTMLコンポーネントtableLayout
、rowLayout
およびcellFormat
について説明します。これらのコンポーネントを使用すると、行とセルで構成された表レイアウトにコンテンツを配置して書式を設定できます(次の図を参照)。
前述の表レイアウトを作成するコードは、このトピックの最後にあります。
tableLayout
コンポーネントは、HTMLの<table>
要素を使用した表レイアウトにおける一連のrowLayout
コンポーネントのラッパーです。表レイアウトは、halign
属性の"center"、"left"、"right"、"start"または"end"オプションを使用して水平方向に位置合せできます。水平方向の位置合せは、表レイアウトに通常使用されるwidth
合計が100%未満の場合にのみ機能します。セル間の間隔、セル内のパディング、各セルの周囲の境界線幅も設定できます。
詳細は、「afh:tableLayout
」タグ・リファレンスを参照してください。
rowLayout
コンポーネントは単独で使用して行にコンテンツを配置したり、tableLayout
(HTMLの<tr>
および<td>
要素)の行を定義するために使用できます。rowLayout
には任意の数の子コンポーネントを挿入できます。それぞれの子はセルに配置されます。セルは行内に連続的に配置されます。
halign
およびvalign
属性を使用すると、行内の各セルについて水平および垂直方向の位置合せをそれぞれ設定できます。水平方向の位置合せオプションはcenter、left、right、startおよびend、垂直方向の位置合せオプションはmiddle、topおよびbottomです。tableLayout
でrowLayout
が使用されていない場合、rowLayout
のwidth
属性は、通常使用される行の幅を定義します。
セルのコンテンツに追加の書式を設定するには、各子コンポーネントの周囲にcellFormat
コンポーネントを使用します。
詳細は、「afh:rowLayout
」タグ・リファレンスを参照してください。
cellFormat
コンポーネントは、rowLayout
のセルに追加の書式を指定するために使用します。たとえば、垂直または水平方向にまたがるセルの数や、格納されているセル・コンテンツに優先して使用する幅と高さを指定できます。表のヘッダー・セルまたはデータ・セルとなるセルも指定できます。
セル内での自動テキスト折返しはデフォルトで有効になっています。自動テキスト折返しを無効にするにはwrappingDisabled
属性をtrueに設定します。
セル・コンテンツの省略形を指定するには、shortText
属性を使用します。必要に応じて、セル・コンテンツのかわりに省略名がユーザー・エージェントによりレンダリングされます。
詳細は、「afh:cellFormat
」タグ・リファレンスを参照してください。
<afh:tableLayout borderWidth="1" width="50%" >
<!-- row 1 -->
<afh:rowLayout>
<afh:cellFormat rowSpan="2" halign="center" >
<h:outputText value="One"/>
</afh:cellFormat>
<afh:cellFormat halign="center" >
<h:outputText value="Two"/>
</afh:cellFormat>
<afh:cellFormat halign="center" >
<h:outputText value="Three"/>
</afh:cellFormat>
</afh:rowLayout>
<!-- row 2 -->
<afh:rowLayout>
<afh:cellFormat halign="center" >
<h:outputText value="Four"/>
</afh:cellFormat>
<afh:cellFormat halign="center" columnSpan="2" >
<h:outputText value="Five"/>
</afh:cellFormat>
</afh:rowLayout>
</afh:tableLayout>
Copyright © 1997, 2007, Oracle. All rights reserved.