Faces 元件以 JavaServer Faces 技術為基礎。 JavaServer Faces 技術的主要好處之一,是使用者介面的呈現與基礎程式邏輯無關。 您可以利用視覺化方式來建立能夠動態存取資料,且在瀏覽器或手提式裝置中都能同樣執行的應用程式。進一步瞭解 JavaServer Faces。
Faces 用戶端元件的設計是為了補充 Faces 元件。 它們是明確建置來處理用戶端資料的瀏覽器端顯示畫面。 當使用 Faces 用戶端元件時,您可以將使用者介面元件拖曳至頁面來快速建立動態網頁。 在大部分資料驅動的網頁中,資料都會合併在 HTML 控制項中。 當使用者要檢視頁面所未顯示的資料時,瀏覽器會傳送一個要求給伺服器。 伺服器會擷取資料,將它合併在 HTML 中,再傳送新頁面給瀏覽器。 相對地,當使用 Faces 用戶端網頁時,會在控制項之外維護資料。 資料組織在控制項所能連結的正式模型中,且會儲存成每個網頁頂端的 JavaScript 物件。 這個設計可讓多個控制項連結至相同的資料。 使用者不需要與伺服器來回作業,便能檢視這項資料的不同部分,如不同的帳戶。
以下是使用 Faces 用戶端的好處:
Faces 用戶端元件有四種:資料格線、樹狀視圖、圖形,以及 Web 服務。 Faces 用戶端元件是利用 JavaScript 和 HTML 來建置的;圖形和 Web 服務元件也使用 Macromedia Flash。 這些元件可以彼此互動,因此,您可以將若干這些元件放在相同頁面中,再定義允許元件互動的事件。 比方說,帳戶清單可以顯示在鏈結至資料格線的樹狀結構中。 當使用者強調顯示樹狀結構中的某個帳戶時,資料格線會顯示這個帳戶的交易。 當使用者選取不同的帳戶時,並不需要與伺服器來回作業或重新載入頁面,資料格線便會顯示所選帳戶的交易組。
下圖是展開了 Faces 用戶端元件用戶端抽屜的「選用區」視圖,顯示您很容易拖曳至正在編輯的 JSP 頁面的元件。
下表說明您可以利用 Faces 用戶端元件抽屜所提供的元件來執行什麼動作。
Faces 用戶端元件 | 說明 |
---|---|
資料格線 | 這是一份表格,用來顯示關聯式資料庫的多項記錄或 JavaBean 陣列的多個項目。
它包括下列特性:
|
圖形 | 用長條圖、圓餅圖或線條圖來呈現資料。
附註:瀏覽器中必須安裝 Macromedia Flash 7 或更新的版本。 |
樹狀視圖 | 建立一個用來顯示階層式資料的樹狀結構。 |
Web 服務 | 從現有的 Web 服務中擷取資料,且不重新整理頁面。
附註:瀏覽器中必須安裝 Macromedia Flash 7 或更新的版本。 |
一般而言,開始在應用程式中使用 Faces 用戶端元件之前,您必須執行一些動作:
現在,您可以從「選用區」視圖的抽屜中,使用 Faces 用戶端元件。 請將元件拖曳至「設計」視圖來將元件新增到您的頁面中。
現在您已準備好開始進行練習 1.2:演練範例應用程式。