1，创建web project
2，定义tiles.xml
内容如下:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE tiles-definitions SYSTEM "C:/JavaDemo/dbDemo/userInfoWeb/WebRoot/WEB-INF/tiles-config_2_1.dtd">
<tiles-definitions>
<definition name="myapp.homepage" template="/tiles/layout.jsp">
<put-attribute name="title" value="Tiles tutorial homepage" />
<put-attribute name="header" value="/tiles/header.jsp" />
<put-attribute name="menu" value="/tiles/menu.jsp" />
<put-attribute name="body" value="/tiles/cBody.jsp" />
<put-attribute name="footer" value="/tiles/footer.jsp" />
</definition>
<definition name="index" extends="myapp.homepage">
<put-attribute name="body" value="/Content/indexContent.jsp"/>
</definition>
<definition name="list" extends="myapp.homepage">
<put-attribute name="body" value="/Content/listContent.jsp"/>
</definition>
</tiles-definitions>
红色标记处需要注意:如果不能联网，可以使用本地的dtd进行验证，如果可以联网则使用网络上的tiles-config_2_1.dtd进行验证
3，设定页面布局
tiles中myapp.homepage为默认模板名称，其布局由layout.jsp页面控制。
此次体验的layout.jsp如下:
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="../WEB-INF/struts-tiles.tld" prefix="tiles" %>
<html>
<head>
<title><tiles:insertAttribute name="title" /></title>
</head>
<body>
<table width="768px" height="800px" border="2" align="center">
<tr>
<td colspan="2" align="center" valign="top" width="768px" height="100px" bgcolor="#80ff80">
<tiles:insertAttribute name="header" />
</td>
</tr>
<tr>
<td align="center" width="150px" height="800px" bgcolor="#00ff00">
<tiles:insertAttribute name="menu" />
</td>
<td align="left" width="618px" height="800px" bgcolor="#ff80c0">
<tiles:insertAttribute name="body" />
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#00ff40" height="100px">
<tiles:insertAttribute name="footer" />
</td>
</tr>
</table>
</body>
</html>
Layout.jsp中将根据自定义的Tiles.xml进行布局
|
Tiles配置项 |
Layout项 |
|
title |
<tiles:insertAttribute name="title" /> |
|
header |
<tiles:insertAttribute name="header" /> |
|
menu |
<tiles:insertAttribute name="menu" /> |
|
body |
<tiles:insertAttribute name="body" /> |
|
footer |
<tiles:insertAttribute name="footer" /> |
如此页面布局已经初步完成
4，定义内容页面
根据实际需要定义内容页面，例如Tiles.xml配置中的index从myapp.homepage模板继承，只是内容换为自定义的内容页。
<definition name="index" extends="myapp.homepage">
<put-attribute name="body" value="/Content/indexContent.jsp"/>
</definition>
此处的indexContent.jsp为自定义的页面内容
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<a href="<s:url action='List'/>">List</a>
这里只是一个简单的link指向List Action
5，编写实际访问页面
接下来的编写实际访问页面就相对比较简单了，这里以index.jsp为例
只需要使用tiles中的定义即可
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ taglib uri="WEB-INF/struts-tiles.tld" prefix="tiles" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<tiles:insertDefinition name="index" />
到目前为止已经完成了基本的配置
6，为了结合tiles的使用需要在web.xml中添加如下配置
<context-param>
<param-name>org.apache.tiles.impl.BasicTilesContainer.DEFINITIONS_CONFIG</param-name>
<param-value>/WEB-INF/tiles.xml</param-value>
</context-param>
<listener>
<listener-class>org.apache.struts2.tiles.StrutsTilesListener</listener-class>
</listener>
7，运行即可看到模板页的效果