`

velocity布局layout

velocity布局layout 
阅读更多

从VelocityViewServlet到VelocityLayoutServlet  

使用Velocity开发web应用时，需要在web.xml中配置一个Velocity提供的VelocityViewServlet接受处理对velocity模板(即vm文件)的forward访问。（MVC，view只是做展示，通过control，转发到view）

VelocityViewServlet负责将设置在request中的attribute“读出”和模板文件进行merge形成最终的页面，向response输出显示在用户电脑上。

 

VelocityViewServlet是一个简单的易使用的。但是只要把web.xml中VelocityViewServlet换成VelocityLayoutServlet，并配置上2，3句话，将具有页面简单Layout的功能。而这个功能其实非常强大。 

 

VelocityLayoutServlet可以用来简化velocity下的页面布局开发。 

使用VelocityLayoutServlet，当forward到一个页面时，能自动把该页面对应的整体显示出来。

比如访问用户资料页面，能够自动把网页的头，尾等自动显示。 

 

VelocityLayoutServlet使用

系统中有若干页面布局是这样设定的：头部(header)，左侧菜单区域(sub)，中右侧页面内容部(main)，底部(footer)。 

1、创建文件WEB-INF/vm/layout/layout.vm如下：

<body>  
	<div id="header>#parse('vm/layout/header.vm')</div>  
		<div id= "content" >  
			<div id= "sub" >#parse($sub)</div>  
			<div id= "main" >$screen_content</div>  
		</div>  
	<div id= "footer" >#parse('vm/layout/footer.vm')</div>  
</body>

$screen_content相当于一个占位符，被forward的目标页面内容将替代该处内容。 

#parse($sub)：表示sub位置是可以动态通过$sub变量设置的。 

同时也创建'vm/layout/footer.vm''vm/layout/header.vm'这两个文件。 

 

2、创建WEB-INF/vm/user/user.vm如下：(假设该screen页面用于显示用户的资料信息) 

#set($layout = "layout.vm" )    
#set($sub= "vm/user/sub.vm"  )    
<div>
    <p>What's your name?</p>
    <p>My name is $user.loginName!</p>
</div>

第一句话设置这个页面使用哪个布局器。 

第二句话设置sub的值，用于布局把vm/user/sub.vm文件包含进来。

同时也创建"vm/user/sub.vm"文件 

 

配置velocity.properites文件 

使用velocity一般都是需要配置velocity.properites的，至少应该设置input.encoding和output.encoding等。

在这个文件中增加设置如下代码：

resource.loader = webapp  
webapp.resource.loader.class = org.apache.velocity.tools.view.servlet.WebappLoader
webapp.resource.loader.path=/WEB-INF/templates/
default.contentType=text/html
input.encoding = UTF-8
output.encoding = UTF-8
# Directory for layout templates,  
# relative to web application root directory  
tools.view.servlet.layout.directory = / 
# Filepath of the default layout template  
#  relative to the layout directory  
tools.view.servlet.layout.default.template = common/layout/default.vm
#设置外部宏
velocimacro.library = common/macros.vm

 

web.xml配置：

<servlet>  
    <servlet-name>velocity</servlet-name>  
    <servlet- class>  
        org.apache.velocity.tools.view.servlet.VelocityLayoutServlet
	</servlet- class >  
    <init-param>  
        <param-name>org.apache.velocity.toolbox</param-name>  
        <param-value>/WEB-INF/toolbox.xml</param-value>  
    </init-param>  
    <init-param>  
        <param-name>org.apache.velocity.properties</param-name>  
        <param-value>/WEB-INF/velocity.properties</param-value>  
    </init-param>  
</servlet>  
<servlet-mapping>  
    <servlet-name>velocity</servlet-name>  
    <url-pattern>*.vm</url-pattern>  
</servlet-mapping>

 

查看效果

a)访问http://localhost/vm/user/user.vm看看效果。 

b)回到vm/user/user.vm文件，把#set($layout="layout.vm")去掉看看效果。 

效果比较： 

加上$layout设置的user.vm文件，浏览该页面时，将自动把该页面变成布局的一部分，把header.vm,sub.vm,footer.vm也输出出来

去掉$layout设置后浏览时，只是输出该页面，不会将header.vm,sub.vm,footer.vm输出出来。 

这种功能在调试和编写时非常方便。 

以后每增加一个新的页面时，只要在第一行设置了$layout指向一个布局模板便可(注意布局模板的路径，第3步已经做了提示)，便可以轻松具有简单的布局功能了。

分享到：
| unitils使用DatabaseModule和DbUnitModule ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics