Struts tiles 組件應用說明

Tiles應用說明

一、        說明

 

Tiles使得struts在頁面的處理方面多了一種選擇。並且更容易實現代碼的重用。Tiles增加了layout的概念,其實就是把一個頁面劃分爲幾塊。通常的來說一個頁面大概可以劃分爲如下幾塊:

 

head頁面頭部:存放一個運用的公共信息:logo等,如果是網站可能是最上面的一塊。

 

menu頁面菜單:放置一個運用中需要使用的菜單,或者在每一個頁面都使用的連接。

 

footer頁面尾部:如版權信息等。

 

body頁面主題內容:每個頁面相對獨立的內容。

 

如果按上面的劃分那對每一個頁面我們只要寫body裏面的內容,其他的就可以共享重用。

 

如果大多數頁面的佈局基本相同我們甚至可以使用一個jsp文件根據不同的參數調用不同的body

 

二、        Tiles配置和基本配置文件介紹

 

Tiles有一個配置文件:tiles-defs.xml

 

tiles-defs.xml定義了每一個頁面的組成元素和形式。

 

下面我將說明如下所示的一個tiles-defs.xml文件

 

tiles-defs.xml

 

-----------------------------------------------------------------

 

<tiles-definitions>

 

<!--定義/layout/ mainLayout.jsp的組成名稱爲bugbase.mainLayout -->

 

<definition name="bugbase.mainLayout"        path="/layout/mainLayout.jsp">

 

<put name="title" value="質量管理系統" />

 

<put name="logo" value="/WEB-INF/pages/main/logo.jsp" />

 

<put name="mainMenu" value="/WEB-INF/pages/main/mainMenu.jsp" />

 

<put name="messages" value="/common/messages.jsp" />

 

<put name="submenu" value="/WEB-INF/pages/main/testManageSubMenu.jsp" />

 

</definition>

 

這裏的title是標題,logo是界面上最左上角的標誌,質量管理系統有兩級菜單,mainMenu是主菜單,是不變的,而subMenu是子菜單,六個模塊就有六個子菜單,是隨模塊而變化的。messages是錯誤信息。

 

<!--定義common.testManage,繼承bugbase.mainLayout -->

 

<definition extends="bugbase.mainLayout" name="common.setting">

 

<put name="submenu"        value="/WEB-INF/pages/main/settingSubMenu.jsp" />

 

<!--以上的元素將替換bugbase.mainLayout中的元素-->

 

</definition>

 

這裏的common.testManage是測試管理模塊的意思,這就是一個模塊對應一個subMenu

 

<!—定義setting.projectInfo,繼承common.setting -->

 

<definition extends="common.setting" name="setting.projectInfo">

 

<put name="leftBody" value="/WEB-INF/pages/common/body/projectinfoleftbd.jsp" />

 

<put name="rightBody" value="/WEB-INF/pages/common/body/projectinforightbd.jsp" />

 

</definition>

 

這是說一個模塊下有多個功能點,每個功能點下的左側菜單是相同的,因此leftBody就是這個左側菜單,變化的只是rightBody右側部分而已。下面還有詳解。

 

/layout/ mainLayout.jsp

 

-----------------------------------------------------------------

 

 

<html>

 

<head>

 

<title><tiles:getAsString name="title" /></title>

 

 

</head>

 

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" οnlοad="mainInit()" >

 

<table cellpadding="0" cellspacing="0" class="LogoTable" id="01" >

 

<tr valign="bottom">

 

<tiles:insert attribute="logo" />

 

<tiles:insert attribute="mainMenu" />

 

</tr>

 

<tr valign="top" >

 

<tiles:insert attribute="submenu" />

 

</tr>

 

</table>

 

<table  class="MainTable" cellpadding="1" cellspacing="1">

 

<tr class="TrMain">

 

<td width="225" >

 

<tiles:insert attribute="leftBody" />

 

</td>

 

<td width="775">

 

<table>

 

<tiles:insert attribute="messages" />

 

</table>

 

<tiles:insert attribute="rightBody" />

 

</td>

 

</tr>

 

</table>

 

</body>

 

</html>

 

web.xml裏面配置tiles對應的taglib的配置如下:

 

web.xml

 

-----------------------------------------------------------------

 

<taglib>

 

<taglib-uri>/WEB-INF/struts-tiles.tld</taglib-uri>

 

<taglib-location>/WEB-INF/tld/struts-tiles.tld</taglib-location>

 

</taglib>

 

struts-config.xml裏面配置tiles-defs.xml

 

Struts-config.xml

 

-----------------------------------------------------------------

 

<plug-in className="org.apache.struts.tiles.TilesPlugin">

 

<set-property property="definitions-config"

 

value="/WEB-INF/plugin/tiles-defs.xml" />

 

<set-property property="moduleAware" value="true" />

 

<set-property property="definitions-parser-validate"

 

value="true" />

 

</plug-in>

 

三、        使用Tiles

 

如果已經配置好tiles-defs.xml,接下來就可以在jsp文件中使用這些定義了。

 

有如下的方式使用tiles

 

<%@ include file="/common/taglibs.jsp"%>

 

<tiles:insert definition="setting.projectInfo" flush="true" />

 

插入setting.projectInfo標記的一頁

 

taglibs.jsp裏包括這麼一句話:

 

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles"%>

 

根據tiles-defs.xml裏的setting.projectInfo設置

 

<definition extends="common.setting" name="setting.projectInfo">

 

<put name="leftBody" value="/WEB-INF/pages/common/body/projectinfoleftbd.jsp" />

 

<put name="rightBody" value="/WEB-INF/pages/common/body/projectinforightbd.jsp" />

 

</definition>

 

知道leftBody/WEB-INF/pages/common/body/projectinfoleftbd.jsp頁面,而

 

rightBody/WEB-INF/pages/common/body/projectinforightbd.jsp頁面。所以我們只需要建立projectinfoleftbd.jspprojectinforightbd.jsp頁面的就OK了,

 

而左側部分就是項目設定中的菜單,因爲項目設定中又包括很多子頁,所以在整個項目設定中的左側菜單是不變的,變的只有右側主體部分,而projectinforightbd.jsp這個頁面即項目設定中的一個項目基本信息的子頁,項目設定中有多個這樣的子頁,這些頁是在tiles-defs.xml配置的,比如說

 

<definition extends="common.setting" name="common.prjproductversionadd">

 

<put name="leftBody"        value="/WEB-INF/pages/common/body/projectinfoleftbd.jsp" />

 

<put name="rightBody"        value="/WEB-INF/pages/project/body/prjproductversionaddrightbd.jsp" />

 

</definition>

 

leftBody是相同的,都爲projectinfoleftbd.jsp,變化的只有rightBody

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章