Freemarker继承模板和自定义模板的使用

Freemarker模板可以省下很多时间，特别是一个框架类型的web工程或者pdf模板等都很适用。

不多说废话直接说重点：

1.配置freemarker视图解析器

freemarker视图解析器我们常用的是jsp视图解析器，可以多个解析器一起使用的哦!

<bean id="viewResolverFtl" class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">  
        <property name="viewClass" value="org.springframework.web.servlet.view.freemarker.FreeMarkerView"/>  
        <property name="contentType" value="text/html; charset=utf-8"/>  
        <property name="cache" value="true" />  
        <property name="suffix" value=".html" />  
        <property name="order" value="0"/>  
        <property name="requestContextAttribute" value="request"/>
        <property name="exposeSpringMacroHelpers" value="true"/>
	    <property name="exposeRequestAttributes" value="true"/>
        <property name="exposeSessionAttributes" value="true"/>
    </bean>  
      
    <!-- 配置自定义标签，使用了别人的rapid-core-4.0.5.jar包-->

 <bean id="blockDirective" class="cn.org.rapid_framework.freemarker.directive.BlockDirective"/>
     <bean id="extendsDirective" class="cn.org.rapid_framework.freemarker.directive.ExtendsDirective"/>
     <bean id="overrideDirective" class="cn.org.rapid_framework.freemarker.directive.OverrideDirective"/>
     <bean id="superDirective" class="cn.org.rapid_framework.freemarker.directive.SuperDirective"/>
    
	 <bean id="freemarkerConfig" class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
          <property name="freemarkerSettings">
            <props>
                <prop key="template_update_delay">5</prop><!--刷新模板的周期，单位为秒 -->
                <prop key="default_encoding">UTF-8</prop><!--模板的编码格式 -->
                <prop key="locale">UTF-8</prop><!-- 本地化设置 -->
                <prop key="datetime_format">yyyy-MM-dd HH:mm:ss</prop>
                <prop key="time_format">HH:mm:ss</prop>
                <prop key="number_format">0.####</prop>
                <prop key="boolean_format">true,false</prop>
                <prop key="whitespace_stripping">true</prop>
                <prop key="tag_syntax">auto_detect</prop>
                <prop key="url_escaping_charset">UTF-8</prop>
                <prop key="classic_compatible">true</prop>
            </props>
          </property>	    
          <property name="templateLoaderPath">
	        <value>/WEB-INF/templates/</value>//模板的路径
	      </property>
	    <property name="freemarkerVariables">
	        <map>
	            <entry key="extends" value-ref="extendsDirective"/>
                    <entry key="override" value-ref="overrideDirective"/>
                    <entry key="block" value-ref="blockDirective"/>
                    <entry key="super" value-ref="superDirective"/>
	        </map>
	    </property>
	</bean>

2.父模板我的是html类型的

如base.html

<!DOCTYPE html>
<html lang="en">  
<head>  
<#assign base =request.contextPath/>//可以获取项目的路径，如果静态文件加载不出来可以考虑使用该方法
<script src="${base}/scripts/jquery-3.3.1.min.js"></script>
<style type="text/css">
   #tops {
   position:absolute;
            background-color:menu;
            height: 60px;
            width: 100%;
        }

     #lefts {
      position:absolute;
            background-color: gray;
            top:65px;
            height:800px;
            width: 130px;
        }
      #rights {
      position:absolute;
            top:65px;
            margin-left: 132px;
            width: 90%;
            overflow-y:auto;
        }
        #foots{
            background-color: buttonshadow;
            height: 60px;
            width: 100%;
            bottom: 0;
        
        }
        
        button{
            margin-top:20px ;
            background-color:#E6CAFF;
            width:80%;
            height:30px;
        }
        <@block name="csslib"></@block>
    </style>
    <meta charset="utf-8"/> 
</head>  
<body>  
   
    <div id="tops" align="center">  
          <h2 style="margin-top: 20px;">
            <@block name="tops" >云 南 信 息 地 理 图</@block>
       </h2>
    </div> 
    <div id="lefts" align="center" >
     <@block name="lefts" >
 <button  value="云南扩展地图" id="yunnan" onclick="">云南扩展地图</button>
<br>
<button  value="各州市" id="zhoushi"  onclick="">各州市</button>
            
     </@block>
    </div>
    <div id="rights" align="center">
     <h3 > 
        <@block name="title" ></@block>
    </h3>  
    
     <@block name="rights" ></@block>
    </div>
    <div  id="foots" class="footer">
    
    <@block name="foots">
    <p align="center">本系统由小辉辉开发[2018-2888年]</p>
    </@block> 
    </div>
    
</body>  
</html>

继承的模板直接继承使用

如son.html

<@override name="title">   
  信息
</@override>  

 <style type="text/css">
  button{
   margin-top:20px ;
   background-color:#E6CAFF;
   width:80%;
   height:30px;
   
 </style>
<@override name="rights">
松岛枫
</@override>

<@extends name="base.html"/>

我建立的模板是分为了上下左右四块，继承使用的时候子模板里的信息覆盖父模板里的信息，继承可是使用<@extends name="xx.xx"/>也可以使用<#include "xx.xx"/>，继承有传递性哦。

3.操作类

如其中的操作：

	@RequestMapping("/jicheng")
	public String createFreeMarker(Model model){
		return "son";
	}

给出了mave项目中使用的rapid那个jar包，其他freemarker和spring的都很好找就不写了。

   <dependency>
     <groupId>com.googlecode.rapid-framework</groupId>
     <artifactId>rapid-core</artifactId>
     <version>4.0.5</version>
</dependency>

<--------------------------------如有疑问或者不对的地方请留言，谢谢。----------------------------->

Freemarker继承模板和自定义模板的使用

猜你喜欢