header.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#header{width:100%; height:100px;
background-color: green ;
}
</style>
<div id="header">
헤더
</div>
menu.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#menu {width:200px;
background-color: orange ;
}
</style>
<div id="menu">
메뉴
</div>
footer.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#footer{width:100%; height:300px;
background-color: teal ; ;
}
</style>
<div id="footer">
footer
</div>
body1.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#body {
background-color: gray;
}
</style>
<div id="body">
본문 1
</div>
layout.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
#tableLayout{ border:2px thin blue ;
border-style: solid;
border-width: 2px;
width:90%;
margin : 30px;
}
td { border:2px thin blue ;
border-style: solid;
border-width: 1px;
}
</style>
</head>
<body>
<table id="tableLayout">
<tr>
<td colspan="2">
<tiles:insertAttribute name="header" />
헤더가 들어갈 자리
</td>
</tr>
<tr>
<td width="25%" valign="top">
<tiles:insertAttribute name="menu" />
메뉴가 들어갈 자리
</td>
<td width="75%" valign="top">
<tiles:insertAttribute name="body" />
바디 본문이 들어갈 자리
</td>
</tr>
<tr>
<td colspan="2">
<tiles:insertAttribute name="footer" />
풋터가 들어갈 자리
</td>
</tr>
</table>
</body>
</html>
web.xml<?xml version="1.0" encoding="euc-kr"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
version="2.5">
<!-- tiles 라이브러리를 사용하자 -->
<servlet>
<servlet-name>tiles</servlet-name>
<servlet-class>org.apache.tiles.web.startup.TilesServlet</servlet-class>
<init-param>
<param-name>org.apache.tiles.impl.BasicTilesContainer.DEFINITIONS_CONFIG</param-name>
<param-value>/WEB-INF/tiles-basic.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet>
<servlet-name>TilesDispatchServlet</servlet-name>
<servlet-class>
org.apache.tiles.web.util.TilesDispatchServlet
</servlet-class>
</servlet>
<!-- index.tiles 라고 요청하면 /WEB-INF/tiles-basic.xml에 선언된
<definition name="index" template="/tiles/layout.jsp">
를 호출합니다 -->
<servlet-mapping>
<servlet-name>TilesDispatchServlet</servlet-name>
<url-pattern>*.tiles</url-pattern>
</servlet-mapping>
</web-app>
tiles-basic.xml<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 2.1//EN"
"http://tiles.apache.org/dtds/tiles-config_2_1.dtd">
<tiles-definitions>
<definition name="index" template="/tiles/layout.jsp">
<put-attribute name="header" value="/tiles/header.jsp"/>
<put-attribute name="menu" value="/tiles/menu.jsp"/>
<put-attribute name="body" value="/tiles/body1.jsp"/>
<put-attribute name="footer" value="/tiles/footer.jsp"/>
</definition>
</tiles-definitions>
header.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#header{width:100%; height:100px;
background-color: green ;
}
</style>
<div id="header">
헤더
</div>
menu.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#menu {width:100%;
background-color: orange ;
}
</style>
<div id="menu">
메뉴
</div>
footer.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#footer{width:100%; height:300px;
background-color: olive ;
}
</style>
<div id="footer">
footer
</div>
body1.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#body {
background-color: gray;
}
</style>
<div id="body">
본문 1 <br />
<a href="study2.tiles" > 바디2로 이동하기</a>
</div>
body2.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#body {
background-color: gray;
}
</style>
<div id="body">
body2.jsp <br />
<a href="study3.tiles" > 바디3로 이동하기</a><br/>
<img src="http://mijoo.pe.kr/zbxe/files/attach/images/101/545/002/1_2.jpg" />
</div>
body3.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#body {
background-color: gray;
}
</style>
<div id="body">
body3.jsp <br />
<a href="study4.tiles" > 바디4로 이동하기</a><br/>s
<img src="http://contents.dt.co.kr/images/200901/2009012902011931716001.jpg" />
</div>
body4.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<style>
#body {
background-color: gray;
}
</style>
<div id="body">
body4.jsp <br />
<a href="study1.tiles" > 바디1로 이동하기</a><br/>
<img src="http://www.fallight.com/attach/1/1499946474.jpg" />
</div>
layout.jsp<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
<tiles:getAsString name="title"/>
</title>
<style>
#tableLayout{ border:2px thin blue ;
border-style: solid;
border-width: 2px;
width:90%;
margin : 30px;
}
td { border:2px thin blue ;
border-style: solid;
border-width: 1px;
}
</style>
</head>
<body>
<table id="tableLayout">
<tr>
<td colspan="2">
<tiles:insertAttribute name="header" />
헤더가 들어갈 자리
</td>
</tr>
<tr>
<td width="20%" valign="top">
<tiles:insertAttribute name="menu" />
메뉴가 들어갈 자리
</td>
<td width="80%" valign="top">
<tiles:insertAttribute name="body" />
바디 본문이 들어갈 자리
</td>
</tr>
<tr>
<td colspan="2">
<tiles:insertAttribute name="footer" />
풋터가 들어갈 자리
</td>
</tr>
</table>
</body>
</html>
web.xml
<?xml version="1.0" encoding="euc-kr"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
version="2.5">
<!-- tiles 라이브러리를 사용하자 -->
<servlet>
<servlet-name>tiles</servlet-name>
<servlet-class>org.apache.tiles.web.startup.TilesServlet</servlet-class>
<init-param>
<param-name>org.apache.tiles.impl.BasicTilesContainer.DEFINITIONS_CONFIG</param-name>
<param-value>/WEB-INF/tiles-basic.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet>
<servlet-name>TilesDispatchServlet</servlet-name>
<servlet-class>
org.apache.tiles.web.util.TilesDispatchServlet
</servlet-class>
</servlet>
<!-- index.tiles 라고 요청하면 /WEB-INF/tiles-basic.xml에 선언된
<definition name="index" template="/tiles/layout.jsp">
를 호출합니다 -->
<servlet-mapping>
<servlet-name>TilesDispatchServlet</servlet-name>
<url-pattern>*.tiles</url-pattern>
</servlet-mapping>
</web-app>
tiles-basic.xml<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 2.1//EN"
"http://tiles.apache.org/dtds/tiles-config_2_1.dtd">
<tiles-definitions>
<definition name="index" template="/tiles/layout.jsp">
<put-attribute name="title" value="title를 사용하자"/>
<put-attribute name="header" value="/tiles/header.jsp" />
<put-attribute name="menu" value="/tiles/menu.jsp"/>
<put-attribute name="body" value="/tiles/body1.jsp"/>
<put-attribute name="footer" value="/tiles/footer.jsp"/>
</definition>
<!-- wild Card Tiles 2.1버전부터는 설정파일에서
*와일드카드를 사용하여 설정파일의 내용을 줄이는 방법이 지원된다. -->
<definition name="study*" extends="index">
<put-attribute name="body" value="/tiles/body{1}.jsp"/>
</definition>
<!-- *study* = > /~/{1}study{2}.jsp
예: androidStudy01.tiles => /study/androidStudy01.jsp
예: htmlStudy03.tiles => /study/htmlStudy03.jsp
-->
<!-- day02_01.jsp , day02_01.tiles -->
</tiles-definitions>
09.Tiles.zip