碼上歡樂
相關內容    簡體    繁體

SiteMesh3使用實例和詳解

本文轉載自   查看原文   2018-06-08 17:21   1004    java 框架

一、SiteMesh介紹

        SiteMesh是一個網頁布局和修飾的框架，利用它可以將網頁的內容和頁面結構分離，以達到頁面結構共享的目的。[來自百度百科]

       通俗的理解就是，SiteMesh把頁面中變化的和不變的分離開來，用不變的去裝飾各種變化的內容。從而使頁面具有統一的布局，而且方便頁面的管理。不變的頁面稱之為裝飾頁面，內容變化的頁面稱之為被裝飾頁面。
      裝飾頁面一般包括：頁面標題、頭部、底部、主體以及公共的css、js。
      被裝飾頁面只需要寫它自己需要的內容就可以了。

      根據頁面需要，裝飾頁面可以有多個，被裝飾頁面也可以有不被裝飾而保持自己風格的選擇，這只需要在配置文件中配置一下就可以了。
      siteMesh3.0運行環境：servlet、  jdk

二、SiteMesh使用

        SiteMesh的使用也非常簡單。這里使用的是sitemesh3.0。整個項目結構如圖：

          

      1. 下載sitemesh3.0 ，將disk文件夾下的sitemesh-3.0-alpha-2.jar放到lib目錄下。

      2. 建立裝飾頁面，裝飾頁可以是靜態文件，也可以是動態文件，這里用jsp來測試

 (1)帶有菜單欄的裝飾頁面：decorator.jsp

[html]  view plain  copy
 
 
 
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head>  
  3. <sitemesh:write property='head'/>  
  4. <style type='text/css'>  
  5. .mainBody {    
  6.     padding: 10px;    
  7.     border: 1px solid #555555;    
  8. }   
  9. .conbgbtm {  
  10.     width:100%;  
  11.     min-height:400px;  
  12.     height:auto;  
  13.     overflow:hidden;  
  14.     zoom:1;  
  15. }  
  16. </style>  
  17. </head>  
  18. <body>  
  19.     <!--頭部  -->  
  20.     <div align="center">  
  21.         <h1 >頭部信息：   
  22.             <sitemesh:write property='title' />   
  23.         </h1>    
  24.     </div>  
  25.     <hr>     
  26.      
  27.     <!--左側菜單欄  -->  
  28.     <div class="conbgbtm">  
  29.         <div class="leftbox">  
  30.             <ul>  
  31.                 <li><a href="#">菜單1</a></li>  
  32.                 <li><a href="#">菜單2</a></li>  
  33.                 <li><a href="#">菜單3</a></li>  
  34.             </ul>  
  35.         </div>  
  36.         <sitemesh:write property='body'></sitemesh:write>  
  37.     </div>  
  38.     <hr>  
  39.               
  40.     <div align="center">  
  41.         <span>Copyright © 2012-2013 廊坊信息技術提高班 版權所有</span>  
  42.     </div>  
  43.       
  44. </body>  
  45. </html>  

 (2)不帶菜單欄的裝飾頁面：registerDecorator.jsp

 

[html]  view plain  copy
 
 
 
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head>  
  3. <sitemesh:write property='head'/>  
  4. <style type='text/css'>  
  5. .mainBody {    
  6.     padding: 10px;    
  7.     border: 1px solid #555555;    
  8. }   
  9. .conbgbtm {  
  10.     width:100%;  
  11.     min-height:400px;  
  12.     height:auto;  
  13.     overflow:hidden;  
  14.     zoom:1;  
  15. }  
  16. </style>  
  17. </head>  
  18. <body>  
  19.     <!--頭部  -->  
  20.     <div align="center">  
  21.         <h1 >頭部信息：   
  22.             <sitemesh:write property='title' />   
  23.         </h1>    
  24.     </div>  
  25.     <hr>     
  26.      
  27.     <!--主體內容  -->  
  28.     <div class="conbgbtm">  
  29.         <sitemesh:write property='body'></sitemesh:write>  
  30.     </div>  
  31.     <hr>  
  32.       
  33.     <!--底部  -->         
  34.     <div align="center">  
  35.         <span>Copyright © 2012-2013 廊坊信息技術提高班 版權所有</span>  
  36.     </div>  
  37.       
  38. </body>  
  39. </html>  

 

      3. 建立被裝飾頁

(1)index首頁

[html]  view plain  copy
 
 
 
  1. <html>  
  2. <head>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=GB18030">  
  4. <title>SiteMesh3   title</title>  
  5. </head>  
  6. <body>  
  7.     <span>sitemesh3 body</span>  
  8. </body>  
  9. </html>  

 (2)logon.jsp、register.jsp頁面

[html]  view plain  copy
 
 
 
  1. <html>  
  2. <head>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=GB18030">  
  4. <title></title>  
  5. </head>  
  6. <body>  
  7.     <div align="center">  
  8.         <p>用戶名：<input type="text" id="userName" ></p>  
  9.         <p>密碼：    <input type="text" id="pwd"></p>  
  10.         <p>驗證碼：<input type="text" id="validate"></p>  
  11.     </div>  
  12. </body>  
  13. </html>  


 

      4. web-inf/lib下建立Sitemesh3.xml配置文件

