1. Tiles是什么?能做什么?
Apache Tiles is a template based, composite view framework: it allows to reuse page pieces across the application, keeping consistent look and feel. Page layouts in general contains several page-fragments like header,footer, menu & content. In a consistent layout, only content changes between page navigation while other page fragments like header,footer & menu remains fixed most of the time.
Apache Tiles 是一种基于模板的复合视图框架:它允许在应用程序过程中重复使用页面片段,保持一致的外观和感受。一般页面布局包含多个页面片段,比如页眉、页脚、菜单和主体内容部分。在一个一致的布局中,只有主体内容部分会在页面导航之间改变, 而其他页面元素,如:页眉、页脚和菜单栏,大多数时间保持不变。
2. 为什么使用Tiles?
很多时候我们网站的风格布局是一致的,如修真院的页面,页眉页脚在绝大多数页面是不变的。而如果没有Tiles这种页面代码复用,这些页面片段的代码会在每个页面中重复这样显然是没有必要的,这时候使用Tiles框架可以将一致性的代码片段和需要改变的片段分开,提高代码复用。
3. Tiles如何使用?
此处引用http://websystique.com/springmvc/spring-4-mvc-apache-tiles-3-annotation-based-example/的例子
首先是版本:
- Spring 5.0.4.RELEASE
- Apache Tiles 3.0.5
- Maven 3
- JDK 9
- Tomcat 9
- IDEA
1.项目结构
2.pom.xml
<project xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"
xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<modelVersion>4.0.0</modelVersion>
<groupId>com.ev</groupId>
<artifactId>test_tiles</artifactId>
<packaging>war</packaging>
<version>1.0.0</version>
<name>test_tiles</name>
<properties>
<springframework.version>5.0.4.RELEASE</springframework.version>
<apachetiles.version>3.0.7</apachetiles.version>
</properties>
<dependencies>
<!-- Spring -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>${springframework.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${springframework.version}</version>
</dependency>
<!-- Apache Tiles -->
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-core</artifactId>
<version>${apachetiles.version}</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-api</artifactId>
<version>${apachetiles.version}</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-servlet</artifactId>
<version>${apachetiles.version}</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-jsp</artifactId>
<version>${apachetiles.version}</version>
</dependency>
<!-- Servlet+JSP+JSTL -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.1.0</version>
</dependency>
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>javax.servlet.jsp-api</artifactId>
<version>2.3.1</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
</dependencies>
<build>
<pluginManagement>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.2</version>
<configuration>
<source>1.7</source>
<target>1.7</target>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>2.4</version>
<configuration>
<warSourceDirectory>src/main/webapp</warSourceDirectory>
<warName>Spring4MVCApacheTiles3Example</warName>
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
</plugins>
</pluginManagement>
<finalName>test_tiles</finalName>
</build>
</project>
3.配置Tiles
package com.ev.springmvc.configuration;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.ComponentScan;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.ViewResolverRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;
import org.springframework.web.servlet.view.tiles3.TilesConfigurer;
import org.springframework.web.servlet.view.tiles3.TilesViewResolver;
@Configuration
@EnableWebMvc
@ComponentScan(basePackages = "com.ev.springmvc")
public class AppConfig extends WebMvcConfigurerAdapter {
/**
* Configure TilesConfigurer.
*/
@Bean
public TilesConfigurer tilesConfigurer(){
TilesConfigurer tilesConfigurer = new TilesConfigurer();
tilesConfigurer.setDefinitions("/WEB-INF/views/**/tiles.xml");
tilesConfigurer.setCheckRefresh(true);
return tilesConfigurer;
}
/**
* Configure ViewResolvers to deliver preferred views.
*/
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
TilesViewResolver viewResolver = new TilesViewResolver();
registry.viewResolver(viewResolver);
}
/**
* Configure ResourceHandlers to serve static resources like CSS/ Javascript etc...
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations("/static/");
}
}
Highlights of above configurations are TilesConfigurer & TilesViewResolver. TilesConfigurer simply configures a TilesContainer using a set of files containing definitions, to be accessed by TilesView instances. Definition files are basically XML files containing layout definitions.
In our Spring MVC application, we also need a ViewResolver. Spring comes with a Tiles specific ViewResolver named TilesViewResolver. Once configured, the view names returned from your controller methods will be treated as tiles view and Spring will look for a definition having the same name in definitions XML files.
以上配置的亮点是TilesConfigurer和TilesViewResolver。 TilesConfigurer只需使用一组包含定义的文件来配置TilesContainer,即可由TilesView实例访问。 定义文件基本上是包含布局定义的XML文件。 在我们的Spring MVC应用程序中,我们还需要一个ViewResolver。 Spring带有一个名为TilesViewResolver的Tiles特定ViewResolver。 配置完成后,从控制器方法返回的视图名称将被视为tile视图,并且Spring将在定义XML文件中查找具有相同名称的定义。
4. 创建Tiles定义(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>
<!-- Base Definition -->
<definition name="base-definition"
template="/WEB-INF/views/tiles/layouts/defaultLayout.jsp">
<put-attribute name="title" value="" />
<put-attribute name="header" value="/WEB-INF/views/tiles/template/defaultHeader.jsp" />
<put-attribute name="menu" value="/WEB-INF/views/tiles/template/defaultMenu.jsp" />
<put-attribute name="body" value="" />
<put-attribute name="footer" value="/WEB-INF/views/tiles/template/defaultFooter.jsp" />
</definition>
<!-- Home Page -->
<definition name="home" extends="base-definition">
<put-attribute name="title" value="Welcome" />
<put-attribute name="body" value="/WEB-INF/views/pages/home.jsp" />
</definition>
<!-- Product Page -->
<definition name="products" extends="base-definition">
<put-attribute name="title" value="Products" />
<put-attribute name="body" value="/WEB-INF/views/pages/products.jsp" />
</definition>
<!-- Contact-us Page -->
<definition name="contactus" extends="base-definition">
<put-attribute name="title" value="Contact Us" />
<put-attribute name="body" value="/WEB-INF/views/pages/contactus.jsp" />
</definition>
</tiles-definitions>
In above definition file, we have defined a base-definition and several other definitions extending base-definition. Other defintions are just overwriting the part they are specialized for. template attribute in definition-block is used to specify the actual layout file. Each of the definition (by name) can be treated as a tiles-view.
在上面的定义文件中,我们定义了一个基本定义和其他几个扩展基本定义的定义。 其他定义只是覆盖它们专用的部分。 定义块中的模板属性用于指定实际的布局文件。 每个定义(按名称)都可以视为Tiles视图。
5. 设计布局(layouts)
In our case we have defined a basic layout [/WEB-INF/views/tiles/layouts/defaultLayout.jsp] pinned with definition using template attribte.
在我们的例子中,我们定义了一个使用模板属性定义的基本布局[/WEB-INF/views/tiles/layouts/defaultLayout.jsp]。
defaultLayout.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ page isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title><tiles:getAsString name="title" /></title>
<link href="<c:url value='/static/css/bootstrap.css' />" rel="stylesheet"></link>
<link href="<c:url value='/static/css/app.css' />" rel="stylesheet"></link>
</head>
<body>
<header id="header">
<tiles:insertAttribute name="header" />
</header>
<section id="sidemenu">
<tiles:insertAttribute name="menu" />
</section>
<section id="site-content">
<tiles:insertAttribute name="body" />
</section>
<footer id="footer">
<tiles:insertAttribute name="footer" />
</footer>
</body>
</html>
This layout file provides the consistent look-n-feel across your application. If you want to change layout, define a corresponding layout file and attach to the definition using template attribute.
As you can see, we have a header,footer,menu & body. We are using tags-tiles tag library to provide the placeholder within layout file. Attributes specified using insertAttribute will be provided by corresponding definition(or the one extending it).
此布局文件在应用程序中提供一致的外观。 如果要更改布局,请定义相应的布局文件并使用模板属性附加到定义。 正如你所看到的,我们有一个页眉,页脚,菜单和正文。 我们使用tags-tiles标签库来提供布局文件中的占位符。 使用insertAttribute指定的属性将由相应的定义(或扩展它的定义)提供。
6.创建视图
We have created some default views[used when the extending definition does not overwrite them] and some specific ones.
我们创建了一些默认视图[在扩展定义不覆盖它们时使用]和一些特定的视图。
defaultHeader.jsp
<div>
<h1>Tiles Demo</h1>
</div>
defaultFooter.jsp
<div>
Made in this world.
</div>
defaultMenu.jsp
<nav>
<a href="${pageContext.request.contextPath}/"><img class="logo" src="${pageContext.request.contextPath}/static/img/Linux-icon.png"></a>
<ul id="menu">
<li><a href="${pageContext.request.contextPath}/">Home</a></li>
<li><a href="${pageContext.request.contextPath}/products">Products</a></li>
<li><a href="${pageContext.request.contextPath}/contactus">Contact Us</a></li>
</ul>
</nav>
home.jsp
<h2>Welcome to Home page</h2>
products.jsp
<h2>Products page</h2>
contactus.jsp
<h2>Contact Us Page</h2>
7. 创建Controller
package com.ev.springmvc.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
@Controller
@RequestMapping("/")
public class AppController {
@RequestMapping(value = {"/"}, method = RequestMethod.GET)
public String homePage(ModelMap model) {
return "home";
}
@RequestMapping(value = {"/products"}, method = RequestMethod.GET)
public String productsPage(ModelMap model) {
return "products";
}
@RequestMapping(value = {"/contactus"}, method = RequestMethod.GET)
public String contactUsPage(ModelMap model) {
return "contactus";
}
}
Look at each of these controller methods. The returned value from them is treated as tiles-view [Thanks to TilesViewResolver] and corresponding tiles-definition gets consulted.
看这些控制器的每一个方法。 从他们返回的值被视为Tiles视图[归功于TilesViewResolver]和相应的Tiles定义获得咨询。
8.创建初始化类
package com.ev.springmvc.configuration;
import org.springframework.web.servlet.support.AbstractAnnotationConfigDispatcherServletInitializer;
public class AppInitializer extends AbstractAnnotationConfigDispatcherServletInitializer {
@Override
protected Class<?>[] getRootConfigClasses() {
return new Class[] { AppConfig.class };
}
@Override
protected Class<?>[] getServletConfigClasses() {
return null;
}
@Override
protected String[] getServletMappings() {
return new String[] { "/" };
}
}
9. 运行之
可以看到除了中间的主体部分,其他部分都没有改变。
这就是一个简单的TilesDemo啦。
以上就是修真院Java任务四关于Tiles需要了解的内容。
以上所有代码,复制粘贴就能跑!对于自己的个性化需求请自行研究该Demo。
技能树.IT修真院
“我们相信人人都可以成为一个工程师,现在开始,找个师兄,带你入门,掌控自己学习的节奏,学习的路上不再迷茫”。
这里是技能树.IT修真院,成千上万的师兄在这里找到了自己的学习路线,学习透明化,成长可见化,师兄1对1免费指导,这里的老大超级帅。快来与我一起学习吧~