2017년/Spring

tiles를 알아보자

위지원 2017. 9. 22. 15:13

Tiles는 웹화면을 템플릿으로 구성시켜주는 framework다.


xml설정파일에 설정을 해줘야한다.상속 기능을 가지고 이기때문에 바뀌지 않는 부분은 계속해서 상속을 받고 변경되는 부분만 변경시켜주면 되어서 편리하다.



일단 전체파일트리는 이렇고....



root-context.xml설정



    <!-- tiles3 -->
    <bean class="org.springframework.web.servlet.view.UrlBasedViewResolver">
        <property name="viewClass"
            value="org.springframework.web.servlet.view.tiles3.TilesView" />
        <property name="order" value="2" />
    </bean>




servlet-context.xml  설정


    <!-- tiles -->
    <beans:bean id="tilesviewResolber"
        class="org.springframework.web.servlet.view.tiles3.TilesViewResolver" />
    <beans:bean id="tilesConfigurer"
        class="org.springframework.web.servlet.view.tiles3.TilesConfigurer">
        <beans:property name="definitions">
            <beans:list>
                <beans:value>/WEB-INF/tiles/tiles.xml</beans:value> #여기에 타일즈 설정파일이 있숩니다~ 하고 알려주는것
            </beans:list>
        </beans:property>
    </beans:bean>



기본적인 사용방법먼저 알아보자면!!



tile.xml 설정


부모의 레이아웃 설정태그


<definition name=".parent" template=".jsp경로">

<put-attribute name="head" value="head.jsp경로"/>

<put-attribute name="body" value="body.jsp경로"/>

</definition>


자식 레이아웃 설정태그


<definition name="/parent" extends=".parent">

<put-attribute name="head" value="head.jsp경로"/>#생략해도된다. 선언하지않으면 그냥 부모의 레이아웃이 출력되기때문에

<put-attribute name="head" value="/{1}.jsp"/>  #request로 온  url을 넣을 수 있다. wildcard라고한다.

</definition>



wildcard쓰려면 pom.xml에 jstl을 추가해줘야한다.

jstl은 jsp 표준 라이브러리의 약어로 자주 사용될 수 있는 커스텀 태그들을 모아서 표준으로 모아놓은 태그라이브러리이다!

나중에 더 자세하게 알아보자


<dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>

</dependency>



이렇게 xml설정이 완료되었으면 부모인 layout.jsp에다가 위에서 지정한 이름으로  name을 지정해주면 아주 잘 된다.

 


<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %>

#이친구를 입력해주자 안했더니 난 자꾸  insertAttribute가 unknow tag라고 경고를 뱉어주었다

<html>

<head>

<tiles:insertAttribute name="head"/>

</head>

<body>

<tiles:insertAttribute name="body"/>

</body>

</html>



예압 이제 실제로 사용해보자 ^0^/


footer,header,menu등 부모  jsp에는 아무것도 안 넣고 그냥 글자만 넣어서 따로 사진을 표기하지 않았다.




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>
    <definition name="layout" template="/WEB-INF/tiles/layout/layout.jsp">
        <put-attribute name="header" value="/WEB-INF/tiles/tile/header.jsp"/>
        <put-attribute name="footer" value="/WEB-INF/tiles/tile/footer.jsp"/>
        <put-attribute name="menu" value="/WEB-INF/tiles/tile/menu.jsp"/>
    </definition>
   
    <definition name="*/*" extends="layout">
        <put-attribute name="content" value="/WEB-INF/views/{1}/{2}.jsp"/>
    </definition>

</tiles-definitions>


layout.jsp


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
    <table>
        <tr>
            <td colspan="2"><tiles:insertAttribute name="header" /></td>
        </tr>
        <tr>
            <td><tiles:insertAttribute name="menu" /></td>
            <td><tiles:insertAttribute name="content" /></td>
        </tr>
        <tr>
            <td colspan="2"><tiles:insertAttribute name="footer" /></td>
        </tr>
    </table>
</body>
</html>


실행화면



사진에서 보이듯이 상속받는 부분은 가만히 있고 content로 지정한 부분만 바뀌는걸 볼 수 있다.


만약에 페이지를 못찾는다면?! 혹시 컨트롤러를 손안댔는지 확인해보자. 리턴값을 바꿔주어야한다 main폴더에 넣었으니깐!