Struts2主题和模板

转自易百：http://www.yiibai.com/struts2/struts_themes_templates.html

在实际教程本章开始之前，让我们来看看所给出: http://struts.apache.org 定义：

Term	描述
tag	一小片执行的代码从JSP, FreeMarker 或 Velocity.
template	A bit of code, usually written in FreeMarker, that can be rendered by certain tags (HTML tags).
theme	A collection of templates packaged together to provide common functionality.

我建议去通过Struts2本地化章节的学习，因为我们将采取同样的例子，能够再次熟悉。
当您使用了Struts2标签如<s:submit...>，<s:textfield...>等，在您的网页，Struts 2框架生成HTML代码与预先设定的风格和布局。 Struts 2内置主题有三个：

Theme	Description
simple theme	A minimal theme with no "bells and whistles". For example, the textfield tag renders the HTML <input/> tag without a label, validation, error reporting, or any other formatting or functionality.
xhtml theme	This is the default theme used by Struts 2 and provides all the basics that the simple theme provides and adds several features like standard two-column table layout for the HTML, Labels for each of the HTML, Validation and error reporting etc.
css_xhtml theme	This theme provides all the basics that the simple theme provides and adds several features like standard two-column CSS-based layout, using <div> for the HTML Struts Tags, Labels for each of the HTML Struts Tags, placed according to the CSS stylesheet.

正如上面提到的，如果你不指定一个主题，那么在Struts 2中使用XHTML主题默认情况下。例如Struts 2中选择标签：

<s:textfield name="name" label="Name" />

生成HTML标记：

<tr>
<td class="tdLabel">
   <label for="empinfo_name" class="label">Name:</label>
</td><td>
   <input type="text" name="name" value="" id="empinfo_name"/>
</td>
</tr>

在这里，empinfo是在struts.xml文件中定义动作的名称。

选择主题:

您可以指定每一个Struts 2标签基础上的主题或指定主题Struts 2使用，可以使用下列方法之一：

• The theme attribute on the specific tag

• The theme attribute on a tag's surrounding form tag

• The page-scoped attribute named "theme"

• The request-scoped attribute named "theme"

• The session-scoped attribute named "theme"

• The application-scoped attribute named "theme"

• The struts.ui.theme property in struts.properties (defaults to xhtml)

以下是语法指定在标签级别，如果你愿意为不同的标签使用不同的主题：

<s:textfield name="name" label="Name" theme="xhtml"/>

因为它是非常实际的使用主题，每个标签的基础上，所以干脆我们可以指定规则struts.properties文件中使用下面的标签：

# Standard UI theme
struts.ui.theme=xhtml
# Directory where theme template resides
struts.ui.templateDir=template
# Sets the default template type. Either ftl, vm, or jsp
struts.ui.templateSuffix=ftl

以下是结果，我们选择了从本地化章节，在这里我们使用默认设置struts.ui.theme XHTML中的struts-default.properties文件，这是由默认在struts2的core.xy.z.jar文件中的主题。

一个主题是如何工作的?

对于一个给定的主题，每一个Struts标签都有一个关联的模板，比如s:textfield -> text.ftl和s:password -> password.ftl等，这些模板文件都压缩在struts2的core.xy.z.jar文件。这些模板文件为每个标签保持一个预先定义的HTML布局。因此，Struts 2框架使用Sturts标签和相关模板，生成最终的HTML标记代码。

Struts 2 tags + Associated template file = Final HTML markup code.

默认模板已经写在FreeMarker和他们有扩展名.ftl。您可以使用速度或JSP设计模板，并据此设置的在struts.properties使用struts.ui.templateSuffix和struts.ui.templateDir配置。

创建一个新主题:

最简单的方法来创建一个新的主题是拷贝任何现有的主题/模板文件，并做必要的修改。因此，让我们开始创建一个文件夹，名为templatein在WebContent/WEB-INF/classes目录下和一个子文件夹作为我们新的主题，例如WebContent/WEB-INF/classes/template/mytheme，在这里可以从头开始建立模板，或者从Struts2可以复制模板的分布和根据需要对其进行修改。
我们要修改现有的默认模板XHTML学习目的。所以，现在让我们的内容复制，从struts2-core-xyzjar/template/xhtml我们的主题目录和修改唯一WebContent/WEB-INF/classes/template/mytheme/control.ftl的文件。当我们打开control.ftl，它有以下几行：

<table class="${parameters.cssClass?default('wwFormTable')?html}"<#rt/>
<#if parameters.cssStyle??> style="${parameters.cssStyle?html}"<#rt/>
</#if>
>

我们改变上述文件control.ftl，有以下内容：

<table style="border:1px solid black;">

如果检查form.ftl，那么发现在这个文件control.ftl中，form.ftl是指该文件的XHTML主题。因此我们做一些修改，如下所示：

<#include "/${parameters.templateDir}/xhtml/form-validate.ftl" />
<#include "/${parameters.templateDir}/simple/form-common.ftl" />
<#if (parameters.validate?default(false))>
  οnreset="${parameters.onreset?default('clearErrorMessages(this);\
  clearErrorLabels(this);')}"
<#else>
  <#if parameters.onreset??>
  οnreset="${parameters.onreset?html}"
  </#if>
</#if>
> <#include "/${parameters.templateDir}/mytheme/control.ftl" /> 

我以为你不会有太多的FreeMarker模板语言的理解，仍然需要做什么看the.ftl文件，你可以得到一个不错的主意。然而，让我们节省了上面的修改，并返回到我们的本地化的例子，创建WebContent/WEB-INF/classes/struts.properties文件包含以下内容：

# Customized them
struts.ui.theme=mytheme
# Directory where theme template resides
struts.ui.templateDir=template
# Sets the template type to ftl.
struts.ui.templateSuffix=ftl

现在，在这种变化中，右键单击项目名称，并单击“导出”> WAR文件创建一个WAR文件。然后，这WAR部署在Tomcat的webapps目录下。最后，启动Tomcat服务器，并尝试访问URL http://localhost:8080/HelloWorldStruts2。这会给你以下画面：

你可以看到周围的边框的表单组件，这是一个结果的变化，我们做了主题修改后将其复制从XHTML主题。如果你在学习FreeMarker时投入较多精力，那么将能够很容易地创建或修改主题。至少现在，必须有一个基本的了解Sturts的主题和模板，是不是？