Tiles框架建立在JSP的include指令的基础上,但它提供了比JSP的include指令更强大的功能。
Tiles框架具有如下特性:
- 创建可重用的模板
- 动态构建和装载页面
- 定义可重用的Tiles组件
- 支持国际化
Tiles框架包含以下内容:
- Tiles标签库
- Tiles组件的配置文件
- TilesPlugIn插件
Tiles标签库的<tiles:insert>标签和JSP include指令具有相同的功能,也能把其他的JSP
页面插入到当前页面中。例如,以下两条语句的作用是相同的:
<jsp:include page="indexContent.jsp"/>
<tiles:insert page="indexContent.jsp" flush="true"/>
<tiles:insert>标签的page 属性指定被插入的JSP 文件;flush属性的可选值包括true 和
false。当flush的属性值为true时,表示在执行插入操作之前,先调用当前页面的输出流的
flush()方法。
开发步骤
(1)安装Tiles标签库所需的文件。
以下文件必须位于WEB-INF/lib 目录中:
l struts.jar
l commons-digester.jar
l commons-beanutils.jar
l commons-collections.jar
l commons-logging.jar
此外,应该把Tiles标签库的定义文件struts-tiles.tld拷贝到WEB-INF目录下。
(2)在web.xml文件中配置如下<taglib>元素:
<!-- 配置tiles的tld标签库文件,tld放在WEB-INF下注意要放在 jsp-config里面-->
<jsp-config>
<taglib >
<taglib-uri>/WEB-INF/tiles/struts-tiles.tld</taglib-uri>
<taglib-location>/WEB-INF/tiles/struts-tiles.tld</taglib-location>
</taglib>
</jsp-config>
(3)创建index.jsp和product.jsp文件。
修改16.2 节的例程16-8(index.jsp)和例程16-9(product.jsp),在index.jsp和product.jsp
文件的开头,通过<%@ taglib>指令引入Tiles标签库,然后把源代码中的JSP include指令
改为<tiles:insert>标签.
index.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 for this page --%>
<table width="100%" height="100%">
<tr>
<%-- Sidebar section --%>
<td width="150" valign="top" align="left" bgcolor="#CCFFCC">
<tiles:insert page="sidebar.jsp" flush="true"/>
</td>
<%-- Main content section --%>
<td height="100%" width="*">
<table width="100%" height="100%">
<tr>
<%-- Header section --%>
<td valign="top" height="15%">
<tiles:insert page="header.jsp" flush="true"/>
</td>
<tr>
<tr>
<%-- Content section --%>
例程16-11 product.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 for this page --%>
<table width="100%" height="100%">
<tr>
<%-- Sidebar section --%>
<td width="150" valign="top" align="left" bgcolor="#CCFFCC">
<tiles:insert page="sidebar.jsp" flush="true"/>
</td>
<%-- Main content section --%>
<td height="100%" width="*">
<table width="100%" height="100%">
<tr>
<%-- Header section --%>
<td valign="top" height="15%">
<tiles:insert page="header.jsp" flush="true"/>
</td>
<tr>
<tr>
<%-- Content section --%>
<td valign="top" height="*">
<tiles:insert page="productContent.jsp" flush="true"/></tr>
<tr>
<%-- Footer section --%>
<td valign="bottom" height="15%">
<tiles:insert page="footer.jsp" flush="true"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body >
以上虽然用到了<titles:insert>但是页面还是存在很多重复代码,可以采用 Tiles模版机制实现
Tiles 模板
通俗地讲,Tiles 模板是一种描述页面布局的JSP 页面。Tiles 模板只定义了Web 页面
的样式,而不指定内容。在Web 应用运行时,才把特定内容插入到模板页面中。同一模板
可以被多个Web页面共用。
使用模板,可以轻松地实现Web 应用的所有页面保持相同的外观和布局,而无需为每
个页面硬编码。在一个应用中,大多数页面使用同一个模板,某些页面可能需要不同的外
观,而使用其他的模板,因此一个应用可能有一个以上的模板。
以下是在tilestaglibs应用中使用Tiles模板的步骤。
(1)安装Tiles标签库所需的文件.
(2)在web.xml文件中配置<taglib>元素.
(3)定义模板文件
例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模板
例 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>
例 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 文件的长度都缩短了,但
是两者还是存在重复代码。
*******************************************************************************
采用Tiles 模板和Tiles 组件创建复合式网页
为了最大程度地提高代码的可重用性和灵活性,Tiles 框架引入了Tiles 组件的概念。
*******************************************************************************
Tiles 组件可以代表一个完整的网页,也可以代表网页的一部分。简单的Tiles 组件可以组
合成复杂的Tiles组件,或被扩展为复杂的Tiles组件。
Tiles组件的基本使用方法
Tiles框架允许在专门的XML文件中配置Tiles组件。例如,以下代码定义了一个名为
“index-definition”的Tiles组件,它描述整个index.jsp网页:
xml文件
<tiles-definitions>
<definition name="index-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar.jsp"/>
<put name="header" value="header.jsp"/>
<put name="content" value="indexContent.jsp"/>
<put name="footer" value="footer.jsp"/>
</definition>
</tiles-definitions>
<definition>元素的name 属性指定Tiles组件的名字,path属性指定Tiles组件使用的模
板,<definition>元素的<put>子元素用于向模板中插入具体的网页内容。
步骤
(1)安装Tiles标签库所需的文件,
(2)在web.xml文件中配置<taglib>元素,
(3)在专门的XML 文件中配置Tiles 组件, 在本例中把这个配置文件命名为
tiles-defs.xml,这个文件位于WEB-INF目录下。例为tiles-defs.xml文件的代码。
例 tiles-defs.xml
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 1.1//EN"
"http://jakarta.apache.org/struts/dtds/tiles-config_1_1.dtd">
<tiles-definitions>
<definition name="index-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar.jsp"/>
<put name="header" value="header.jsp"/>
<put name="content" value="indexContent.jsp"/>
<put name="footer" value="footer.jsp"/>
</definition>
<definition name="product-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar.jsp"/>
<put name="header" value="header.jsp"/>
<put name="content" value="productContent.jsp"/>
<put name="footer" value="footer.jsp"/>
</definition>
</tiles-definitions>
以上代码定义了两个Tiles组件,它们分别代表完整的index.jsp和product.jsp页面。
(4)在Strut配置文件中配置TilesPlugin插件,其代码如下:
<plug-in className="org.apache.struts.tiles.TilesPlugin" >
<set-property property="definitions-config" value="/WEB-INF/tiles-defs.xml" />
<set-property property="definitions-parser-validate" value="true" />
</plug-in>
TilesPlugin 插件用于加载Tiles 组件的配置文件。在<plug-in>元素中包含几个
<set-property>子元素,用于向TilesPlugin插件传入附加的参数:
l definitions-config 参数:指定Tiles 组件的配置文件,如果有多个配置文件,则它
们之间用逗号分隔。
l definitions-parser-validate 参数:指定XML 解析器是否验证Tiles 配置文件,可选
值包括true和false,默认值为true。
(5)在web.xml文件中配置ActionServlet。
为了保证在Web 应用启动时加载TilesPlugin 插件,应该加入ActionServlet 控制器,
ActionServlet 控制器在初始化时能加载所有的插件。以下是在web.xml 文件中配置
ActionServlet的代码:
<servlet>
<servlet-name>action</servlet-name>
<servlet-class>org.apache.struts.action.ActionServlet</servlet-class>
<init-param>
<param-name>config</param-name>
<param-value>/WEB-INF/struts-config.xml</param-value>
</init-param>
<load-on-startup>3</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>action</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
(6)在index.jsp和product.jsp中插入Tiles组件
例index.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert definition="index-definition"/>
例product.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert definition="product-definition"/>
通过Struts Action来调用Tiles组件
如果Tiles 组件代表完整的网页,那么可以直接通过Struts Action 来调用Tiles 组件。
例如,如果希望通过Struts Action来调用小节定义的名为“index-definition”的Tiles
组件,那么可以在Struts配置文件中配置如下Action映射:
<action-mappings>
<action path="/index"
type="org.apache.struts.actions.ForwardAction"
parameter="index-definition">
</action>
</action-mappings>
接下来通过浏览器访问http://localhost:8080/tilestaglibs/index.do,该请求先被转发到
ForwardAction,ForwardAction再把请求转发给名为“index-definition”的Tiles组件,最后
在浏览器端,用户将看到和index.jsp相同的页面。
通过Struts Action来调用Tiles组件,可以充分发挥Struts框架负责流程控制的功能。
此外,还可以减少JSP 文件的数目。例如,如果直接通过Struts Action 来调用名为
“index-definition”的Tiles组件,就不必再创建index.jsp文件。
Tiles组件的组合
组合式开发步骤:
(1)在tiles-def.xml文件中重新定义“sidebar-definition”,“index-definition”和“productdefinition”
这三个Tiles组件。在一个Tiles组件中包含另一个Tiles组件的语法为:
<definition name="index-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar-definition" type="definition"/>
……
</definition>
以上<put>子元素的value 属性指定被包含的Tiles 组件的名字,type 属性设置为
“definition”,表示value属性指定的是Tiles组件,而不是JSP文件。以下是tiles-def.xml
文件的代码。
tiles-def.xml
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration//EN"
"http://jakarta.apache.org/struts/dtds/tiles-config.dtd">
<tiles-definitions>
<definition name="sidebar-definition" path="/sidebar-layout.jsp">
<put name="top" value="flags.jsp"/>
<put name="bottom" value="sidebar-links.jsp"/>
</definition>
<definition name="index-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar-definition" type="definition"/>
<put name="header" value="header.jsp"/>
<put name="content" value="indexContent.jsp"/>
<put name="footer" value="footer.jsp"/>
</definition>
<definition name="product-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar-definition" type="definition"/>
<put name="header" value="header.jsp"/>
<put name="content" value="productContent.jsp"/>
<put name="footer" value="footer.jsp"/>
</definition>
</tiles-definitions>
(2)创建名为“sidebar-definition”的Tiles组件的相关JSP文件。
名为“sidebar-definition”的Tiles 组件的模板文件为sidebar-layout.jsp,被插入到这个
模板中的两个JSP 文件分别为flags.jsp 和sidebar-links.jsp。例程16-19、16-20 和16-21 分
别为这几个JSP文件的源代码。
sidebar-layout.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles"%>
<table >
<tr>
<%-- Sidebar top component --%>
<tiles:insert attribute="top"/>
</tr>
<tr>
<%-- Sidebar bottom component --%>
<tiles:insert attribute="bottom"/>
</tr>
</table>
sidebar-links.jsp
<%-- Sidebar bottom component --%>
<td>
<table>
<tr>
<td>
<font size="5">Links</font><p>
<a href="index.jsp">Home</a><br>
<a href="product.jsp">Products</a><br>
<a href="">Hot Link1</a><br><a href="">Hot Link2</a><br>
<a href="">Hot Link3</a><br>
</td>
</tr>
</table>
</td>
flags.jsp
<%-- Sidebar top component --%>
<td width="150" height="65" valign="top" align="left">
<a href=""><img src="chinese.gif" border="0"/></a>
<a href=""><img src="usa.gif" border="0"/></a>
</td>
继承
一个Tiles组件继承另一个Tiles组件的语法如下,其中<definition>元素的extends 属性
指定被扩展的父类Tiles组件:
<definition name="index-definition" extends="base-definition">
tiles-def.xml
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 1.1//EN"
"http://jakarta.apache.org/struts/dtds/tiles-config_1_1.dtd">
<tiles-definitions>
<definition name="sidebar-definition" path="/sidebar-layout.jsp">
<put name="top" value="flags.jsp"/>
<put name="bottom" value="sidebar-links.jsp"/>
</definition>
<definition name="base-definition" path="/layout.jsp">
<put name="sidebar" value="sidebar-definition" type="definition"/>
<put name="header" value="header.jsp"/>
<put name="content" value=""/>
<put name="footer" value="footer.jsp"/>
</definition>
<definition name="index-definition" extends="base-definition">
<put name="content" value="indexContent.jsp"/>
</definition>
<definition name="product-definition" extends="base-definition">
<put name="content" value="productContent.jsp"/>
</definition>
</tiles-definitions>
Tiles 组件是一种可重用的组件,可以像搭积木一样,把简单的Tiles 组件组装成复杂
的Tiles组件。例如,可以把名为“index-definition”的Tiles组件的左边部分拆分为独立的
Tiles组件,名为“sidebar-definition”,即组件的嵌套