fv

時間 2019-12-18

原文原文鏈接

Apache Tiles 是什麼？html

A free open-sourced templating framework for modern Java applications.java

Based upon the Composite pattern it is built to simplify the development of user interfaces.web

For complex web sites it remains the easiest and most elegant way to work alongside any MVC technology.spring

一個免費開源的模板框架，爲現代的Java應用程序。 apache

基於複合模式，它是創建在簡化用戶界面的開發。瀏覽器

對於複雜的網站，但它仍然一塊兒工做，任何的MVC技術的最簡單，最優雅的方式。安全

複合式視圖模式（The Composite View Pattern）app

全部的網站都有一個共同點：它們是由具備相似結構的網頁。頁面共享相同的佈局，而每一個頁面是由不一樣的獨立的配件，可是始終擺在全部網站相同的位置。框架

複合視圖模式正式化了這個典型的使用，它容許建立具備相似結構的頁面，其中頁面的每一個部分在不一樣狀況而有所不一樣的頁面。webapp

複合式視圖模式怎麼工做？

爲了理解這個模式，讓我舉個例子。從下圖你能夠看到一個典型的web網頁結構。

這個結構稱爲「典型佈局（classic layout）」。這個模板按照這個佈局組織頁面，在須要的位置放上每一塊，因此header部分在上，footer部分在下，等等。

將會發生以下狀況，例如單擊一個超連接跳轉到另外一個頁面，另外一個頁面只須要改變其中的一部分，一般是body部分。

你能看到，這個頁面雖然是不一樣的，可是他們的不一樣之處僅僅只有body部分。注意，雖然頁面是不一樣的，但並不像在frameset中刷新frame。

使用了複合式視圖模式，頁面的其餘部分是能夠複用的，同時一致的佈局也保存了。

視圖助手的做用

複合視圖的每一部分都能有一個視圖助手。這個模式會按照頁面的佈局將各個部分準備的數據顯示出來，如:建立一個菜單。

複合視圖VS裝飾器（decorator）

Tiles 是一個複合視圖框架：它容許在整個應用中複用頁面。經過裝飾器模式也能夠實現複用頁面。例如：Sitemesh 就是一個基於裝飾器模式的。

經過建立一個模板（template）來組織各個頁面到同一個頁面，裝飾器模式須要一個簡單的HTML頁面，在轉換時添加缺失的部分（在咱們的以上例子中，添加header，footer和menu）最終呈現它。

下面是兩種模式的對比表

對照表

方面	複合視圖	裝飾器
可重用性	頁面不一樣的部分（template和頁面塊）能在整個應用中使用	全部的裝飾器都能複用，可是裝飾本身的裝飾器同一時間只能應用在一個頁面
配置複雜度	每個頁面必須準確的定義	裝飾器能應用到整個應用
運行時配置	頁面能夠在運行時配置組織	因爲一個頁面是在一個時間裝飾的，他的特色是不呈現的。
表現	低開銷組合	頁面須要解析才能裝飾

在Java Web項目中使用Apache Tiles

Tiles一直是一個web應用程序包，一般結合strut一塊兒使用。Apache Tiles™已經進化爲一個獨立的技術，可是它一般使用在以Servlet爲基礎的web應用程序中。

所需包

第一件事是安裝須要的包。本教程咱們將盡量的安裝全部所需的包。只知道一個很輕巧可是有限的配置是可用的。

若是你在使用maven，只須要加入如下的依賴，maven將回家所須要的其餘的依賴包的包含進來。

1 2	<groupId>org.apache.tiles</groupId> <artifactId>tiles-extras</artifactId>

若是你沒有使用maven，只需下載tiles並拷貝全部的jar包到/WEB-INF/lib目錄下就好了。

推薦使用maven建立項目。

啓動Tiles引擎

經過在web.xml文件中配置適當的listener來加載tiles 容器，既然咱們決定加載一切，咱們將使用 CompleteAutoTilesListener:

<listener-class>org.apache.tiles.extras.complete.CompleteAutoloadTilesListener</listener-class>

</listener>

