Spring 3 MVC: Tiles Plugin Tutorial With Example In Eclipse
- By Viral Patel on July 8, 2010
Welcome to Part 4 for Spring 3.0 MVC Series. In previous article we saw how to create a form using Spring 3 MVC and display it in JSP. Also we learn about annotation @ModelAttribute
.
In this part we will discuss about Tiles Framework and its Integration with Spring 3.0 MVC. We will add Tiles support to our HelloWorld Spring application that we created in previous parts. I strongly recommend you to go through previous articles and download the source code of our sample application.
Spring 3.0 MVC Series
- Part 1: Introduction to Spring 3.0 MVC framework
- Part 2: Create Hello World Application in Spring 3.0 MVC
- Part 3: Handling Forms in Spring 3.0 MVC
- Part 4: Spring 3 MVC Tiles Plugin Tutorial with Example in Eclipse
- Part 5: Spring 3 MVC Internationalization & Localization Tutorial with Example in Eclipse
- Part 6: Spring 3 MVC Themes in Spring-Tutorial with Example
- Part 7: Create Spring 3 MVC Hibernate 3 Example using Maven in Eclipse
- Spring 3 MVC Interceptor tutorial
- Spring MVC: Save / Retrieve BLOB object with Hibernate
- How to change spring-servlet.xml filename
- Spring MVC: Multiple Row Form Submit using List of Beans
- Spring 3 MVC – Autocomplete with JQuery & JSON example
- Spring MVC + FreeMarker (FTL) Integration example
- Spring MVC HashMap Form Integration example
- Spring MVC Multiple File Upload example
Introduction to Tiles 2
Nowadays, website are generally divided into pieces of reusable template that are being rendered among different web pages. For example a site containing header, footer, menu etc. This items remains same through out the website and give it a common look and feel. It is very difficult to hard code this in each and every webpage and if later a change is needed than all the pages needs to be modified. Hence we use templatization mechanism. We create a common Header, Footer, Menu page and include this in each page.
Tiles Plugin allow both templating and componentization. In fact, both mechanisms are similar: you
define parts of page (a “Tile”) that you assemble to build another part or a full page. A part can
take parameters, allowing dynamic content, and can be seen as a method in JAVA language. Tiles is a templating system used to maintain a consistent look and feel across all the web pages of a web application. It increase the reusability of template and reduce code duplication.
A common layout of website is defined in a central configuration file and this layout can be extended across all the webpages of the web application.
Our Application Layout
Our goal is to add Header, Footer and Menu to our Spring 3 HelloWorld application. Following will be the layout of the same.
Required JAR files
In order to add Tiles support to our Spring3 application, we will need few jar files. Following is the list of JARs in our example. Add these JARs in WEB-INF/lib folder.
The highlighted jar files in above list are the new jars to be added in project for Tiles integration.
Configuring Tiles framework in Spring MVC
To configure Tiles, an entry for bean TilesConfigure
has to be made in spring-servlet.xml. Open the spring-servlet.xml from WEB-INF folder and add following code between <beans> </beans>
tag.
File: /WebContent/WEB-INF/spring-servlet.xml
< bean id = "viewResolver"
class = "org.springframework.web.servlet.view.UrlBasedViewResolver" >
< property name = "viewClass" >
< value >
org.springframework.web.servlet.view.tiles2.TilesView
</ value >
</ property >
</ bean >
< bean id = "tilesConfigurer"
class = "org.springframework.web.servlet.view.tiles2.TilesConfigurer" >
< property name = "definitions" >
< list >
< value >/WEB-INF/tiles.xml</ value >
</ list >
</ property >
</ bean >
|
An input configuration file /WEB-INF/tiles.xml is passed as argument in above bean definition. This file contains the Tiles definition for our web application.
Create a file tiles.xml in WEB-INF folder and copy following code into it.
File: WebContent/WEB-INF/tiles.xml
<? xml version = "1.0" encoding = "UTF-8" ?>
<!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN"
"http://tiles.apache.org/dtds/tiles-config_2_0.dtd">
< tiles-definitions >
< definition name = "base.definition"
template = "/WEB-INF/jsp/layout.jsp" >
< put-attribute name = "title" value = "" />
< put-attribute name = "header" value = "/WEB-INF/jsp/header.jsp" />
< put-attribute name = "menu" value = "/WEB-INF/jsp/menu.jsp" />
< put-attribute name = "body" value = "" />
< put-attribute name = "footer" value = "/WEB-INF/jsp/footer.jsp" />
</ definition >
< definition name = "contact" extends = "base.definition" >
< put-attribute name = "title" value = "Contact Manager" />
< put-attribute name = "body" value = "/WEB-INF/jsp/contact.jsp" />
</ definition >
</ tiles-definitions >
|
Here in tiles.xml we have define a template base.definition. This layout contains attributes such as Header, Title, Body, Menu and Footer. The layout is then extended and new definitions for Contact page. We have override the default layout and changed the content for Body and Title.
Creating View – The JSPs
We will define the template for our webapplication in a JSP file called layout.jsp. This template will contain different segments of web page (Header, Footer, Menu etc). Create four new JSP files layout.jsp, header.jsp, menu.jsp and footer.jsp and copy following content in each of them.
File: WebContent/WEB-INF/jsp/layout.jsp
<%@ 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:insertAttribute name = "title" ignore = "true" /></ title >
</ head >
< body >
< table border = "1" cellpadding = "2" cellspacing = "2" align = "center" >
< tr >
< td height = "30" colspan = "2" >< tiles:insertAttribute name = "header" />
</ td >
</ tr >
< tr >
< td height = "250" >< tiles:insertAttribute name = "menu" /></ td >
< td width = "350" >< tiles:insertAttribute name = "body" /></ td >
</ tr >
< tr >
< td height = "30" colspan = "2" >< tiles:insertAttribute name = "footer" />
</ td >
</ tr >
</ table >
</ body >
</ html >
|
File: WebContent/WEB-INF/jsp/header.jsp
< h1 >Header</ h1 >
|
File: WebContent/WEB-INF/jsp/menu.jsp
< p >Menu</ p >
|
File: WebContent/WEB-INF/jsp/footer.jsp
< p >Copyright © ViralPatel.net</ p >
|
That’s All Folks
Compile and Execute the application in Eclipse and see that the header, menu and footer are properly applied.
Download Source Code
Moving On
Today we saw how we can configure Tiles framework with Spring 3 MVC application. We used org.springframework.web.servlet.view.tiles2.TilesConfigurer class in bean definition to define the tiles configuration file. In next part we will discuss about Internationalization/Localization and adding its support in Spring 3 MVC. I hope you liked this article. Feel free to post your queries and comments in comment section.
Related Posts
Get our Articles via Email. Enter your email address.
120 Comments
- By Viral Patel on July 8, 2010
Welcome to Part 4 for Spring 3.0 MVC Series. In previous article we saw how to create a form using Spring 3 MVC and display it in JSP. Also we learn about annotation @ModelAttribute
.
In this part we will discuss about Tiles Framework and its Integration with Spring 3.0 MVC. We will add Tiles support to our HelloWorld Spring application that we created in previous parts. I strongly recommend you to go through previous articles and download the source code of our sample application.
Spring 3.0 MVC Series
- Part 1: Introduction to Spring 3.0 MVC framework
- Part 2: Create Hello World Application in Spring 3.0 MVC
- Part 3: Handling Forms in Spring 3.0 MVC
- Part 4: Spring 3 MVC Tiles Plugin Tutorial with Example in Eclipse
- Part 5: Spring 3 MVC Internationalization & Localization Tutorial with Example in Eclipse
- Part 6: Spring 3 MVC Themes in Spring-Tutorial with Example
- Part 7: Create Spring 3 MVC Hibernate 3 Example using Maven in Eclipse
- Spring 3 MVC Interceptor tutorial
- Spring MVC: Save / Retrieve BLOB object with Hibernate
- How to change spring-servlet.xml filename
- Spring MVC: Multiple Row Form Submit using List of Beans
- Spring 3 MVC – Autocomplete with JQuery & JSON example
- Spring MVC + FreeMarker (FTL) Integration example
- Spring MVC HashMap Form Integration example
- Spring MVC Multiple File Upload example
Introduction to Tiles 2
Nowadays, website are generally divided into pieces of reusable template that are being rendered among different web pages. For example a site containing header, footer, menu etc. This items remains same through out the website and give it a common look and feel. It is very difficult to hard code this in each and every webpage and if later a change is needed than all the pages needs to be modified. Hence we use templatization mechanism. We create a common Header, Footer, Menu page and include this in each page.
Tiles Plugin allow both templating and componentization. In fact, both mechanisms are similar: you
define parts of page (a “Tile”) that you assemble to build another part or a full page. A part can
take parameters, allowing dynamic content, and can be seen as a method in JAVA language. Tiles is a templating system used to maintain a consistent look and feel across all the web pages of a web application. It increase the reusability of template and reduce code duplication.
A common layout of website is defined in a central configuration file and this layout can be extended across all the webpages of the web application.
Our Application Layout
Our goal is to add Header, Footer and Menu to our Spring 3 HelloWorld application. Following will be the layout of the same.
Required JAR files
In order to add Tiles support to our Spring3 application, we will need few jar files. Following is the list of JARs in our example. Add these JARs in WEB-INF/lib folder.
The highlighted jar files in above list are the new jars to be added in project for Tiles integration.
Configuring Tiles framework in Spring MVC
To configure Tiles, an entry for bean TilesConfigure
has to be made in spring-servlet.xml. Open the spring-servlet.xml from WEB-INF folder and add following code between <beans> </beans>
tag.
File: /WebContent/WEB-INF/spring-servlet.xml
< bean id = "viewResolver"
class = "org.springframework.web.servlet.view.UrlBasedViewResolver" >
< property name = "viewClass" >
< value >
org.springframework.web.servlet.view.tiles2.TilesView
</ value >
</ property >
</ bean >
< bean id = "tilesConfigurer"
class = "org.springframework.web.servlet.view.tiles2.TilesConfigurer" >
< property name = "definitions" >
< list >
< value >/WEB-INF/tiles.xml</ value >
</ list >
</ property >
</ bean >
|
An input configuration file /WEB-INF/tiles.xml is passed as argument in above bean definition. This file contains the Tiles definition for our web application.
Create a file tiles.xml in WEB-INF folder and copy following code into it.
File: WebContent/WEB-INF/tiles.xml
<? xml version = "1.0" encoding = "UTF-8" ?>
<!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN"
"http://tiles.apache.org/dtds/tiles-config_2_0.dtd">
< tiles-definitions >
< definition name = "base.definition"
template = "/WEB-INF/jsp/layout.jsp" >
< put-attribute name = "title" value = "" />
< put-attribute name = "header" value = "/WEB-INF/jsp/header.jsp" />
< put-attribute name = "menu" value = "/WEB-INF/jsp/menu.jsp" />
< put-attribute name = "body" value = "" />
< put-attribute name = "footer" value = "/WEB-INF/jsp/footer.jsp" />
</ definition >
< definition name = "contact" extends = "base.definition" >
< put-attribute name = "title" value = "Contact Manager" />
< put-attribute name = "body" value = "/WEB-INF/jsp/contact.jsp" />
</ definition >
</ tiles-definitions >
|
Here in tiles.xml we have define a template base.definition. This layout contains attributes such as Header, Title, Body, Menu and Footer. The layout is then extended and new definitions for Contact page. We have override the default layout and changed the content for Body and Title.
Creating View – The JSPs
We will define the template for our webapplication in a JSP file called layout.jsp. This template will contain different segments of web page (Header, Footer, Menu etc). Create four new JSP files layout.jsp, header.jsp, menu.jsp and footer.jsp and copy following content in each of them.
File: WebContent/WEB-INF/jsp/layout.jsp
<%@ 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:insertAttribute name = "title" ignore = "true" /></ title >
</ head >
< body >
< table border = "1" cellpadding = "2" cellspacing = "2" align = "center" >
< tr >
< td height = "30" colspan = "2" >< tiles:insertAttribute name = "header" />
</ td >
</ tr >
< tr >
< td height = "250" >< tiles:insertAttribute name = "menu" /></ td >
< td width = "350" >< tiles:insertAttribute name = "body" /></ td >
</ tr >
< tr >
< td height = "30" colspan = "2" >< tiles:insertAttribute name = "footer" />
</ td >
</ tr >
</ table >
</ body >
</ html >
|
File: WebContent/WEB-INF/jsp/header.jsp
< h1 >Header</ h1 >
|
File: WebContent/WEB-INF/jsp/menu.jsp
< p >Menu</ p >
|
File: WebContent/WEB-INF/jsp/footer.jsp
< p >Copyright © ViralPatel.net</ p >
|
That’s All Folks
Compile and Execute the application in Eclipse and see that the header, menu and footer are properly applied.
Download Source Code
Click here to download Source Code (8.88kb).
Moving On
Today we saw how we can configure Tiles framework with Spring 3 MVC application. We used org.springframework.web.servlet.view.tiles2.TilesConfigurer class in bean definition to define the tiles configuration file. In next part we will discuss about Internationalization/Localization and adding its support in Spring 3 MVC. I hope you liked this article. Feel free to post your queries and comments in comment section.
Get our Articles via Email. Enter your email address.
相关推荐
- 添加视图解析器的 bean,如 `org.springframework.web.servlet.view.tiles3.TilesViewResolver` - 配置 `TilesConfigurer`,指定 Tiles 的配置文件路径。 3. **配置 Tiles**:创建一个 Tiles 配置文件(如 `...
4. **Part 4: Spring 3 MVC Tiles Plugin Tutorial with Example in Eclipse** - 将展示如何使用Tiles插件来管理页面布局,以及如何在Eclipse环境中配置和运行示例。 5. **Part 5: Spring 3 MVC ...
**Spring MVC 3 与 Tiles 框架整合** 在Web开发中,Spring MVC和Tiles是两个非常重要的组件。Spring MVC作为一个强大的MVC框架,负责处理应用的业务逻辑和视图展示,而Tiles则是一个视图层框架,主要用于页面布局和...
标题中的“Spring MVC, Tiles, Freemarker集成”指的是在Java Web开发中,将Spring MVC作为控制器框架,Tiles作为页面布局工具,而Freemarker作为视图模板引擎进行整合使用的技术方案。这种集成可以帮助开发者构建...
《Spring Web MVC与Tiles2整合详解》 Spring Web MVC是Spring框架的重要组成部分,它提供了一个用于构建Web应用程序的全面模型视图控制器(MVC)架构。而Tiles2是一个视图框架,它允许开发者将Web页面分解成可重用...
Spring mvc tiles thinAdmin bootstrap Spring mvc tiles thinAdmin bootstrap Spring mvc tiles thinAdmin bootstrap
4. **第4部分:Spring 3 MVC的Tiles支持与Eclipse中的插件教程** - Tiles框架是一种用于管理页面布局的强大工具,本节介绍如何将其与Spring MVC结合使用。 5. **第5部分:Spring 3 MVC的国际化与本地化教程** - 讨论...
<bean id="tilesViewResolver" class="org.springframework.web.servlet.view.tiles3.TilesViewResolver"/> <bean id="tilesConfigurer" class="org.springframework.web.servlet.view.tiles3.TilesConfigurer"> ...
4. **Tiles支持与Eclipse插件教程**:介绍使用Tiles布局系统和Eclipse插件进行开发的方法。 5. **国际化与本地化**:教授如何在Spring MVC中实现应用的多语言支持。 6. **Spring主题**:探讨Spring MVC中如何定制和...
7. **使用Maven在Eclipse中创建Spring 3 MVC与Hibernate 3的例子**:Spring MVC可以很好地与ORM框架如Hibernate集成。这部分将带你通过一个实战示例,学习如何在Spring MVC中配置和使用Hibernate进行数据持久化。 ...
zo-spring-bootFrom zero to one with Spring Boot###roadmap权限:Shiro (Done)UI:SB Admin 2(Based of Bootstrap 3) (TODO)数据库:hsqldb (Done)持久化:Spring Data JPA (Done)MVC:Spring MVC (Done)Template ...
这个jar文件包含Spring MVC框架相关的所有类。 包含国际化、标签、Theme、视图展现的FreeMarker、JasperReports、Tiles、Velocity、XSLT相关类。 当然,如果你的应用使用了独立的MVC框架,则无需这个JAR文件里的...
Spring 3.0 MVC 是一个用于构建 Web 应用程序的全功能模型-视图-控制器(MVC)框架,它是 Spring 框架的一个核心模块。Spring MVC 提供了一种可插拔的架构,允许开发者选择使用内置的 Spring Web 框架,或者与其他 ...
Spring3 MVC 是一款基于Java的Web开发框架,它在Spring框架的基础上提供了模型-视图-控制器(MVC)架构模式的实现,使得开发者能够更高效地构建可维护、可扩展的Web应用程序。这个"Spring3 MVC 示例下载"是官方提供...
4. Spring 3 MVC Tiles插件教程:结合例子介绍如何在Eclipse中使用Tiles来组织和管理视图。 5. Spring 3 MVC国际化和本地化教程:提供Eclipse环境下的实战指导,教你怎么实现应用的多语言支持。 6. Spring 3 MVC主题...
**Spring MVC 3.0详解** Spring MVC是Spring框架的一部分,专为构建Web应用程序而设计。这个名为"Spring MVC 3.0.rar"的压缩包包含了一份关于Spring MVC 3.0版本的实战指南PPT,是Java开发者深入理解Spring MVC架构...
Spring MVC 是一个基于Java的轻量级Web应用框架,它是Spring框架的重要组成部分,主要用于构建Web应用程序的后端控制器。Spring MVC的设计目标是提供一个清晰的组件化架构,使得开发者可以独立地开发和测试控制器、...
Spring MVC属于SpringFrameWork的后续产品,已经融合在Spring Web Flow里面。Spring 框架提供了构建 Web 应用程序的全功能 MVC 模块。使用 Spring 可插入的 MVC 架构,可以选择是使用内置的 Spring Web 框架还可以是...
Spring3.0 MVC框架是Spring框架的一个重要组成部分,专门用于构建强大的Web应用程序。该框架具有高度的灵活性和可配置性,允许开发者以自己的方式组织和设计应用的各个组件。Spring MVC的设计理念是松耦合,使得它能...
### Spring结合Tiles框架详解 #### 一、Spring与Tiles框架简介 **Spring**是一个轻量级的Java开发框架,主要用于简化企业级应用的开发过程。它提供了强大的依赖注入(DI)功能,使得开发者能够轻松地管理和组织...