[html]  view plain  copy
 
 
 
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <sitemesh>  
  3.     <!--register頁面的裝飾頁面為沒有菜單欄 的registerDecorator.jsp -->  
  4.    <mapping>  
  5.           <path>/register.jsp</path>  
  6.         <decorator>/decorator/registerDecorator.jsp</decorator>  
  7.    </mapping>  
  8.    
  9.    <!--帶有菜單欄的裝飾頁面  -->  
  10.    <mapping decorator="/decorator/decorator.jsp"/>  
  11.    
  12.    <!--登錄頁面不被裝飾。沒有配置為true的頁面，表示使用裝飾頁面,例如index.jsp -->  
  13.    <mapping path="/logon.jsp" exclue="true"/>  
  14. </sitemesh>  

 

 

      5. Web.xml里加載sitemesh模板系統

[html]  view plain  copy
 
 
 
  1. <!-- 加載sitemesh模板系統 -->  
  2. <filter>  
  3.     <filter-name>sitemesh</filter-name>  
  4.     <filter-class>org.sitemesh.config.ConfigurableSiteMeshFilter</filter-class>  
  5. </filter>  
  6.   
  7. <filter-mapping>  
  8.     <filter-name>sitemesh</filter-name>  
  9.     <url-pattern>/*</url-pattern>  
  10. </filter-mapping>  
 
     其中1-5功能塊就可以直接運行，6以后的當做補充
 

 6. sitemesh3.xml 配置詳解

復制代碼 
 1 <sitemesh>
 2     <!--默認情況下，
 3         sitemesh 只對 HTTP 響應頭中 Content-Type 為 text/html 的類型進行攔截和裝飾，
 4         我們可以添加更多的 mime 類型-->
 5   <mime-type>text/html</mime-type>
 6   <mime-type>application/vnd.wap.xhtml+xml</mime-type>
 7   <mime-type>application/xhtml+xml</mime-type>
 8   ...
 9   
10   <!-- 默認裝飾器，當下面的路徑都不匹配時，啟用該裝飾器進行裝飾 -->
11   <mapping decorator="/default-decorator.html"/>
12   
13   <!-- 對不同的路徑，啟用不同的裝飾器 -->
14   <mapping path="/admin/*" decorator="/another-decorator.html"/>
15   <mapping path="/*.special.jsp" decorator="/special-decorator.html"/>
16 
17   <!-- 對同一路徑，啟用多個裝飾器 -->
18   <mapping>
19     <path>/articles/*</path>
20     <decorator>/decorators/article.html</decorator>
21     <decorator>/decorators/two-page-layout.html</decorator>
22     <decorator>/decorators/common.html</decorator>
23   </mapping>
24 
25   <!-- 排除，不進行裝飾的路徑 -->
26   <mapping path="/javadoc/*" exclue="true"/>
27   <mapping path="/brochures/*" exclue="true"/>
28   
29   <!-- 自定義 tag 規則 -->
30   <content-processor>
31     <tag-rule-bundle class="com.something.CssCompressingBundle" />
32     <tag-rule-bundle class="com.something.LinkRewritingBundle"/>
33   </content-processor>
34   ...
35 
36 </sitemesh>
復制代碼

7 . 自定義 tag 規則

Sitemesh 3 默認只提供了 body，title，head 等 tag 類型，我們可以通過實現 TagRuleBundle 擴展自定義的 tag 規則：

復制代碼 
 1 public class MyTagRuleBundle implements TagRuleBundle {
 2     @Override
 3     public void install(State defaultState, ContentProperty contentProperty,
 4             SiteMeshContext siteMeshContext) {
 5         defaultState.addRule("myHeader", new ExportTagToContentRule(contentProperty.getChild("myHeader"), false));
 6         
 7     }
 8     
 9     @Override
10     public void cleanUp(State defaultState, ContentProperty contentProperty,
11             SiteMeshContext siteMeshContext) {
12     }
13 }
復制代碼

最后在 sitemesh3.xml 中配置即可：

1 <content-processor>
2     <tag-rule-bundle class="com.lt.common.ext.sitemesh3.MyTagRuleBundle" />
3 </content-processor>
 
轉載自:http://blog.csdn.net/liusong0605/article/details/9773723
      http://www.cnblogs.com/luotaoyeah/p/3776879.html


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 SiteMesh3簡介及使用 SiteMesh3 介紹和使用 解決sitemesh3裝飾頁面不能使用freemarker標簽問題 SiteMesh3原理和SpringMVC + FreeMarker + SiteMesh3問題 SiteMesh3整合SpringMVC+FreeMarker SiteMesh詳解 SiteMesh的使用 Sitemesh 3使用及配置 Sitemesh 3 的使用及配置 Sitemesh 3 配置和使用(最新)
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM