JSF自定義組件

知道怎麼自定義JSF組件，有利於我們理解一些第三方的界面框架，如：prime faces。

爲了簡單起見，我們把項目分成兩個工程， 一個是WEB工程，引用我們自寫義的組件，一個是普通的的java工程，打成jar包之後，在web工程裏進行引用。

兩個工程都是基於maven的。

先看java工程。

JAVA工程

pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.zolcorp.jsfcom</groupId>
  <artifactId>jsfcom</artifactId>
  <version>0.0.1</version>
  <name>jsfcom</name>
  <description>jsfcom</description>
  <dependencies>
		<dependency>
			<groupId>commons-fileupload</groupId>
			<artifactId>commons-fileupload</artifactId>
			<version>1.2</version>
		</dependency>
		<dependency>
			<groupId>commons-beanutils</groupId>
			<artifactId>commons-beanutils</artifactId>
			<version>1.8.0</version>
		</dependency>
		<dependency>
			<groupId>commons-io</groupId>
			<artifactId>commons-io</artifactId>
			<version>1.4</version>
		</dependency>
		<dependency>
			<groupId>commons-collections</groupId>
			<artifactId>commons-collections</artifactId>
			<version>3.2.1</version>
		</dependency>
		<dependency>
			<groupId>commons-digester</groupId>
			<artifactId>commons-digester</artifactId>
			<version>1.8</version>
		</dependency>
		<dependency>
			<groupId>commons-logging</groupId>
			<artifactId>commons-logging</artifactId>
			<version>1.1</version>
		</dependency>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-api</artifactId>
			<version>2.1.2</version>
		</dependency>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-impl</artifactId>
			<version>2.1.2</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>jstl</artifactId>
			<version>1.2</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>servlet-api</artifactId>
			<version>2.5</version>
			<scope>provided</scope>
		</dependency>
		<dependency>
			<groupId>javax.servlet.jsp</groupId>
			<artifactId>jsp-api</artifactId>
			<version>2.1</version>
			<scope>provided</scope>
		</dependency>
		<dependency>
			<groupId>taglibs</groupId>
			<artifactId>standard</artifactId>
			<version>1.1.2</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>jstl</artifactId>
			<version>1.2</version>
		</dependency>
		<dependency>
			<groupId>org.mongodb</groupId>
			<artifactId>mongo-java-driver</artifactId>
			<version>2.11.0</version>
		</dependency>
	</dependencies>
</project>

src/main/resources/META-INF/helloworld.taglib.xml

<?xml version='1.0' encoding='UTF-8'?>
<facelet-taglib 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-facelettaglibrary_2_0.xsd"
	version="2.0">
	<namespace>http://myjsf.com/component</namespace>
	<tag>
		<tag-name>htmlHelloWorld</tag-name>
		<component>
			<component-type>htmlHelloWorld</component-type>
		</component>
	</tag>
</facelet-taglib>

src/main/resources/META-INF/faces-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<faces-config version="2.0" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xi="http://www.w3.org/2001/XInclude" 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_2_0.xsd">
	<component>
    	<component-type>htmlHelloWorld</component-type>
    	<component-class>com.zolcorp.myjsf.component.HtmlHelloWorld</component-class>
  	</component>
</faces-config>

JAVA組件類

public class HtmlHelloWorld extends UIComponentBase {

	@Override
	public String getFamily() {
		return null;
	}

	@Override
	public void encodeAll(FacesContext context) throws IOException {
		ResponseWriter writer = context.getResponseWriter();
		writer.startElement("div", this);
		writer.writeAttribute("style", "color : red", null);
		writer.writeText("HelloWorld! today is: " + new java.util.Date(), null);
		writer.endElement("div");
	}
}

在項目上執行maven install，即可把項目打成jar包，上傳到自己的maven倉庫。

WEB項目

pom.xml中添加如下依賴：

<dependency>
			<groupId>com.zolcorp.jsfcom</groupId>
			<artifactId>jsfcom</artifactId>
			<version>0.0.1</version>
		</dependency>

新增一個頁面，測試下：

<?xml version="1.0" encoding="UTF-8"?>
<!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:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:zl="http://myjsf.com/component">
<h:head>
	<title>myjsf</title>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</h:head>
<h:body>
	<zl:htmlHelloWorld/>
</h:body>
</html>

頁面顯示如下：