完整的教材：

公司决策层选择了JSF做页面，WEB开发人员不容易呀，一个页面动不动就几千行，如果一个新人加入团队，估计都看晕了。我今天要写的课程，就是跟简化页面代码有关系了。自定义组件不但可以复用代码，还能让页面的代码更简洁。自定义JSF组件与JSP标签不是一回事，这里我做一个HelloWolrd的示例，这个示例是循次渐进的演进，不只是一个简单的Hello World，不过看这课程的同学需要有JSF基础。

用过JSF的同学都知道，JSF的视图可以选择JSP或Facelets技术，而绝大部份人好像对Facelets情有独钟，我们公司也不例外用了Facelets。所以我们就从做一个支持Facelets组件开始。

这个组件组件很简单，就是根据name属性输出一句话，如下面这行代码输出为：你好，世界！

<ida:helloWorld name="世界" />

开发环境：

• Windows 7
• IntelliJ IDEA 12.1.2
• jboss-6.1.0.Final
• JSF 1.2

下面的步骤是实现这个组件的过程：

1、 首先当然是定义一个组件UIHelloWorld，记住JSF的组件必须继承javax.faces.component.UIComponent或者它的子类。这里UIHelloWorld只是输出一句话，继承javax.faces.component.UIOutput最省事了。

public class UIHelloWorld extends UIOutput {    private String name;    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    @Override    public void encodeBegin(FacesContext context) throws IOException {        ResponseWriter writer = context.getResponseWriter();        writer.write("
    
     ");        if (StringUtils.isNotBlank(this.name)) {            writer.write(String.format("你好，%s！" + this.name));        }        writer.write("
    
");    }}

HelloWorld组件只定义了一个属性name，并且覆盖了父类的encodeBegin方法，这个方法很简单，就是网页上输出一段文字。

2、在faces-config.xml里声明HelloWorld组件。

    
    
         
     
              
      
       com.regaltec.faces.HelloWorld
              
      
       com.regaltec.faces.component.UIHelloWorld
          
         
     
              
      
                   
       
        zh_CN
                   
       
        en_US
               
              
      
       com.sun.facelets.FaceletViewHandler
          
     
    

component-type是组件的一个类型、名称之类的，可以根据个人喜好命名。

3、要在网页上使用这个组件，还必须要对这个组件作标签声明。标签的声明在uicomponent.taglib.xml这个文件中，这个文件一般以taglib.xml结尾，放在WEB-INF目录或者子目录下。

    
    
         
     
      http://www.regaltec.com/ida40
          
     
               
      
       helloWorld
               
      
                    
       
        com.regaltec.faces.HelloWorld
                
           
     
    

namespace在写网页的时候会使用，而component-type这项与faces-config.xml的定义的必须要一致。

4、但是Application Server还不能识别我们自定义的组件，需要告诉Application Server自定义的标签在那里，这个步骤也简单，只要打开web.xml，加上下面3行代码。

        
     
      facelets.LIBRARIES
         
     
      /WEB-INF/uicomponent.taglib.xml
     
    

5、经过上面4个步骤，我们已完成了HelloWorld组件的全部工作了，现在我写一个页面使用这个组件。

大家可以留意到，只要引入我们在uicomponent.taglib.xml的命名空间，就可以用ida:helloWorld来引用组件了。

下一节，我将使用Render类改造这个例子。Renderer类是JSF组件开发中一个较重要的类，该类主要功能是在Java和HTML之间的转换，在响应阶段将Java组件的属性转换为HTML代码，在接受请求阶段将HTML Request中传来的资料转换为Java组件的属性。

以上代码在jboss-6.1.0.Final调试通过，感谢百度云网盘提供。