tiles,или привет шаблонные странички
Привет,сегодня я расскажу о такой замечательной штуке,как tiles. Часто почти всё время при создании сайта или простого веб-приложения возникает ситуация,когда есть одинаковые элементы у станиц,и естественно лень их каждый раз переписывать да и места они могут есть порядком и читабельности совсем не добавляют. неплохо было бы сделать нейкий шаблон,в который можно было бы подставлять только изменяемые части,а те,которые всё время одинаковые — подгружать. Для этого и придумали такую замечательную вещь как tiles.
придумаем нейкий дизайн страницы:
Тэкс. Тут у нас будет какая-то менюшка с кнопками,футер и какой-то контент который будем менять при переходе по страничкам. Ну-с с дизайном будем считать определились,перейдём к яве.
Создаём новый проект и подключаем к нему maven(либо сразу создаём maven-проект,либо испьзуем тот,что есть не суть важна). Подключаем к нему зависимости struts2-core и struts2-tiles-plugin. Мне удобнее описывать сначала дизайн,по-этому я с него и начну.
Тэкс,по-скольку у нас будет нейкий шаблон,то нам надо завести страничку,которая будет ядром шаблона и в которой будут описываться элементы этого шаблона. Создадим в папке WEB-INF папку tiles в ней создадим страницу baseLayout.jsp.Это и будет наш шаблон.
baseLayout.jsp
<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@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:insertAttribute name="title"/></title> </head> <body> <table cellpadding="2" cellspacing="2" align="center"> <tr> <td><tiles:insertAttribute name="menu"/></td> </tr> <tr> <td><tiles:insertAttribute name="body"/></td> </tr> <tr> <td><tiles:insertAttribute name="footer"/></td> </tr> </table> </body> </html>
Как видно — это простая jsp-шка с табличной вёрсткой и пометками,что снчала у нас будет какое-то меню,затем какое-то тело страницы,затем какой-то футер. Пока что нам не важно что будет,нам важно как) теперь в этой же папке опишем три страницы menu.jsp, body.jsp и footer.jsp в которых опишем соответствующие нужные нам элементы.
menu.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@ taglib uri="/struts-tags" prefix="s" %> <html> <head> <title>Insert title here</title> </head> <body> <table> <tr> <td> <a href="<s:url action="mainPageLink"/>"> <s:text name="Main Page" /> </a> </td> <td> <a href="<s:url action="userInformationPageLink"/>"> <s:text name="User Information" /> </a> </td> <td> <a href="<s:url action="aboutPageLink"/>"><s:text name="About Us" /></a> </td> </tr> </table> </body> </html>
footer.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!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=ISO-8859-1"> <title>Insert title here</title> </head> <body> Hello I`m a footer :) </body> </html>
В body.jsp может быть такая же как и footer.jsp 🙂 (можно поменять текст 🙂 )
Теперь надо описать конфигурационный файл самих тайлсов. В этом файле должен быть описан общий шаблон(baseLayout)
с путями к страницам. Далее должны быть описаны те тайлсы,которые мы хотим использовать с указанием какой шаблон мы расширяем.
Приведу пример и потом опишу более наглядно:
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=»baseLayout» template=»/WEB-INF/tiles/baseLayout.jsp»>
<put-attribute name=»title» value=»Telephone Station» />
<put-attribute name=»header» value=»/WEB-INF/tiles/header.jsp» />
<put-attribute name=»menu» value=»/WEB-INF/tiles/menu.jsp» />
<put-attribute name=»body» value=»/WEB-INF/tiles/body.jsp» />
</definition>
<definition name=»mainPage» extends=»baseLayout»>
<put-attribute name=»title» value=»Welcome to Telephone Station!» />
<put-attribute name=»body» value=»/WEB-INF/tiles/pages/main/body.jsp» />
</definition>
</tiles-definitions>
Здесь мы описали базовый шаблон baseLayout,показали где он лежит и описали какие атрибуты на какие страницы заменить.
Далее описали шаблон mainPage и указали,что он будет расширять шаблон baseLayout. И так же какую jsp-страницу подставить вместо атрибута body.
По такой же схеме надо описать тайлсы для страниц User Information и About.
Окей,тайлсы вроде как с большего описали,теперь надо добавить listener tiles. в web.xml дописываем следующее:
<context-param>
<param-name>org.apache.tiles.impl.BasicTilesContainer.DEFINITIONS_CONFIG</param-name>
<param-value>/WEB-INF/tiles.xml</param-value>
</context-param>
<listener>
<listener-class>org.apache.struts2.tiles.StrutsTilesListener</listener-class>
</listener>
Теперь нам осталось только подключить struts2 и использовать его по назначению 🙂
Теперь в struts.xml нам так же надо добавить тайлсы как result-type, чтобы struts знал,что при выполнении action ему надо вернуть не страницу,а tiles. Теперь наш struts.xml будет выглядеть следующим образом:
<?xml version=»1.0″ encoding=»UTF-8″?>
<!DOCTYPE struts PUBLIC
«-//Apache Software Foundation//DTD Struts Configuration 2.0//EN»
«http://struts.apache.org/dtds/struts-2.0.dtd»>
<struts>
<package name=»default» extends=»struts-default»>
<result-types>
<result-type name=»tiles» class=»org.apache.struts2.views.tiles.TilesResult» />
</result-types>
</package>
</struts>
описание action-а: