在現有的jsf web應用中使用Oracle ADF Faces

    Oracle ADF Faces(adfFaces)提供了豐富的UI組件,可以簡化你的web應用開發.可以通過學習示例代碼來理解adfFaces的使用,示例代碼包.

 adfFaces定義了一個API和一套基本的標簽來構建基于web的用戶接口,它基于JSF框架,擴展了UI組件.本文將展示如何在現有的JSF應用中使用adfFaces所提供的UI組件.

 首先,要運行示例代碼,最低環境要求為J2SE 1.4,Servlet 2.3,JSP 1.2,JSF 1.1,ADF Faces EA13,JSTL 1.0,支持JDBC的數據庫或者Oracle Toplink.

 本文將基于另外一篇文章介紹的例子,在此例子基礎上用adfFaces替換JSF接口來實現數據的訪問.之前的例子可以參見鏈接.

 和JSF類似,adfFaces也提供了一個開放的API供你的JAVA類使用,兩個JSP標簽庫(HTML & CORE)供頁面使用.另外,adfFaces也包括一系列的資源(圖片,js,css)以供UI組件內部使用.

 下載資源包,將adf-faces-api-ea13.jar, adf-faces-impl-ea13.jar和share-1_1_18.jar拷貝到你的web項目lib庫中(一般是WEB-INF\lib\),解壓adf-faces-install-ea13.zip(包括了圖片,js和css)到你的web應用相應目錄.

 服務端web.xml的配置:

<servlet>
    <servlet-name>FacesServlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
    <servlet-name>FacesServlet</servlet-name>
    <url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>FacesServlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
</servlet-mapping>

...

<filter>
    <filter-name>AdfFacesFilter</filter-name>
    <filter-class>
        oracle.adf.view.faces.webapp.AdfFacesFilter
    </filter-class>
</filter>
<!-- regist the FaceServlet to adfFaces -->
<filter-mapping>
    <filter-name>AdfFacesFilter</filter-name>
    <servlet-name>FacesServlet</servlet-name>
</filter-mapping>

 新建adf-faces-config.xml,在此描述符制定額外的參數

<?xml version="1.0"?>
<adf-faces-config 
        xmlns="http://xmlns.oracle.com/adf/view/faces/config">
    <debug-output>true</debug-output>
    <accessibility-mode>
        #{prefs.proxy.accessibilityMode}
    </accessibility-mode>
    <look-and-feel>
        #{prefs.proxy.lookAndFeel}
    </look-and-feel>
</adf-faces-config>

遵循如下步驟修改你現有的jsp頁面

1. 導入adfFaces標簽庫

a) 核心庫包含UI組件,按鈕,輸入框,列表,菜單,表格,樹,面板等等

<%@ taglib prefix="af" uri="http://xmlns.oracle.com/adf/faces/EA13" %>

b) HTML庫包含了HTML元素標簽
<%@ taglib prefix="afh" uri="http://xmlns.oracle.com/adf/faces/EA13/html" %>

2.使用adfFaces的HTML標簽<afh:html>,<afh:head>和<afh:body>

<%@ taglib prefix="af" 
    uri="http://xmlns.oracle.com/adf/faces/EA13" %>
<%@ taglib prefix="afh" 
    uri="http://xmlns.oracle.com/adf/faces/EA13/html" %>

<f:view>

    <f:loadBundle var="labels" basename="..."/>

    <afh:html>
        <afh:head title="#{labels...}"/>
        <afh:body>
            ...
        </afh:body>
    </afh:html>

</f:view>

3. 重命名原有的jsf標簽和屬性

adfFaces提供了一套與標準jsf類似的標簽,并且擴展了不少額外的標簽供使用,兩者可以混合使用,但為了統一的代碼風格建議使用同樣的標簽,如下面的JSF

<h:outputLabel for="email"
    value="#{labels.email}"/>
<h:message for="email" styleClass="message"/><br>
<h:inputText id="email" required="true"
        validator="#{subscriber.emailValidator}"
        value="#{subscriber.email}"
        size="40" maxlength="80">
    <f:validateLength minimum="1" maximum="80"/>
</h:inputText>

可以轉換成

<af:inputText id="email" required="true"
        validator="#{subscriber.emailValidator}"
        label="#{labels.email}"
        value="#{subscriber.email}"
        columns="40" maximumLength="80">
    <f:validateLength minimum="1" maximum="80"/>
</af:inputText>

其中的<af:inputText>通過屬性rows和secret的設置,能夠用來顯示單行,多行,密碼輸入

<af:inputText id="password" secret="true" required="true"
        label="#{labels.password}"
        value="#{subscriber.password}"
        columns="10" maximumLength="20">
    <f:validateLength minimum="6" maximum="20"/>
</af:inputText>

使用adfFaces的panel標簽,此標簽可以用來快速實現多種面板組合,在此不做詳細介紹.