練習 1.2:準備開發 Portlet 和定義應用程式流程

開始之前,必須先完成練習 1.1:安裝

在上一個練習中,我們建立了 AuctionPortlet 專案來包含這個指導教學所要開發的 Portlet。為了準備建立使用者介面以及將資料新增至特定 Faces Portlet 中,我們利用 Web 圖解編輯器來定義應用程式流程。Web 圖解是用來定義應用程式流程的唯一方法,但它尤其適合 Faces 型 Portlet 應用程式的視覺化開發。

建立 Web 圖解以建構應用程式流程

Web 圖解是協助您視覺化和變更 Web 應用程式(如 Faces 或 Struts 型 Portlet 應用程式)流程的檔案。Web 圖解編輯器是用來編輯 Web 圖解的視覺化編輯器。 當您新增節點、連線和其他元件至 Web 圖解中,這通常稱為圖片圖解。

Web 圖解由節點和節點之間的連線組成。 節點是一個代表 Portlet JSP 頁面或 JavaTM Bean 等資源的圖示。 如果資源存在,節點稱為已實現;如果資源不存在,節點稱為未實現。 已實現的節點是彩色的,名稱是粗體。 未實現的節點是灰色圖示。

我們將在 Web 圖解中,新增三個 JSP 節點。 一個是主要節點,可用來導覽至兩個鏈結的詳細資料節點。

  1. 當您建立 Auction Portlet 專案時,精靈會自動建立預設的 Web 圖解檔,稱為 diagram.gph。 在專案瀏覽器中,展開「動態 Web 專案」和 AuctionPortlet 資料夾,再按兩下 Web 圖解

    這時會將檔案開在編輯窗格中,且會有如何使用 Web 圖解編輯器的指示。
    新建 Web 圖解

  2. 工作區右側作用中視圖是一個選用區,它包含若干抽屜,其中有可放在 Web 圖解的物件。您將從選用區中,新增網頁物件到 UserAdmin.gph 檔中。選用區會提供「黏貼」拖放行為,這表示您在選用區中按一下物件之後,不需要在拖放作業期間按住滑鼠按鈕。 您只需要將游標移到 Web 圖解,再按一下,就可以放下物件。

    如果要建立第一個節點,您可以從專案瀏覽器中,將 AuctionPortlet 專案所建立的起始 JSP 檢視頁面 UserAdminView.jsp 拖曳至編輯器中。由於這個檔案已建立好,因此,它會顯示為已實現的物件。

  3. 將第一個網頁物件拖放到編輯器中。將網頁的名稱改成 UserAdminCreate.jsp
  4. 重複上一步驟來建立稱為 UserAdminUpdate.jsp網頁

    附註:您可以拖曳節點來重新定位它們。

  5. 之後,您將建立網頁節點之間的連線來指定 Portlet 中的資料流:
    1. 從 UserAdminView.jsp 蹦現功能表中,選取連線。 從 UserAdminView.jsp 中,將連線拖曳至 UserAdminCreate.jsp 節點。
    2. 選擇連線對話框中,選取網頁鏈結,再按一下確定
    3. 從 UserAdminCreate.jsp 節點蹦現功能表中選取連線,將連線拖回 UserAdminView.jsp 節點。
    4. 選擇連線對話框中,選取 Faces 輸出,再按一下確定
    5. 輸入檢視來改寫強調顯示的 <new>,以命名新的連線。
    6. 從 UserAdminView.jsp 蹦現功能表中,選取連線。 從 UserAdminView.jsp 中,將連線拖曳至 UserAdminUpdate.jsp 節點。
    7. 選擇連線對話框中,選取 Faces 輸出,再按一下確定
    8. 輸入更新來改寫強調顯示的 <new>,以命名新的連線。
    9. 從 UserAdminUpdate.jsp 節點蹦現功能表中選取連線,將連線拖回 UserAdminView.jsp 節點。
    10. 選擇連線對話框中,選取 Faces 輸出,再按一下確定
    11. 輸入檢視來改寫強調顯示的 <new>,以命名新的連線。
    12. 儲存 Web 圖解。
    圖解應該看起來如下:
    Web 圖解 Skeleton

已定義的鏈結會在 Portlet 頁面中準備適當的鏈結,讓使用者起始的資料能夠經由應用程式而適當傳送。 當 UserAdminView 頁面要求使用者建立或更新動作時,會開啟適當的表單。 這些表單送出必要的資訊之後,UserAdmin Portlet 查詢功能就能夠使用新的使用者資訊。

現在您已準備好開始進行練習 1.3:開發 UserAdmin 頁面

使用條款 | 讀者意見
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.