Spring 3 mvc:themes in spring-tutorial with Example---reference

Welcome to Part 6 of the Spring 3.0 MVC Series. In previous article we saw how to add internationalization i18n and Localization l10n support to Spring 3.0 based Web APPL Ication. We used to intercept the change in LocaleChangeInterceptor locale and ReloadableResourceBundleMessageSource class to add message resources properties.

In this part we'll see how to add Themes in Spring MVC. We'll create three different themes and add functionality in our Helloworldspring project for user to select any of the Available theme. Once user selects a theme, we can save it in the cookie so that it can be persisted between different sessions.

Introduction to Themes in Spring MVC

A theme is a collection of static resources, typically style sheets and images, which affect the visual style of the app Lication. We can apply Spring Web MVC Framework themes to set the overall look-and-feel of application, thereby enhancing user Exper Ience.

To use themes in your Web application, you must set up an implementation of the Org.springframework.ui.context.ThemeSource Interface. The Webapplicationcontext interface extends Themesource but delegates it responsibilities to a dedicated implementation. By default the delegate would be a org.springframework.ui.context.support.ResourceBundleThemeSource implementation that Loads properties files from the root of the classpath. To use a custom Themesource implementation or to configure the base name prefix of the Resourcebundlethemesource, can Register a bean in the application context with the reserved name Themesource. The Web application context automatically detects a bean with that name and uses it.

When using the Resourcebundlethemesource, a theme is defined in a simple properties file. The properties file lists the resources, the theme. Here are an example:

Our Goal

Our goal are to change the "Hello World Spring 3" MVC and add Theme support to it. User'll has the option to select Theme from 3 predefined themes (default, black and blue).

Adding Theme support to Spring 3 MVC

Let us configure we Spring 3 MVC application to add Theme support. For this we'll add following code into Spring-servlet.xml file.

File:webcontent/web-inf/spring-servlet.xml

<BeanID= "Themesource"class= "Org.springframework.ui.context.support.ResourceBundleThemeSource">        < Propertyname= "Basenameprefix"value= "theme-" /></Bean> <!--Theme Change Interceptor and Resolver definition -<BeanID= "Themechangeinterceptor"class= "Org.springframework.web.servlet.theme.ThemeChangeInterceptor">    < Propertyname= "ParamName"value= "Theme" /></Bean><BeanID= "Themeresolver"class= "Org.springframework.web.servlet.theme.CookieThemeResolver">    < Propertyname= "Defaultthemename"value= "Default" /></Bean>  <BeanID= "Handlermapping"class= "Org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping">    < Propertyname= "Interceptors">        <List>            <refBean= "Localechangeinterceptor" />            <refBean= "Themechangeinterceptor" />        </List>    </ Property></Bean>

In the above configuration, first we have added  themesource  bean. Notice the This bean was an instance of class  Resourcebundlethemesource  and We also has specified a property  basenameprefix  with value "theme-" . Resourcebundlethemesource class would load the property files containing theme definition starting with prefix "theme-". Thus, if we have defined 3 new themes in our project (default, black and blue) then we'll create 3 property files while Would have certain configuration properties. Also These files would be placed under the project Classpath.

Next, we defined an interceptor bean themechangeinterceptor which are an instance of class org.springframework.web.servlet.theme.ThemeChangeInterceptor . Also Note here, we have specified a property paramname with value theme. This interceptor is invoked whenever a request was made with parameter ' theme ' with different values.

Once The Themechangeinterceptor intercepts the change in the theme, the changes is then stored in the cookie using class org.springframework.web.servlet.theme.CookieThemeResolver. We have the configured this class with our Spring-servlet.xml configuration file. Also Note that we have specified the default theme name with the This bean.

Now create following properties files in Resources/folder of the project.

File:resources/theme-default.properties

css=themes/default.css

File:resources/theme-blue.properties

css=themes/blue.css

File:resources/theme-black.properties

css=themes/black.css

CSS Stylesheet for different Themes

Let us create 3 CSS stylesheet which would act as the theme files for US project. Create following CSS files in Webcontent/themes folder.

File:webcontent/themes/default.css

body {    background-color: white;    color: black;}

File:webcontent/themes/blue.css

body {    background-color: #DBF5FF;    color: #007AAB;}

File:webcontent/themes/black.css

body {    background-color: #888;    color: white;}

JSP View Changes

We are almost do with the changes and last bit which is remaining was to add a functionality for user to select the theme From UI. For this we'll change the header.jsp file and add 3 links with different themes. User can click on any of this link and the theme of WebApplication.

file:webcontent/web-inf/jsp/header.jsp

<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%><%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><h3><spring:message code="label.title"/></h3><span style="float: right">    <a href="?lang=en">en</a>     |     <a href="?lang=de">de</a></span><span style="float: left">    <a href="?theme=default">def</a>     |     <a href="?theme=black">blk</a>    |     <a href="?theme=blue">blu</a></span>

Notice The above JSP changes we created 3 links with argument "? Theme=". Thus whenever user would click these links, a new parameter would be passed in the request with the appropriate theme. The request interceptor of Spring would fetch this value and the theme accordingly.

That ' s all folks

That ' s pretty much it:) We just added Theme support to our demo Spring 3.0 MVC application. All just execute the app in Eclipse. Press ALT + Shift + X, R.

Download Source Code

Click here to download Source code (21KB, Zip)

Reference from:

http://viralpatel.net/blogs/spring-3-mvc-themes-tutorial-example/

Spring 3 mvc:themes in spring-tutorial with Example---reference