协同使用 Tiles 与 Struts(转自:http://www.ibm.com/developerworks/cn/websphere/library/techarticles/0311_fung_yu/fung_yu1.html#sec1)

最新推荐文章于 2024-01-28 14:32:28 发布

郭龙_Jack

最新推荐文章于 2024-01-28 14:32:28 发布

阅读量1.2k

点赞数

文章标签： struts insert jsp websphere application header

引言

Struts 是有名的模型-视图-控制器（Model-View-Controller，MVC）框架方面的开放源码体现之一，它提供了一种便利的方式，可以用于将模块化应用程序清楚地分解成逻辑、表示和数据。Java 服务器页面（Java™Server Pages，JSP）在 MVC 框架中的作用通常是作为视图（View），它根据业务逻辑和数据生成动态的用户界面（UI）。

在另一方面，Tiles 框架增强了基于组件的设计和 Web UI 设计中的模板概念。它可以帮助开发人员解除 Web UI 组件之间的耦合并重用它们。另外，Tiles 模板及其继承特征使您能够以最小量的工作为 Web 应用程序设计出一致的外观。

IBM® WebSphere® Studio Application Developer Version 5（以下简称为 Application Developer）有内置的对 Struts 1.02 和 1.1（Beta 测试版 2）的工具和运行时支持。Tiles 可以独立于 Struts 使用，也可以与 Struts framework 集成以支持高级特征。

回页首

重用 Web UI 组件的需要

本文假定您具有 Struts 和 Application Developer 中的 Struts 工具的基本知识。如果您对本主题的一些基本信息感兴趣，请参阅用WebSphere Studio V5 编写一个简单的 Struts 应用。

为了更好地理解可以如何重用 Web UI 组件，让我们先来看一下图 1 和 2 中的两个 Web 页面（JSP）：

图 1. IBM 解决方案页面

图 2. IBM 新闻页面

您可以看到，这两个页面在页头、左侧的导航条和页脚中有很多组件是共有的。您可以不共享任何组件而为每一个页面创建单独的 JSP 来负责它的布局并且使用重复的页头、左侧导航条和页脚。当然，这种解决方案的效率是非常低的，因为对相同的 UI 组件（比如左侧导航条）的更改要求您改动每个相关的页面。

在上面的示例中，有大量的 HTML 和 JSP 代码是重复的，而 UI 组件是紧耦合的。众所周知，在软件工程中紧耦合的组件将导致高额的维护成本。一个更好的解决方案是解除 UI 组件（页头、导航、页脚和主体）之间的耦合并在不同的页面中重用它们。

<jsp:include> 标签为重用 Web UI 组件提供了一种解决方案。通过使用 <jsp:include> 标签，Solutions 页面和 News 页面可以分解成由四个 JSP 页面，如图 3 和 4 所示：

图 3. Solutions.jsp

图 4. News.jsp

Solutions 页面的 JSP 代码显示在示例 1 中，News 页面的 JSP 代码显示在示例 2 中：

示例 1. Solutions.jsp 使用了 JSP 包含标签（SimpleJSPWeb）

<HTML>
<HEAD>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
 <TD colspan="2"><jsp:include page="/Header.jsp" /></TD>
 </TR>
 <TR>
 <TD width="20%" valign="top"><jsp:include page="/Navigation.jsp" /></TD>
        
        

 <TD width="80%" valign="top">
 <jsp:include 
        
        page="/Fragment-Solutions.jsp" /></TD>
 <TR>
 <TD colspan="2"><jsp:include page="/Footer.jsp" /></TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

示例 2. News.jsp 使用了 JSP 包含标签（SimpleJSPWeb）

<HTML>
<HEAD>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
 <TD colspan="2"><jsp:include page="/Header.jsp" /></TD>
 </TR>
 <TR>
 <TD width="20%" valign="top"><jsp:include page="/Navigation.jsp" /></TD>
        
        

 <TD width="80%" valign="top">
 <jsp:include 
        
        page="/Fragment-News.jsp" /></TD>
 <TR>
 <TD colspan="2"><jsp:include page="/Footer.jsp" /></TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

Solutions.jsp and News.jsp 的样本代码在 StrutsTiles.zip 下载文件 的 SimpleJSPWeb 项目中。下载并解压 StrutsTiles.zip 后将 EAR 文件导入到一个工作区中：

在 Workbench 菜单中选择 File => Import => EAR file。
单击 Browse选择 EAR 文件。
输入 StrutsTiles 作为项目名称。

要运行任何一个样本，可以遵循下列操作步骤：

右键单击 News.jsp和 Solutions.jsp，然后选择 Run on Server。

Tiles 插入标签提供和 JSP 包含标签相同的功能。下面的 JSP 代码反映包含使用 Tiles 插入标签的解决方案：

示例 3. Solutions.jsp 带有 Tiles 插入标签（SimpleTilesWeb）

<HTML>
<HEAD>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
  <TD colspan="2">
  <tiles:insert page="/Header.jsp" flush="true"/>
  </TD>
 </TR>
 <TR>
  <TD width="20%" valign="top">
  <tiles:insert page="/Navigation.jsp" flush="true"/>
  </TD>
  <TD width="80%" valign="top">
  
        
        <tiles:insert page="/Fragment-Solutions.jsp" flush="true" />
  </TD>
 </TR>
 <TR>
  <TD colspan="2">
  <tiles:insert page="/Footer.jsp" flush="true"/>
  </TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

示例 4. News.jsp 带有 Tiles 插入标签（SimpleTilesWeb）

<HTML>
<HEAD>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
  <TD colspan="2">
  <tiles:insert page="/Header.jsp" flush="true"/>
  </TD>
 </TR>
 <TR>
  <TD width="20%" valign="top">
  <tiles:insert page="/Navigation.jsp" flush="true"/>
  </TD>
  <TD width="80%" valign="top">
  
        
        <tiles:insert page="/Fragment-News.jsp" flush="true" />
  </TD>
 </TR>
 <TR>
  <TD colspan="2">
  <tiles:insert page="/Footer.jsp" flush="true"/>
  </TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

JSP 包含标签和 Tiles 插入标签都解除了 Web UI 组件的耦合。改变一个单独的 UI 组件只需要改变负责该页面的组件，例如 Header.jsp ，而其他页面并不需要改变。示例 3 和 4 的代码位于 SimpleTilesWeb 中。

然而，在以上示例中，如果 Web 应用的 UI 布局需要从图 5 改变到图 6，在后者中主体组件可能是 fragment-Solutions.jsp 或 fragment-News.jsp ，那么有多少页面需要修改呢？如果有 N 个页面有相同的布局，您将需要修改所有的 N 个页面。因此，如果仅仅使用一个 JSP 包含标签或 Tiles 插入标签，Web 应用 UI 的布局仍然是各 JSP 彼此紧耦合的。我们需要找到一个方法来将 JSP 进行更深层的解耦合。

回页首

使用 Tiles 创建模板

我们面临的新的挑战是找到一个便捷的方法将 Web UI 从一个布局转换到另一个布局。Tiles 模板的特征满足该要求。

什么是 Tiles 模板？

Tiles 模板是一个一般不包含任何实际内容的布局。它包含一些占位符属性使得页面 URI 和字符串可以在将来被插入。内容页面如 News.jsp 和 Solutions.jsp 可以引用该模板并通过这些占位符属性插入 URI。

为创建一个模板页面，您可以使用 Tiles 插入标签。不像示例 3 中的插入标签，在 Tiles 模板中使用的插入标签仅有一个名为 attribute 的属性，它将变成 JSP 页面 URI 插入的占位符。创建页头占位符的模板代码为 <tiles:insert attribute="header" /> 。

该模板定义了具体的页面可以引用的 Web UI 组件的共同布局。以下 JSP 代码就是使用 Tiles 的一个样本模板：

示例 5. Layout.jsp 是 Tiles 模板 (TemplatingTilesWeb)

<HTML>
<HEAD>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
 <TD colspan="2"><tiles:insert attribute="header"/></TD>
 </TR>
 <TR>
 <TD width="20%" valign="top">
        
        <tiles:insert attribute="navigation"/></TD>
 <TD width="80%" valign="top">
        
        <tiles:insert attribute="body"/></TD>
 </TR>
 <TR>
 <TD colspan="2"><tiles:insert attribute="footer"/></TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

在定义完一个模板之后，它本身是不可以使用的。实际的 JSP 页面必须引用该模板并且为其属性提供页面 URI。 <tiles:insert page="/Layout.jsp"flush="true"> 行可用于引用该模板。

具体的 JSP 页面将布局组合委托给模板 Layout.jsp 。它们需要为使用 Tiles put 标签的 attribute 指定页面实现名称。代码 <tiles:put name="header" value="/Header.jsp"/> 将页面 /Header.jsp 插入名为 header 的属性。下面是使用 Tiles 模板特征的 Solutions.jsp 和 News.jsp 的 JSP 代码：

示例 6. 具有 Tiles 模板特征（TemplatingTilesWeb）的 Solutions.jsp

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert page="/Layout.jsp" flush="true">
<tiles:put name="header" value="/Header.jsp"/>
<tiles:put name="navigation" value="/Navigation.jsp"/>
<tiles:put name="body" 
        
        value="/Fragment-Solutions.jsp"/>
<tiles:put name="footer" value="/Footer.jsp"/></tiles:insert>

示例 7. 具有 Tiles 模板特征（TemplatingTilesWeb）的 News.jsp

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<tiles:insert page="/Layout.jsp" flush="true">
<tiles:put name="header" value="/Header.jsp"/>
<tiles:put name="navigation" value="/Navigation.jsp"/>
<tiles:put name="body" 
        
        value="/Fragment-News.jsp"/>
<tiles:put name="footer" value="/Footer.jsp"/></tiles:insert>

示例 5、6 和 7 的代码在 TemplatingTilesWeb 中。

如果想将布局从图 5 改变到图 6，您所需要做的只是如示例 8 中所示修改模板 Layout.jsp ，而不需要改动具体页面，比如 Solutions.jsp 和 News.jsp 。相比较未使用模板时需要修改 N 个页面，使用了 Tiles 模板特征可以显著地降低维护成本。

示例 8. 修改模板以创建新的布局

<HTML>
<HEAD>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<TITLE>IBM Solutions</TITLE>
</HEAD>
<BODY>
 <TABLE border="0">
 <TBODY>
 <TR>
 <TD colspan="2"><tiles:insert attribute="header"/></TD>
 </TR>
 <TR>
 <TD width="80%" valign="top">
        
        <tiles:insert attribute="body"/></TD>
 <TD width="20%" valign="top">
        
        <tiles:insert attribute="navigation"/></TD>
 </TR>
 <TR>
 <TD colspan="2"><tiles:insert attribute="footer"/></TD>
 </TR>
 </TBODY>
 </TABLE>
</BODY>
</HTML>

回页首

协同使用 Struts 与 Tiles

一个使用 Struts 框架的 Web 应用通常有多个 Action 类，其中每一个代表一些业务逻辑处理。 Action 类通过使用一个在 struts-config.xml 文件中定义的逻辑名称将响应委托给一个客户机。例如，下面代码显示了一个 Action 实例通过使用 JSP 的逻辑名称基于执行状态将响应 success 或 failure 委托给客户机。这个 MVC 设计模式将表示层从业务逻辑层中分离出来：

示例 9. 使用 Struts 动作 Forward

if (Status == OK)
 ActionForward forward = mapping.findForward("success");
else
 ActionForward forward = mapping.findForward("failure");
return (forward);

在 Struts 动作 Forward 中使用的逻辑名称为集成 Struts 和 Tiles 提供了一种可能性。通过使用 Tiles 模板特征，具体的 JSP 页面可以不包含任何 HTML 代码，而是用单纯的 Tiles 标签插入到模板，然后将逻辑视图组件映射到它们的实现中。Tiles 框架使得您可以通过定义名称来将具体页面分组到一个 XML 文件中，这些定义名称可以映射到 Struts 动作 Forward 使用的逻辑名称。以下六个步骤将帮助您理解这个过程。本文稍后有一个 Step-by-Step 教程 Tiles 继承和 Struts 实践详细介绍了协同使用 Tiles 与 Struts 的步骤。

将具体 Web 页面（ Solutions.jsp 和 News.jsp ）分组到 Web 项目 forwardDefinition.xml 的 WEB-INF 文件夹中的一个 XML 文件。在分组之后，就不再存在任何具体页面（比如 Solutions.jsp 或 News.jsp ）。取而代之的是，可以用逻辑名称（比如 solutionsDef 和 newsDef ）定义它们，如示例 10 所示：

示例 10. forwardDefinition.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="solutionsDef" path="/Layout.jsp">
   <put name="header" value="/Header.jsp"/>
   <put name="navigation" value="/Navigation.jsp"/>
   <put name="body" value="/Fragment-Solutions.jsp"/>
   <put name="footer" value="/Footer.jsp"/>
 </definition>
 <definition name="newsDef" path="/Layout.jsp">
   <put name="header" value="/Header.jsp"/>
   <put name="navigation" value="/Navigation.jsp"/>
   <put name="body" value="/Fragment-News.jsp"/>
   <put name="footer" value="/Footer.jsp"/>
 </definition>
</tiles-definitions>

从 XML 源码修改 struts-config.xml 并添加以下代码，使得能够在 Struts 框架中使用 Tiles 插件。在启用插件之后，Application Developer 可能显示有效性检查错误，但是您可以忽略这些错误。

示例 11.struts-config.xml 中新的代码段

<plug-in className="org.apache.struts.tiles.TilesPlugin" >
    <set-property property="definitions-config"
                  value="/WEB-INF/forwardDefinition.xml"/>
    <set-property property="moduleAware" value="true" />
    <set-property property="definitions-parser-validate" value="true" />
</plug-in>

修改 Web.xml 并为 ActionServlet 创建一个附加的初始化参数，如下图 7 所示。参数名为 definitions-config ，其值为在步骤 1 中定义的 XML 文件的位置 /WEB-INF/forwardDefinition.xml 。
图 7. 修改 Web Deployment Descriptor 以添加 definitions-config 作为初始化变量

如果您看一下 XML 源码 Web.xml ，您将会发现示例 12 中的 XML 代码段添加进去了：

示例 12. Web.xml 中新的代码段
<init-param> <param-name>definitions-config</param-name> <param-value>/WEB-INF/forwardDefinition.xml</param-value> </init-param>

通过以下代码创建一个 Action 类（例如 SolutionAction ）：

示例 13. SolutionAction

package struts.tiles.sample;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionError;
import org.apache.struts.action.ActionErrors;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
public class SolutionsAction extends Action {
 public SolutionsAction() {
  super();
 }
 public ActionForward execute(
  ActionMapping mapping,
  ActionForm form,
  HttpServletRequest request,
  HttpServletResponse response)
  throws Exception {
  ActionForward forward = mapping.findForward("success");
  return (forward);
 }
}

在编辑器中打开 struts-config.xml 文件，您将会看到一个名为 /solutions 的 Action Path 。将一个新的 Forward 添加到 /solutions Action Path。将其命名为 success 并将 Path 指定为在步骤 1 的 forwardDefinition.xml 中定义的 solutionsDef。
图 8. struts-config.xml
样本代码是在 StrutsTilesWeb 中实现的。您可以通过将浏览器定位到 http://localhost:9080/StrutsTilesWeb/solutions.do 来调用该解决方案的动作。其结果应该与 Solutions.jsp 一样。

本文后面的 Tiles 继承和 Struts 实践一节提供了一个详细的 Step-by-Step 的教程。

回页首

Tiles 继承

通过 Tiles 模板特征，布局从单个页面中分离出来了。但是还存在一个问题：如果页脚实现页面从 Footer.jsp 更改为 Footer-New.jsp ，您还得将单个页面（不使用 Struts）或 XML 定义（使用 Struts）中的页脚属性值更改为新的 JSP 名称。我们需要一个更高级的解耦，而 Tiles 继承特征提供了这样一个解决方案。

在定义配置文件 forwardDefinition.xml 时， solutionsDef 和 newsDef 的定义看起来很像。它们都有指向一个固定的 JSP 的页头、导航条和页脚。Tiles 有一个高级特性使得定义之间可以继承。因此，可以定义一个基定义来指定通用的映射，然后让其他的定义（比如 solutionsDef 和 newsDef ）从基定义继承并指定任意的自定义映射。以下代码显示了如何在定义配置文件 forwardDefinition.xml 中实现定义继承：

示例 14. 有继承的 forwardDefinition.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="baseDef" path="/Layout.jsp">
    <put name="header" value="/Header.jsp"/>
    <put name="navigation" value="/Navigation.jsp"/>
    <put name="body" value=""/>
    <put name="footer" value="/Footer.jsp"/>
  </definition>
  <definition name="solutionsDef" extends="baseDef">
    <put name="body" value="/Fragment-Solutions.jsp"/>
  </definition>
  <definition name="newsDef" extends="baseDef">
    <put name="body" value="/Fragment-News.jsp"/>
  </definition>
</tiles-definitions>

您可以使用与前一节中相同的 URL 来调用 Struts 动作。使用 Tiles 继承特征消除了定义文件中重复的 XML 代码。该解决方案节省时间，在一个 Web 应用中有很多页面共享相同的组件时尤其如此。此外，如果您想将页脚的实现从 Footer.jsp 更改成 Footer-New.jsp ，您只需要修改一个 baseDef 而不需要改动其他的定义，如示例 15 所示。Tiles 继承特征更进一步地将定义分离开来并降低维护成本。

示例 15. 更改页脚实现

<?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="baseDef" path="/Layout.jsp">
    <put name="header" value="/Header.jsp"/>
    <put name="navigation" value="/Navigation.jsp"/>
    <put name="body" value=""/>
    <put name="footer" 
        
        value="/Footer-New.jsp"/>
  </definition>
  <definition name="solutionsDef" extends="baseDef">
    <put name="body" value="/Fragment-Solutions.jsp"/>
  </definition>
  <definition name="newsDef" extends="baseDef">
    <put name="body" value="/Fragment-News.jsp"/>
  </definition>
</tiles-definitions>

该样本代码在 InheritanceTilesWeb 中。

回页首

Tiles 继承和 Struts 实践

本节将指导您创建和使用 Tiles 继承与 Struts。

启动 WebSphere Studio V5：

移动鼠标到 Windows® Start 菜单。
选择 Programs => IBM WebSphere Studio => Application Developer 5.0。

创佳一个不带 EJB 客户机或 Web 的 1.3 EAR 项目：

选择 File => New => Project => J2EE => Enterprise Application Project。单击 Next。
选择 Create 1.3 J2EE Enterprise Application Project。单击 Next。
将三个子项目全部取消选定： Application Client project、 EJB project和 Web project。
输入 StrutsTilesTutorialEAR 作为项目名。
单击 Finish。

创建一个 Web 项目并添加 Struts 支持：

选择 File => New => Projects => Web => Web Project。单击 Next。
输入 StrutsTilesTutorialWeb 作为 Web项目名。
选中 Add Struts support复选框。单击 Next。
选择 ExistingEnterprise Application Project。
找到新创建的 EAR 项目。单击 Next两次。
在 Struts Setting 页面，选择 Override default settings并为 Application Developer V5 GM 选择 1.1（Beta 测试版 2）或者为 V5.01 选择 1.1（Beta 测试版 3）。
单击 Finish。

创建以下 JSP 文件： Header.jsp、Footer.jsp、Navigation.jsp、Fragment-News.jsp 和 Fragment-Solutions.jsp ：

在 Web Perspective 中，右键单击 Web 项目下面的 /Web Content文件夹。
选择 New => JSP File。
输入 Header 作为文件名。单击 Finish。
编辑 Header.jsp 页面并将 "Place Header.jsp content here" 更改成 Header 以使版面更加简洁。保存并关闭文件。
为以下文件重复同样的步骤：
- Footer.jsp
- Navigation.jsp
- Fragment-Solutions.jsp
- Fragment-News.jsp
  
  在打开 Fragment-News.jsp 的编辑器中，转到 Source页面并添加粗体代码到 <BODY>: <BODY> <P>Fragment-News</P> <% String name = request.getParameter("name"); if (name != null) {%> Welcome, <%=name%> <% } %> </BODY>

创建 Layout.jsp ：

在 Web Perspective 中，右键单击 Web项目下的 /Web Content文件夹。
选择 New => JSP File。
输入 Layout 作为文件名。单击 Next。
单击 Add Tag Libraries。
选中 /WEB-INF/struts-tiles.tld的复选框。
输入 tiles 作为 Prefix。
单击 OK。
单击 Finish。
将以下代码复制到 Layout.jsp 的 <body> 中。保存并关闭文件。

 <h1><tiles:insert attribute="title"/></h1>
 <TABLE border="1" width="400" cellpadding="5" ID="Table31">
 <TBODY>
   <TR>
   <TD colspan="2" align="center"><tiles:insert attribute="header"/></TD>
   </TR>
   <TR>
   <TD valign="top" width="20%"  bgcolor="00ff00" align="center">
   <tiles:insert attribute="navigation"/></TD>
   <TD valign="top" width="80%"  bgcolor="ffff00" align="center">
   <tiles:insert attribute="body"/>
   </TD>
   <TR>
   <TD colspan="2" align="center"><tiles:insert attribute="footer"/></TD>
   </TR>
 </TBODY>
 </TABLE>

创建 forwardDefinition.xml ：

在 Web Perspective 中，右键单击 Web项目下的 /Web Content/WEB-INF文件夹。
选择 New => Other => XML => XML。单击 Next。
选择 Create XML from scratch。单击 Next。
输入 forwardDefinition.xml 作为文件名。单击 Finish。
在 XML 编辑器中，切换到 Source选项卡。
将编辑器中的现有代码替换成以下代码。保存并关闭编辑器。

<?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="baseDef" path="/Layout.jsp">
    <put name="header" value="/Header.jsp"/>
    <put name="navigation" value="/Navigation.jsp"/>
    <put name="body" value=""/>
    <put name="footer" value="/Footer.jsp"/>
  </definition>
  <definition name="solutionsDef" extends="baseDef">
    <put name="title" value="Solutions" type="string"/>
    <put name="body" value="/Fragment-Solutions.jsp"/>
  </definition>
  <definition name="newsDef" extends="baseDef">
    <put name="title" value="News" type="string"/>
    <put name="body" value="/Fragment-News.jsp"/>
  </definition>
</tiles-definitions>

在 /Java Source 文件夹下创建名为 NewsAction 的 Action 类：

在 Web Perspective 中，右键单击 Web项目下的 /Java Source文件夹。
选择 New => Other => Web。展开 Web => Struts => Action Class。单击 Next。
输入 struts.tiles.sample 作为 Java Package名称。
输入 NewsAction 作为类名。单击 Next。
在 Forwards 节中，单击 Add添加 Name 为 success 和 Path 为 newsDef 的一个 forwards。
单击 Finish。忽略警告 newsDef 不是一个有效路径。

添加下面粗体代码到编辑器中。保存并关闭文件。

 public ActionForward execute(
  ActionMapping mapping,
  ActionForm form,
  HttpServletRequest request,
  HttpServletResponse response)
  throws Exception {
  ActionErrors errors = new ActionErrors();
  ActionForward forward = new ActionForward();
  // return value
  try {
   // do something here
   
            
            forward = mapping.findForward("success");
   return (forward);
  } catch (Except
ion e) {
   // Report the error using the appropriate name and ID.
   errors.add("name", new ActionError("id"));
  }

在 /Java source 文件夹下创建另一个名为 SolutionsAction 的 Action 类：

在 Web Perspective 中, 右键单击 Web项目下面的 /Java Source文件夹。
选择 New => Other => Web。展开 Web => Struts => Action Class。单击 Next。
输入 struts.tiles.sample 作为 Java Package名称。
输入 SolutionsAction 作为类名。单击 Next。
在 Forwards 节中，单击 Add添加 Name 为 success 和 Path 为 solutions 的一个 forwards。
单击 Finish。忽略警告 newsDef 不是一个有效路径。

添加以下粗体代码到编辑器中。保存并关闭文件。

 public ActionForward execute(
  ActionMapping mapping,
  ActionForm form,
  HttpServletRequest request,
  HttpServletResponse response)
  throws Exception {
  ActionErrors errors = new ActionErrors();
  ActionForward forward = new ActionForward();
  // return value
  try {
   // do something here
   
            
            forward = mapping.findForward("success");
   return (forward);
  } catch (Exception e) {
   // Report the error using the appropriate name and ID.
   errors.add("name", new ActionError("id"));
  }

允许 Struts Tiles plug-in：

在 Web perspective 中，展开 /Web Content/WEB-INF然后双击 struts-config.xml打开 Struts 配置编辑器。

切换到 XML Source页并添加以下代码段在 </struts-config> 结束标签前。

<plug-in className="org.apache.struts.tiles.TilesPlugin" >
    <set-property property="definitions-config"
                  value="/WEB-INF/forwardDefinition.xml"/>
    <set-property property="moduleAware" value="true" />
    <set-property property="definitions-parser-validate" value="true" />
</plug-in>

保存并关闭文件。
双击 web.xml在 Web Deployment Descriptor 中打开它。
在 Servlet 页中，选择 action。
在 Initialization 节中，单击 Add。
输入 definitions-config作为 Name 和 /WEB-INF/forwardDefinition.xml作为 Value。
保存并关闭文件。

图 9. Web Deployment Descriptor web.xml

创建一个 WebSphere Test Environment 服务器：

在 Workbench 中，选择 File => New => Other => Server => Server and Server Configuration。单击 Next。
输入 server1 作为名称。
选择 WebSphere Version 5.0 => Test Environment。
单击 Finish。

添加 EAR 到服务器并启动服务器：

在 Server PerspectiveServer Configuration 视图中，一直展开直到看到 server1 。右键单击 server1并选择 Add => StrutsTilesTutorialEAR。
在 Server 视图中，右键单击 server1并选择 Start。

将浏览器指向 http://localhost:9080/StrutsTilesTutorialWeb/solutions.do 将会看到如下页面：

尝试 http://localhost:9080/StrutsTilesTutorialWeb/news.do?name=Jane :

图 11. 运行 news.do

如果您想切换到主体并进行导航，只要在 Layout.jsp 作简单修改如下：

   <h1><tiles:insert attribute="title"/></h1>
   <TABLE border="1" width="400" cellpadding="5" ID="Table31">
      <TBODY>
  <TR>
    <TD colspan="2" align="center"><tiles:insert attribute="header"/></TD>
  </TR>
  <TR>
    <TD valign="top" width="80%"  bgcolor="ffff00" align="center">
    <tiles:insert attribute="body"/></TD>  
      <TD valign="top" width="20%"  bgcolor="00ff00" align="center">
    <tiles:insert attribute="navigation"/></TD>
  <TR>
    <TD colspan="2" align="center"><tiles:insert attribute="footer"/></TD>
  </TR>
      </TBODY>
   </TABLE>

再次运行 solutions.do 和 news.do 。两个页面现在都使用新的布局：

图 12. 运行 news.do

回页首

结束语

Tiles 框架增强了 Web UI 开发中基于组件的设计，同时它和 Struts 框架组合起来的效果非常好。您可以很容易地将 Tiles 和 Struts 与 WebSphere Studio Application Developer 一起使用，以显著降低您的 Web 开发项目的开发时间和维护成本。