在本教程中，咱們將直接使用servlet API中使用Tiles，沒有controller。在實際開發中，你可能會用一個MVC框架，像：Struts，Shale或Spring（Spring MVC）。你不得不配置你的框架來使用Tiles；請參看你是用的框架的文檔來配置。如今，如今咱們只是在web.xml聲明TilesDispatchServlet。

這就意味着任何一個以".tiles"結尾的請求將直接會發送到配置的Tiles Difinition處理。

Apache Tiles的基本使用

1、概述

對於一個新的技術，瞭解其基本的概念和和原理是學好該技術的基礎。

2、Tiles的概念

Tiles 是複合視圖模式（Composite View pattern）的一個實現。Tiles將該模式添加到本身的概念中是該模式具體化。Tiles的實現是以複合式模式爲理論，概念包括：Template，Attribute和Definition。視圖助手模式的實現是View Preparer 概念。

接下來說解相關的概念：Template，Attribute,Definition和View Preparer。

2.1、模板：Template

在Tiles中，模板（Template）是一個頁面的佈局部分。你能將一個頁面結構當作是由不一樣的須要填補空白組成。

例如，考慮這個「典型佈局」頁面結構。

你可以將該結構複製到一個新建的JSP頁面中，以下所示

template.jsp

<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %>

<table>

<tr>

<tiles:insertAttribute name="header" />

</td>

</tr>

<tr>

<td>

<tiles:insertAttribute name="menu" />

</td>

<td>

<tiles:insertAttribute name="body" />

</td>

</tr>

<tr>

<tiles:insertAttribute name="footer" />

</td>

</tr>

</table>

注意：一個模板（Template）能夠沒有屬性（attributes）,這種狀況下該模板能夠直接使用。有屬性的話就要先定義屬性才能使用，否則的話就會在解析jsp頁面的時候報錯。

2.2、屬性：Attribute

屬性是模板中的空白，它在你的應用程序中被填充到模板中。屬性能夠是如下三種類型：

string:屬性是string的話，會將string直接呈如今頁面。
template:屬性是一個模板（Template），有無屬性都行。若是有屬性的話，你也要將他們填充後再呈現頁面。
definition:它是一個可重複使用組成的頁面，包含全部的屬性來填充以呈現頁面。

2.3、定義：definition

定義是呈現給最終用戶的組合物；本質上，一個定義是由一個模板和徹底或部分填充的屬性組成的。說白了就是：一個定義是由一個模板和屬性組成的。

若是全部的「屬性」都填充了，它將能夠呈現給最終用戶。
若是不是全部的屬性都填充了，這個定義稱爲「抽象定義」（abastract definition）,它能夠被用做「父定義」，讓其餘「定義」繼承，失去的「屬性」能在運行時填充。

例如，你能夠按以前看過的「典型模板」建立建立一個頁面，修改Tiles的配置文件，以下：

<definition name="myapp.homepage" template="/layouts/classic.jsp">

<put-attribute name="header" value="/tiles/banner.jsp" />

<put-attribute name="menu" value="/tiles/common_menu.jsp" />

<put-attribute name="body" value="/tiles/home_body.jsp" />

<put-attribute name="footer" value="/tiles/credits.jsp" />

</definition>

2.4、視圖助手：View Preparer

有時候一個定義在呈現以前須要「預處理」。例如，顯示一個menu時，menu的結構必須被建立而且已經保存在request範圍內。

爲了達到「預處理」，視圖助手將會被用到，視圖助手將在呈現定義以前被調用，所以在將「定義」呈現所需的東西都會被正確的「預處理」。

3、建立和使用Tiles 頁面

安裝tiles和學習了Tiles的一些概念後，是時候建立一些頁面了。如下你將學習到建立可重用的頁面和完整頁面的步驟。

3.1、建立一個模板

咱們使用「典型佈局」頁面結構：

建立一個JSP頁面做爲這個佈局並將其保存在/layouts/classic.jsp文件中

<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %>

<html>

<head>

</head>

<body>

<table>

<tr>

<tiles:insertAttribute name="header" />

