用Sitemesh控制页面布局
摘要
我们在开发Web应用特别是J2EE应用的时候,由于Web页面是由不同的人所开发,所以开发出来的界面通常是千奇百怪,通常让项目管理人员苦笑不得。随着项目的进一步的开发,要求统一的界面风格的紧迫性逐渐浮现了出来。
虽说我们可以使用Struts的Ttiles,但Tiles有着它的不足之处。本文介绍了一个基于Web页面的布局、装饰以及应用整合的框架Sitemesh。它能帮助你为你的应用创建一致的外观。
主要内容
1.Sitemesh简介
2.与Strust Tiles比较
3.基本原理
4.简单例子
5.总结
6.参考资料
1.Sitemesh简介
Sitemesh是由一个基于Web页面布局、装饰以及与现存Web应用整合的框架。它能帮助我们在由大量页面构成的项目中创建一致的页面布局和外观,如一致的导航条,一致的banner,一致的版权,等等。它不仅仅能处理动态的内容,如jsp,php,asp等产生的内容,它也能处理静态的内容,如htm的内容,使得它的内容也符合你的页面结构的要求。甚至于它能将HTML文件象include那样将该文件作为一个面板的形式嵌入到别的文件中去。所有的这些,都是GOF的Decorator模式的最生动的实现。尽管它是由java语言来实现的,但它能与其他Web应用很好地集成。
2.与Strust Tiles比较
从使用角度来看,Tiles似乎是Sitemesh标签的一个翻版。其实sitemesh最强的一个特性是sitemesh将decorator模式用在过滤器上。任何需要被装饰的页面都不知道它要被谁装饰,所以它就可以用来装璜来自php、asp、CGI等产生的页面了。你可以定义若干个装饰器,根据参数动态地选择装饰器,产生动态的外观以满足你的需求。它也有一套功能强大的属性体系,它能帮助你构建功能强大而灵活的装饰器。相比较而言,在这方面Tiles就逊色许多。
3.基本原理
一个请求到服务器后,如果该请求需要sitemesh装饰,服务器先解释被请求的资源,然后根据配置文件获得用于该请求的装饰器,最后用装饰器装饰被请求资源,将结果一同返回给客户端浏览器。
下边是由Jsp和CGI产生的两个页面,它们通过sitemesh装饰后,形成了一致的用户界面。
4.简单例子
环境说明:
Windows2k+
、
Tomcat4.0+
1.
安装:
将
sitemesh-2.1.jar
复制到
lib
目录下;修改
web.xml
文件,也就是在
web.xml
中加入粗倾体标记的部分;
<?xml version="1.0" encoding="GB2312"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<filter>
<filter-name>sitemesh</filter-name>
<filter-class>com.opensymphony.module.sitemesh.filter.PageFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>sitemesh</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</web-app>
|
2.
建立一个目录,名字叫
decorators
,当然你也可以取别的,用于放装饰器
(
也就是一个使用了
sitemesh
标签的
jsp
文件
)
用
;
3.
定义一个你的模板并把它放到
decorators
目录下,我的文体名称叫:
mymain.jsp
文件内容如下:
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>AP -
<decorator:title default="Welcome to architecture pub!" />
</title>
<decorator:head />
</head>
<body>
<table border="0" cellpadding="2" width="100%" height="151">
<tr>
<td width="20%" height="74">
<p align="center"><font color="#000080" size="5">Test sitemesh</font></td>
<td width="73%" height="74"></td>
</tr>
<tr>
<td width="20%" height="28" bgcolor="#F3F3F3" valign="top" >
<page:applyDecorator page="/menu.jsp" name="panel" />
</td>
<td width="73%" height="28" bgcolor="#BED6FA"><decorator:body />
</td>
</tr>
<tr>
<td width="100%" height="31" colspan="2" bgcolor="#F1F0ED">
<p align="center">Powered by gagaghost</td>
</tr>
</table>
</body>
</html>
|
说明:
<decorator:title default="Welcome to test sitemesh!" />
:读取被装饰页面的标题,并给出了默认标题。
<decorator:head />
:读取被装饰页面的
<head>
中的内容;
<page:applyDecorator page="/menu.jsp" name="panel" />
:把
menu.jsp
文件用
panel
指定的装饰器装饰,并把结果插入到该位置;
<decorator:body />
:读取被装饰页面的
<body>
中的内容;
当然还有很多的标签,这里不再详细描述。
4.
在
docorators.xml
文件里配置刚写好的模板
mymain.jsp
,内容如下:
<?xml version="1.0" encoding="ISO-8859-1"?>
<decorators defaultdir="/decorators">
<decorator name="main" page="mymain.jsp">
<pattern>/*</pattern>
</decorator>
<decorator name="panel" page="panel.jsp"/>
<decorator name="printable" page="printable.jsp"/>
</decorators>
|
这里我是把对所有的请求都用
mymail.jsp
来装饰。
好了,
run
一下你的“小板凳”!你会看到如下结果:
?
5.总结
使用sitemesh给我们带来的是不仅仅是页面结构问题,它的出现让我们有更多的时间去关注底层业务逻辑,而不是整个页面的风格和结构。它让我们摆脱了大量用include方式复用页面尴尬局面,它也提供了很大的灵活性以及给我们提供了整合异构Web系统页面的一种方案。我们期望它在未来的版本中会有更多的特性出现。
分享到:
相关推荐
sitemesh应用Decorator模式,用filter截取request和response,把页面组件head,content,banner结合为一个完整的视图。通常我们都是用include标签在每个jsp页面中来不断的包含各种header, stylesheet, scripts and ...
SiteMesh是一个Web页面布局修饰框架, 用于构建包含大量页面, 需要一致的外观样式(look/fell), 导航和布局机制的大型网站. SiteMesh应用Decorator模式,用filter截取request和response,把页面组件head,content,...
SiteMesh应用Decorator模式,用filter截取request和response,把页面组件head,content,banner结合为一个完整的视图。通常我们都是用include标签在每个jsp页面中来不断的包含各种header, stylesheet, scripts and ...
5. **页面集成**:在具体的JSP页面中,通过特定的标签或注解指示Sitemesh应用模板。 在实际应用中,我们可以通过提供的博客链接(已省略)来学习详细的整合步骤和示例代码。通过这个例子,你可以理解如何将这两个...
这两个组件的集成使得Struts2能够自动将Sitemesh应用于其返回的页面,实现页面的装饰。 具体整合步骤如下: 1. **引入依赖**:首先,在项目中添加Sitemesh和Struts2-Sitemesh-plugin的库。如果是Maven项目,可以在...
一个简单的SiteMesh应用通常包括以下步骤: 1. 配置SiteMesh过滤器:在web.xml中注册和配置SiteMesh Filter。 2. 创建装饰器页面:定义一个HTML模板,包含通用的页面布局。 3. 标记待装饰的页面:在JSP或HTML页面中...
标题:Sitemesh技术的应用 描述与标签:Sitemesh技术的应用 Sitemesh技术是Web开发领域中一种用于页面装饰的重要工具,尤其在Java Web应用程序中被广泛应用。其核心功能在于能够统一网站的外观风格,使不同功能...
SiteMesh是一款用于Web应用程序中的页面布局和装饰的框架。它采用Decorator模式,通过过滤器(filter)拦截请求和响应,将不同的页面组件如头部(head)、主体内容(content)以及横幅(banner)等组合成一个完整的...
SiteMesh 是一个开源的Web应用程序布局和装饰框架,主要用于解决Web应用中的页面布局问题。它通过拦截HTTP请求,将页面内容与预定义的布局模板相结合,实现统一的页面头部、底部和侧边栏等元素,从而提高网站的整体...
SiteMesh 是一个开源的Web应用程序框架,主要用于帮助开发者实现页面布局和装饰功能。它通过拦截HTTP请求,将页面内容与布局模板相结合,从而提供了一种简单有效的方式来管理和控制Web应用的外观和感觉。在Web开发中...
通过深入学习和实践这个“sitemesh框架简单例子”,你将能够熟练地运用Sitemesh来构建更加专业且美观的Web应用。 总的来说,Sitemesh是一个强大且灵活的工具,它简化了Web页面布局的管理,让开发者能够专注于业务...
页面装饰器(Sitemesh)是一种广泛用于Web应用的开源框架,它的主要功能是提供页面布局和装饰功能,使得开发者可以方便地实现统一的页面头部、尾部、侧边栏等元素,从而提高网站的整体风格一致性。在本实例中,我们...
Java Sitemesh是一个开源的页面布局和装饰框架,它的主要目标是帮助开发者统一网站的外观和感觉,提高代码复用性,并...学习和掌握Sitemesh能让你在开发Java Web应用时更加得心应手,提升项目的整体质量和用户体验。
**Sitemesh3** 是一个开源的网页布局和装饰框架,用于Java Web应用程序。它主要目的是帮助开发者统一网站的外观和感觉,通过提供一种简单的方式来装饰(或模板化)整个Web应用中的页面。Sitemesh3是Sitemesh项目的第...
SiteMesh是一款网页布局和装饰器框架,也是一个网络应用程序整合框架,它可以用来维护那些很多页面,并且希望保持所有页面的布局、链接和风格一致的大型网站应用整合与维护。使用SiteMesh可以抽象出页面中的公共布局...
**sitemesh-2.2.1.jar** 是一个用于Web应用程序界面布局的开源框架,由OpenSymphony团队开发。Sitemesh的主要功能是提供页面装饰能力,它可以帮助开发者统一网站的外观和感觉,实现页面模板和内容的分离。通过在...
【sitemesh3-demo】是一个基于Sitemesh3框架的示例项目,旨在展示如何在Web应用程序中有效地实现页面布局和装饰功能。Sitemesh是一个开源的Java Web应用框架,主要用于增强网页的外观和结构,通过定义装饰模板,可以...
Sitemesh 是一个开源的网页布局和装饰框架,它主要负责处理Web应用程序的页面布局,使得开发者可以集中精力于应用的核心功能,而不用过多关注页面样式的一致性和美观性。Sitemesh 提供了一种优雅的方式来组织和装饰...