`
seven.kyo
  • 浏览: 20026 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

总结一下用Sitemesh做网页布局的经验

阅读更多

    前一段时间需要用到Sitemesh做网页的布局,于是查找资料学习了一下,查到的都是入门学习一类简单的静态页面整合,而且几乎都一样。但还好在某个角落里找到了一点有用的东西,是对于sitemesh标签的介绍,不过...我忘记地址了- -#

    先说下我的需求:一个页面分为上下两部分,一个通顶,和下面的查询列表显示,通顶和列表显示都是动态的。

补述:之前用的是frame框架,但是样式上很不协调,下半部会出现滚动条,于是选择采用sitemesh;查找到的资料都是为页面添加静态修饰,而没有一个添加动态修饰的例子。

    准备工作:

    1、先下载sitemesh。地址:http://www.opensymphony.com/sitemesh/download.action

目前最新的版本是2.4.1   

    2、将sitemesh-2.4.1.jar拷贝到WEB-INF/lib下

    3、在web.xml中配置SiteMeshFilter:

<filter>
    <filter-name>sitemesh</filter-name>
    <filter-class>com.opensymphony.sitemesh.webapp.SiteMeshFilter</filter-class>
  </filter>
  <filter-mapping>
    <filter-name>sitemesh</filter-name>
    <url-pattern>*</url-pattern>
  </filter-mapping>
 

 

    4、建立装饰器页面在/decorators文件夹下  #:这里我建立了两个装饰器页面,一个作为主装饰器,一个作为通顶的装饰器。

    panel.jsp //动态通顶的装饰器

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<!--动态通顶只需要显示它的内容就可以,所以只取它的body内容部分-->
<decorator:body />
 

    main.jsp

 

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <!-- 取被装饰页面的head及title内容-->
        <decorator:head />
        <title><decorator:title default="配置默认的title"/></title>    
    </head>
    <body>
     <!--body部分,取被panel.jsp装饰的页面,及被main.jsp装饰的页面的body内容-->
        <page:applyDecorator page="getfields.do" name="panel"/>
     <!-- page属性代表修饰的路径,这里可以是一个.do,实现动态内容的页面整合,name属性设置为装饰器的名字-->
        <decorator:body />
    </body>
</html>
 

    5、建立WEB-INF/decorators.xml描述装饰页面:

 

<?xml version="1.0" encoding="gb2312"?>

<!-- 配置装饰器所在路径 -->
<decorators defaultdir="/decorators">
<!-- 主装饰器 -->  
<decorator name="main" page="main.jsp"/>
<!-- 动态通顶装饰器 -->  
<decorator name="panel" page="panel.jsp"/>

</decorators>

    在一般情况下,如果你的所有页面都需要被装饰,那么可以写成

 

<decorators defaultdir="/decorators">
       <decorator name="main" page="main.jsp">
           <pattern>*</pattern>
       <!-- pattern配置需要被装饰的页面路径-->
       </decorator>
</decorators>

    而我只需要部分页面被修饰,如果没有配pattern,sitemesh在过滤页面的时候貌似会检查页面的某个属性:即

<!-- 作用是使该页面被main装饰器装饰-->
<meta name="decorator" content="main"/>

   如果存在,则根据content属性的值,为该页面匹配装饰器。所以只要在需要被装饰的页面的head中添加

<meta name="decorator" content="main"/>

    就可以自动被装饰了,个人认为还是这种方法比较方便灵活。

    由于被装饰的是一个.do的动态路径,没法给出例子,不过已成功用在项目中。

 

                                                                          有问题欢迎留言讨论,转载请注明----

1
1
分享到:
评论
4 楼 seven.kyo 2010-01-19  
cunsky 写道
你好,我看了你的文章,有个疑惑,我装载动态的就出错,帮我看看。
<page:applyDecorator page="test.action" name="panel" />

启动后,页面就显示:“test.action did not create a valid page to decorate. ”
困扰好久不知道怎么解决。

是Struts2吧,那个我也没试过!
3 楼 cunsky 2010-01-04  
你好,我看了你的文章,有个疑惑,我装载动态的就出错,帮我看看。
<page:applyDecorator page="test.action" name="panel" />

启动后,页面就显示:“test.action did not create a valid page to decorate. ”
困扰好久不知道怎么解决。
2 楼 seven.kyo 2009-08-25  
javne 写道
你现在所写的,不也是满大街的东西么?

- - 我写的是动态整合,您仔细看了么?
1 楼 javne 2009-08-25  
你现在所写的,不也是满大街的东西么?

相关推荐

    SiteMesh教程及SiteMesh官方文档翻译

    #### 使用SiteMesh简化网页布局 SiteMesh是一款用于Web应用程序中的页面布局和装饰的框架。它采用Decorator模式,通过过滤器(filter)拦截请求和响应,将不同的页面组件如头部(head)、主体内容(content)以及...

    sitemesh和freemarker结合自我总结

    - **Sitemesh**:由Open Symphony团队开发的Sitemesh框架主要聚焦于网页布局和装饰,通过将动态内容与静态外观分离,提高网页的可维护性和重用性。 #### 二、集成Freemarker与Sitemesh ##### 1. 配置工程环境 - **...

    sitemesh jar包机tld文件

    总结来说,"sitemesh jar包机tld文件"是SiteMesh框架在JSP页面布局中的关键组件,通过引入sitemesh-2.4.1.jar,并使用sitemesh-page.tld和sitemesh-decorator.tld定义的标签,开发者可以轻松创建和管理具有统一外观...

    siteMesh使用示例

    SiteMesh 是一个开源的 Web 应用程序框架,主要用于页面布局和装饰,它可以帮助开发者实现网站的统一界面风格,简化页面的布局工作。在本示例中,我们将深入探讨 SiteMesh 的基本用法,特别是在登录和注册页面的应用...

    sitemesh-3.0.0的库和源码

    总结来说,Sitemesh 3.0.0 是一个强大的网页布局框架,它的出现极大地方便了Web开发者在实现复杂页面结构和统一网站样式时的工作。通过深入理解和使用Sitemesh,可以提高开发效率,同时保证网站的用户体验。

    sitemesh的使用和例子

    **Sitemesh** 是一个开源的网页布局和装饰框架,主要用在Java Web应用程序中,用于提供统一的页面布局和美化。它可以帮助开发者快速创建整洁、一致的网站外观,通过分离内容、样式和布局,使得代码更加模块化,易于...

    sitemesh教程

    SiteMesh是一个强大的Web页面布局工具,它允许开发者在Web应用中使用模板化的设计来构建网页。通过使用SiteMesh,可以很容易地实现对整个网站外观的统一控制,而无需对每个单独的页面进行修改。此教程基于SiteMesh...

    sitemesh3包

    Sitemesh3 是其第三个主要版本,它提供了更现代的架构和更好的性能,旨在帮助开发者更高效地管理和美化他们的网页布局。在本篇文章中,我们将深入探讨 Sitemesh3 的核心特性、安装过程、使用方法以及 SDK 包含的组件...

    sitemesh2.5源码

    Sitemesh 是一个开源的网页布局和装饰框架,主要用于增强Web应用的外观一致性。Sitemesh2是其第二个主要版本,它提供了更加强大和灵活的功能来帮助开发者统一网站的页面布局。在这个项目中,我们可以深入研究其源码...

    sitemesh2 集成velocity 装饰页面乱码

    sitemesh是一款开源的Web页面布局和装饰框架,而velocity则是一个轻量级的Java模板引擎,用于生成动态网页内容。下面我们将深入探讨这个集成过程中的关键知识点。 首先,我们来理解sitemesh2的工作原理。sitemesh...

    网上拍卖(基于SSH架构,采用SiteMesh框架排版,Ajax)

    总结来说,这个网上拍卖系统利用了SSH架构的强大功能,通过SiteMesh优化了页面布局,使用Ajax技术提供了流畅的用户交互。对于学习和理解Java Web开发,特别是SSH框架和前端动态更新技术,这是一个很好的实践案例。

    Sitemesh学习文档

    总结起来,Sitemesh是一个强大的工具,它通过Decorator模式简化了Web应用程序的页面布局管理,提高了代码的复用性和可维护性。通过学习和应用Sitemesh,开发者可以更高效地构建和维护大型的Web项目。

    jsp中sitemesh修改tagRule技术分享.docx

    通过Sitemesh,我们可以方便地将网页内容与布局分离,从而达到更好的可维护性和复用性。 #### 二、TagRule概念及其作用 在Sitemesh中,`TagRule`是一种非常实用的功能,它主要用于处理页面中的特定标签,并执行...

    Maven版,Spring mvc, CXF WebService, WebService/Controller Interceptor, Sitemesh

    Sitemesh是一个网页布局框架,主要用于解决Web应用中的页面布局问题。它可以将通用的头部、底部和侧边栏等元素应用于每个页面,从而减少重复代码,提高开发效率。Sitemesh通过装饰器(Decorator)模式,将页面内容和...

    dom4j-1.61完整jar包

    Sitemesh是一个网页布局框架,主要用于改善Web应用的页面布局和外观一致性。它通过装饰器模式,将页面的公共部分(如页头、页脚、侧边栏)与内容区域分离,使开发者能够轻松维护和更新网站的整体风格。Sitemesh ...

    DOM4J jar包和W3CSchool.chm的文档包含XPath的教程

    `sitemesh-2.2.1.rar`虽然不直接与DOM4J或XPath相关,但它是一个网页布局框架,用于装饰(或模板化)Web应用程序的页面。Sitemesh可以与DOM4J结合使用,例如在处理XML配置或动态生成HTML时,可能需要用到DOM4J解析...

    struts2讲义.doc

    - **页面布局框架**:SiteMesh是Struts 2推荐的页面布局框架,可以实现内容和布局的分离,提高页面设计的灵活性。 #### 第二章:Web基础技术简介 - **B/S与C/S系统**:B/S(Browser/Server)架构指的是浏览器/...

    java 页面静态化

    总结一下,Java页面静态化是优化网站性能的有效手段,它通过提前生成静态HTML文件,减少了服务器和数据库的负担,提高了网页加载速度。实现这一技术可以借助各种Java模板引擎、页面布局工具、缓存框架,以及Web...

Global site tag (gtag.js) - Google Analytics