</td>

</tr>

<tr>

<td>

<tiles:insertAttribute name="menu" />

</td>

<td>

<tiles:insertAttribute name="body" />

</td>

</tr>

<tr>

<tiles:insertAttribute name="footer" />

</td>

</tr>

</table>

</body>

</html>

在這個模板中有5個屬性：title（string類型的屬性），header，menu,body和footer。

3.2、建立組成頁面

在這個階段，你須要建立4個用於替換以前建立模板中的 header,menu,body和footer屬性的JSP頁面。

你能夠放置任何你想放的東西在這個頁面中，他們僅僅是一個測試。

3.3、建立一個定義

默認狀況，「定義」文件是/WEB-INF/tiles.xml。若是你使用的是CompleteAutoloadTilesListener,tiles將會使用webapp目錄下按/WEB-INF/tiles*.xml匹配或classpath下按/META-INF/tiles*.xml匹配的任何文件做爲「定義」文件；若是發現多個，tiles將會合並這些文件到一塊兒。

但如今，咱們使用默認狀況並建立/WEN-INF/tiles.xml文件，該文件下包含一個「定義」。

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE tiles-definitions PUBLIC

"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"

"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">

<tiles-definitions>

<definition name="myapp.homepage" template="/layouts/classic.jsp">

<put-attribute name="title" value="Tiles tutorial homepage" />

<put-attribute name="header" value="/tiles/banner.jsp" />

<put-attribute name="menu" value="/tiles/common_menu.jsp" />

<put-attribute name="body" value="/tiles/home_body.jsp" />

<put-attribute name="footer" value="/tiles/credits.jsp" />

</definition>

</tiles-definitions>

3.4、渲染定義

建立完定之後，你就能渲染它了。

經過使用<tiles:insertDefinition />標籤，將定義插入一個JSP頁面。

1 2	`<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %>` `<tiles:insertDefinition` `name="myapp.homepage"` `/>`

其餘狀況，你能夠直接使用response來渲染定義，經過使用Tiles 容器

TilesContainer container = TilesAccess.getContainer(

request.getSession().getServletContext());

container.render("myapp.homepage", request, response);

經過使用Tiles提供的Rendering Utilities。例如，若是你已經配置了TilesDispatchServlet，你能經過請求：http://example.com/webapp/myapp.homepage.tiles來渲染「定義」。

經過使用支持的框架（struts,spring等）來渲染「定義」。

Tiles實戰

1、建立maven項目

New-->Maven Project-->

勾選上Create a simple project(skip archetype selection), Next

輸入Group Id和Artifact Id ,Packaging 選 war, Finish ,就建立好了Maven Project。

在pom.xml文件中加入Tiles的相關依賴：

<dependency>

<groupId>org.apache.tiles</groupId>

<artifactId>tiles-extras</artifactId>

<version>3.0.4</version>

</dependency>

到此項目建立完成，而且在項目中引入了tiles的相關jar包。

2、配置環境

2.1、在web.xml文件中加入tiles配置

<listener>

<listener-class>org.apache.tiles.extras.complete.CompleteAutoloadTilesListener

</listener-class>

</listener>

2.2、加入difinition定義文件tiles.xml

在/WEB-INF/目錄下建立一個tiles.xml文件，添加以下配置：

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE tiles-definitions PUBLIC

"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"

"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">

<tiles-definitions>

</tiles-definitions>

3、建立一個模板(template)

3.1、建立相關目錄

/WEB-INF/view:放置JSP頁面視圖
/WEB-INF/view/tempalte：模板文件夾放置tiles的模板文件（這個沒有硬性規定的，能夠隨便本身放的，到時候配置的時候配置好就好了。）
/WEB-INF/view/difirent：放置模板中不能重用的部分
/WEB-INF/view/tempalte/template1：這裏是一模板文件夾，其中放置了模板jsp頁面和一些能夠重用的界面。

提示：

