畫面 - 群組框 - 清單

這個複合元件是用來佈置其他元件。它會將內含的所有元件對齊到單一列或直欄。

設計時的元件

清單元件拖放到頁面上:
「清單」元件按鈕

頁面中的清單元件看起來與下面類似:
設計時的「清單」元件

執行時期的元件

清單元件在執行時期會依照所加入的元件而改變。

「內容及所有屬性」視圖

元件的「內容」視圖會顯示您可以用來設定元件的最常用屬性集,而且針對不同的元件,您也會看到新增控制項、動作或其他元件的選項。若要開啟「內容」視圖,請按一下「視窗 > 顯示視圖 > 內容」;然而依預設會開啟該視圖。

「清單」元件的這些共同屬性顯示在「內容」視圖的 hx:panelBox 標籤中。如需完整的屬性清單,請參閱所有清單屬性表格。畫面項目的其他配置選項則在 hx:panelBox>項目標籤:

表 1. 清單配置選項

配置選項

說明

畫面中的項目次序

可讓您使用「上移」和「下移」按鈕來指定畫面中的元件次序。

「所有屬性」視圖會顯示您可以在元件上設定之所有屬性的表格,包括您可以從「內容」視圖來存取的那些屬性。若要切換至「所有屬性」視圖,請按一下「內容」視圖右上角的「所有屬性」圖示 「所有屬性」圖示

表 2. 所有清單屬性

屬性名稱

顯示在「內容」視圖中的排列依據

說明

align

對齊方式:水平

指定元件應該靠左對齊、置中或靠右對齊。

bgcolor

背景顏色

以 6 位數的十六進位 RGB 值來指定背景顏色,並且以 # 符號作為開頭,或者輸入顏色名稱,例如:黑色、白色、藍色等等。

binding

沒有顯示

代表這個元件的 UIComponent,通常是在支持的檔案中。

border

沒有顯示

指定表格的邊框大小(像素)。

cellpadding

填補

指定資料格邊框和內容的間隔。 如果這個屬性值是像素長度,四個邊距和內容之間都應該是這個距離。

cellspacing

間距

指定 Cell 之間要保留的空間量(像素)。

height

大小:高度

指定元件的高度(像素或百分比)。如果要指定百分比,請在值中附加 %。

id

ID

指派元件的名稱。應該是 JSP 內的唯一名稱。

layout

畫面佈置:方向

指定元件的方向是水平或垂直:
  • 水平
  • 垂直

rendered

沒有顯示

可以設成 true 或 false:
  • false - 執行時期不會將元件呈現在瀏覽器中。
  • true - 將會呈現元件。

style

樣式:內容

指定元件的 CSS 樣式資訊(如 style="font-size : 8pt ; color : red")。定義已選取的元件的內容(例如字型和顏色)。 這可以用手動方式來完成,或者按一下按鈕,然後從視窗內選取想要的內容。

styleClass

樣式:類別

當呈現這個元素時,所要套用的 CSS 樣式類別清單,各個類別之間是用空格加以區隔。 這個值必須作為產生的標記之 "class" 屬性來傳遞。定義已選取的元件的類別(例如樣式表)。 這可以用手動方式來完成,或者按一下按鈕,然後從視窗內選取想要的「類別」。

title

沒有顯示

指定執行時期在瀏覽器中顯示成工具要訣的標題文字。

valign

對齊方式:垂直

指定資料在資料格內的垂直位置:
  • top
  • 中間
  • 底部

width

大小:寬度

指定元件的寬度(像素或百分比)。如果要指定使用百分比,請在值中附加 %。

相關概念
建立使用 JavaServer Faces 的資料存取 Web 應用程式
相關工作
建立 Faces 應用程式 - 概觀
相關參考
Faces 元件參照
Faces 元件的屬性
畫面 - 群組框
畫面 - 群組框 - 格線
畫面 - 群組框 - HTML 畫面(畫面 - JSP)
畫面 - 群組框 - 貼齊邊框
畫面 - 功能表列
畫面 - 附加標籤
讀者意見
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.