開發自定義JSF組件(2) 使用Render渲染器

時間 2019-11-12

標籤開發自定義 jsf 組件使用 render 渲染简体版

原文原文鏈接

完整的教材： html

開發自定義JSF組件(1) HelloWorld

開發自定義JSF組件(2) 使用Render渲染器

開發自定義JSF組件(3) 使用綁定變量

開發自定義JSF組件(4) 保存狀態與恢復狀態

開發自定義JSF組件(5) 在JSP中用JSF組件

上一節教程中定義的組件，使用組件自己的encodeBegin方法輸出了html代碼，更好的方法是使用Render類來輸出，爲何要單獨使用另一個類來輸出html代碼呢？這跟mvc設計有關，這裏的組件(model)保存了java的各類屬性，而輸出的視圖能夠是html、json、xml等等，因此須要使用Render類在model與view之間進行轉換，一般咱們只須要實現html的render就好了。 java

咱們仍是拿第1個教材的HelloWorld源代碼進行改造。 web

開發環境：
json

Windows 7

IntelliJ IDEA 12.1.2

jboss-6.1.0.Final

JSF 1.2

下面的5個步驟是這個組件的重構過程： mvc

一、定義組件UIHelloWorld，記住JSF的組件必須繼承javax.faces.component.UIComponent或者它的子類。這裏UIHelloWorld只是輸出一句話，繼承javax.faces.component.UIOutput最省事了，與上一節相比，這裏去掉了encodeBegin方法，新增了getFamily方法。 app

public class UIHelloWorld extends UIOutput {
    private String name;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    @Override
    public String getFamily() {
        return "com.regaltec.faces.HelloWorld";
    }
}

二、新建HelloWorldRender類，這個類繼承javax.faces.render.Renderer類，需實現其中的encodeBegin、encodeEnd和decode方法，分別用來用來轉換HTML和接受HTML值，這裏只覆蓋了encodeBegin方法。 ide

public class HelloWorldRender extends Renderer {
    @Override
    public void encodeBegin(FacesContext context, UIComponent component) throws IOException {
        UIHelloWorld helloWorld = (UIHelloWorld) component;
        if (StringUtils.isNotBlank(helloWorld.getName())) {
            ResponseWriter writer = context.getResponseWriter();
            writer.write("<div>");
            writer.write(String.format("你好，%s！ ", helloWorld.getName()));
            writer.write("</div>");
        }
    }
}

三、上面新建的Render類也必須在faces-config.xml裏聲明。 ui

<?xml version='1.0' encoding='UTF-8'?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd" version="1.2">
    <component>
        <component-type>com.regaltec.faces.HelloWorld</component-type>
        <component-class>com.regaltec.faces.component.UIHelloWorld</component-class>
    </component>
    <render-kit>
        <renderer>
            <component-family>com.regaltec.faces.HelloWorld</component-family>
            <renderer-type>com.regaltec.faces.render.HelloWorld</renderer-type>
            <renderer-class>com.regaltec.faces.renderkit.html.HelloWorldRender</renderer-class>
        </renderer>
    </render-kit>
    <application>
        <locale-config>
            <default-locale>zh_CN</default-locale>
            <supported-locale>en_US</supported-locale>
        </locale-config>
        <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>
    </application>
</faces-config>

component-family、renderer-type的命名規則能夠事先規劃好。 this

四、修改uicomponent.taglib.xml配置，新增renderer-type節點。 spa

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE facelet-taglib PUBLIC "-//Sun Microsystems, Inc.//DTD Facelet Taglib 1.0//EN" "http://java.sun.com/dtd/facelet-taglib_1_0.dtd">
<facelet-taglib>
    <namespace>http://www.regaltec.com/ida40</namespace>
     <tag>
         <tag-name>helloWorld</tag-name>
         <component>
             <component-type>com.regaltec.faces.HelloWorld</component-type>
             <renderer-type>com.regaltec.faces.render.HelloWorld</renderer-type>
         </component>
     </tag>
</facelet-taglib>

五、根據component-type、component-family、renderer-type這3個組合，能夠肯定使用那一個Render類做視圖的渲染。頁面的無需修改，如下是helloWorld.xhtml的源代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core" xmlns:ida="http://www.regaltec.com/ida40">
<f:view>
    <head>
        <title>Hello World</title>
    </head>
    <body>
        <ida:helloWorld id="welcome" name="世界" />
    </body>
</f:view>
</html>

通過上面的改造後，Component類與Render類各守其職，並對多視圖渲染提供了良好的擴展。