你徹底不必按照以上的方式放置JSP頁面，以上只是爲了很好的管理和考慮安全性。你徹底能夠在建立以下目錄：/webapp（或WebContext或WebRoot）/jsp,將頁面放置在jsp目錄下,徹底不會有任何影響，由於，tiles會在定義difinitions時手動配置相關文件的路經的，若是這裏還不能理解的話，請繼續往下看，你將會理解的！

3.2、建立模板

如今就來建立一個模板來試試，在/WEB-INF/view/tempalte/template1下建立template.jsp文件，添加以下內容：

1	`template.jsp`

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

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

</head>

<body>

<table>

<tr>

<td colspan="2"><tiles:insertAttribute name="header" /></td>

</tr>

<tr>

<td><tiles:insertAttribute name="menu" /></td>

<td><tiles:insertAttribute name="body" /></td>

</tr>

<tr>

<td colspan="2"><tiles:insertAttribute name="footer" /></td>

</tr>

</table>

</body>

</html>

以上模板就是以下「經典佈局」用tiles定義的模板

而且，從以上文件中你看到了：

<tiles:getAsString name="title" />

<tiles:insertAttribute name="header" />

<tiles:insertAttribute name="menu" />

<tiles:insertAttribute name="body" />

<tiles:insertAttribute name="footer" />

以上就是tiles 在模板中插入了屬性，用來留出空白的，而後再渲染的時候將屬性的值配置的頁面一塊兒將整個頁面呈現出來。從而，達到了複合視圖模式。

4、建立屬性(attribute)

4.1、Tiles的屬性

能夠當作是模板中各空白區域的名字和真實顯示的頁面文件的路徑的「鍵值對」的形式。

4.2、建立屬性對應的頁面

在/WEB-INF/view/tempalte/template1目錄下建立以下jsp頁面：

header.jsp
menu.jsp
footer.jsp

在/WEB-INF/view/diffrent目錄下建立

body1.jsp
body2.jsp

5、添加定義(difinition)

如今，添加tiles的定義，在/WEB-INF/tiles.xml文件中添加以下內容：

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE tiles-definitions PUBLIC

"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"

"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">

<tiles-definitions>

<definition name="test"

template="/WEB-INF/view/ tempalte /template1/template.jsp">

<put-attribute name="title" value="Tiles tutorial homepage" />

<put-attribute name="header"

value="/WEB-INF/view/ tempalte /template1/header.jsp" />

<put-attribute name="menu"

value="/WEB-INF/view/ tempalte /template1/menu.jsp" />

<put-attribute name="body" value="/WEB-INF/view/diffrent/body1.jsp" />

<put-attribute name="footer"

value="/WEB-INF/view/ tempalte /template1/footer.jsp" />

</definition>

</tiles-definitions>

6、建立測試頁面

在/WEB-INF/目錄下建立一個example.jsp文件，添加以下內容：

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>

<tiles:insertDefinition name="test" />

7、測試

在瀏覽器中輸入：http://localhost:8080/tiles-first/example.jsp

顯示以下：

至此，tiles的一個小小的demo就完成了。

8、項目分析

當咱們想更換body時，咱們只要在tiles.xml文件中配置一下相關的文件路徑就能夠了。上面只是簡單的使用Servlet API 來處理請求，接下來將結合SpringMVC來處理請求，並將Tiles做爲視圖來使用。

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

fv

複合式視圖模式怎麼工做？

視圖助手的做用

複合視圖VS裝飾器（decorator）

在Java Web項目中使用Apache Tiles

Apache Tiles的基本使用

1、概述

2、Tiles的概念

2.1、模板：Template

2.2、屬性：Attribute

2.3、定義：definition

3、建立和使用Tiles 頁面

3.1、建立一個模板

3.2、建立組成頁面

3.3、建立一個定義

3.4、渲染定義

Tiles實戰

1、建立maven項目

2、配置環境

2.1、在web.xml文件中加入tiles配置

3、建立一個模板(template)

3.1、 建立相關目錄

3.2、建立模板

4、建立屬性(attribute)

4.1、Tiles的屬性

4.2、建立屬性對應的頁面

5、添加定義(difinition)

7、測試

8、項目分析

3.1、建立相關目錄