尽管使用了tiles:insert标签,index.jsp和product.jsp文件还是存在很多的重复代码。为了提高Web页面的可重用性和可维护性,可以引入Tiles的模板机制。
介绍的tilestaglibs应用的源程序位于配套光盘的sourcecode/tilestaglibs/version4/tilestaglibs目录下。如果要在Tomcat上发布这个应用,只要把version4目录下的整个tilestaglibs子目录拷贝到CATALINA_HOME/webapps目录下即可。
通俗的讲,Tiles模板是一种描述页面布局的JSP页面。Tiles模板仅仅定义Web页面的样式,而不指定内容。在Web应用运行时,才把特定内容插入到模板页面中。同一模板可以被多个Web页面共用。
使用模板,可以轻松的实现Web应用的所有页面保持相同的外观和布局,无需为每个页面硬编码。在一个应用中,大多数页面使用同一模板,某些页面可能需要不同的外观,使用其他的模板,因此一个应用可能有一个以上模板。
以下是在tilestaglibs应用中使用Tiles模板的步骤。
(1)安装Tiles标签库所需的文件,同16.3节的步骤1。
(2)在web.xml文件中配置taglib元素,同16.3节的步骤2。
(3)定义模板文件,参见例程16-12。
例程16-12 layout.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles"%>
<html>
<head>
<title>TilesTaglibs Sample</title>
</head>
<body >
<%-- One table lays out all of the content --%>
<table width="100%" height="100%">
<%-- Sidebar section --%>
<tr>
<td width="150" valign="top" align="left" bgcolor="#CCFFCC">
<tiles:insert attribute="sidebar"/>
</td>
<%-- Main content section --%>
<td valign="top" height="100%" width="*">
<table width="100%" height="100%">
<tr>
<%-- Header section --%>
<td height="15%">
<tiles:insert attribute="header"/>
</td>
<tr>
<tr>
<%-- Content section --%>
<td valign="top" height="*">
<tiles:insert attribute="content"/>
</td>
</tr>
<tr>
<%-- Footer section --%>
<td valign="bottom" height="15%">
<tiles:insert attribute="footer"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
在模板文件layout.jsp中定义了网页的布局,但没有指定各部分具体的内容。layout.jsp中包含多个tiles:insert标签,它的attribute属性仅仅指定了待插入内容的逻辑名,而没有指定真正被插入的文件。
(4)在index.jsp和product.jsp中运用Tiles模板,参见例程16-13和例程16-14。
例程16-13 index.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert page="layout.jsp" flush="true">
<tiles:put name="sidebar" value="sidebar.jsp"/>
<tiles:put name="header" value="header.jsp"/>
<tiles:put name="content" value="indexContent.jsp"/>
<tiles:put name="footer" value="footer.jsp"/>
</tiles:insert>
例程16-14 product.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert page="layout.jsp" flush="true">
<tiles:put name="sidebar" value="sidebar.jsp"/>
<tiles:put name="header" value="header.jsp"/>
<tiles:put name="content" value="productContent.jsp"/>
<tiles:put name="footer" value="footer.jsp"/>
</tiles:insert>
在index.jsp和product.jsp中,tiles:insert标签指定插入的模板文件,index.jsp和product.jsp均使用相同的模板文件layout.jsp。tiles:insert标签中包含了若干tiles:put子标签,它指定插入到模板中的具体内容。tiles:put标签的name属性和模板文件中tiles:insert标签的attribute属性匹配,tiles:put标签的value属性指定插入到模板中的具体JSP文件。
采用Tiles模板机制,大大提高了代码的可重用性和可维护性,模板中包含了网页共同的布局。如果布局发生变化,只需要修改模板文件,无需修改具体的网页文件。不过,从例程16-13和16-14可以看出,尽管index.jsp和product.jsp文件的长度都缩短了,但是两者还是存在重复代码。