Velocity 作为页面模板

Velocity是一个基于Java的模板引擎(template engine),它允许任何人仅仅简单的使用模板语言(template language)来引用由java代码定义的对象。 

当Velocity应用于web开发时,界面设计人员可以和java程序开发人员同步开发一个遵循MVC架构的web站点,也就是说,页面设计人员可以只 关注页面的显示效果,而由java程序开发人员关注业务逻辑编码。Velocity将java代码从web页面中分离出来,这样为web站点的长期维护提供了便利,同时也为我们在 JSP 和 PHP 之外又提供了一种可选的方案。 

Velocity的能力远不止web站点开发这个领域,例如,它可以从模板(template)产生SQL、PostScript、XML等脚本,它也可以被当 作一个独立工具来产生源代码和报告,或者作为其他系统的集成组件使用。

Velocity也可以为Turbine web开发架构提供模板服务(template service)。

Velocity+Turbine提供一个模板服务的方式允许一个web应用以一个真正的MVC模型进行开发。

Velocity的Eclipse插件的Update地址是:

http://propsorter.sourceforge.net/veloeclipse/

 

#parse 指令用来在模板中引入并执行另外一个模板,并把执行结果嵌入到当前位置。

1. VMDemo.java

import java.io.StringWriter;
import java.io.Writer;
 
import org.apache.velocity.Template;
import org.apache.velocity.VelocityContext;
import org.apache.velocity.app.Velocity;
import org.apache.velocity.tools.generic.RenderTool;
 
public class VMDemo {
 
  public static void main(String[] args) throws Exception {
    Velocity.init();
    Template t = Velocity.getTemplate("./src/VMDemo.vm");	// 设置vm文件路径
 
    VelocityContext ctx = new VelocityContext();
 
    Writer writer = new StringWriter();
    t.merge(ctx, writer);
 
    System.out.println(writer);
  }
}

 

2. VMDemo.vm

#set ($companyName = "Name")
<html>
  <head>
    <title>$companyName Homepage</title>
  </head>
  <body>
    <h1>Welcome!!</h1>
    $innerVar
    #parse("./src/pageFooter.vm")
    $innerVar
  </body>
</html>

 

3. pageFooter.vm

#set ($innerVar = "This is an inner variable")
<h3>Copyright &copy; $companyName 2004</h3>

 

 

Velocity 布局祥解

大多数网站的每个页面布局差别不是太大,对于一个WEB应用来说,页面的基本结构往往是固定的,页面中的很多部分,例如页面统一的头部、尾部、菜单、导航等,一般是不太需要变化的,各个页面基本一致,变化的往往是页面的具体内容部分,这样,布局(layout)功能的使用,就能大大减化前端页面的复杂性了。

如果每个页面独立一个文件,则会导致不同文件出现大量相同的代码,我们也可以把这些相同的代码抽取出来放在一个独立的小文件,需要的时候利用 Velocity的#parse指令 来嵌入到目标页面中。但是此法却对页面上用于控制排版的HTML代码无效,因为控制整个页面排版的代码一般会贯穿整个文件,开头、结尾皆有,无法分拆到独立的文件上,因此就有将页面的layout独立出来的,以减小页面的代码量的需要。

一般情况下,layout页面大概长什么样子

<body>  
        <div class="content">  
            #parse("/common/header.vm")  
            <div class="content-info">  
                #parse("/common/leftMenu.vm")  
                <div class="content-main">  
                    $screen_content  
                </div>  
            </div>  
            #parse("common/footer.vm")  
        </div>  
</body>  

解释一下:

如果你在处理某个请求时返回了a.vm模板,那么最终返回的页面是:将a.vm模板的内容填充layout页面的$screen_content占位符的内容,然后再将整个填充后的页面返回给用户

如果有兴趣你可以看一下大致的实现原理,其实很简单,就是先调用velocity引擎渲染请求返回的模板,将该渲染结果(一个String类型的字符串)作为一参数传递给layout页面,参数名称就是screen_content,然后再次调用引擎渲染layout页面,这样就会把该screen_content参数对应的值作为页面的一部分渲染出来了,从而实现整个页面的布局功能。

这样,我们就简单介绍了如何简单配置和使用velocity的layout功能了,这里你可以会有疑问了,如果我某个页面需要使用不同的layout页面,甚至我有些页面不需要使用layout功能,该怎么办?其实很简单,我们前面viewResolver配置中,配置的只是默认的layout页面的地址,如果你要使用不同的layout页面,只需在你要返回的页面中如下简单设置一下即可:

#set($layout = "/layout/layout2.vm")  

这样,我们就强制我们的这个页面使用的是layout2.vm这个页面布局。

按照这个思路,如果我在某个特殊的页面,不想使用layout功能了,我们可以再指定另外一个layout页面,只不过这个layout页面内容比较特殊,它没有一般布局页面中有的那些页面统一的头部、尾部和菜单,只有如下所示的一行代码就可以了:

$screen_content  

 

在用Velocity时一般都是使用Velocity-Tools项目的VelocityViewServlet来负责解析所有Velocity 模板的请求,其实VelocityTools也提供另外一个Servlet便是VelocityLayoutServlet,该类直接从 VelocityViewServlet继承而来,通过使用VelocityLayoutServlet可以让我们很容易的将页面的布局控制模板和数据模板分隔开来。

欲使用此功能,请遵循以下步骤:

1. 使用VelocityLayoutServlet类

原先的VelocityViewServlet直接替换成 VelocityLayoutServlet;

 

2. 配制VelocityLayoutServlet

打开velocity.properties增加配制如下:

#  处理错误信息的模板路径 
#  relative to web application root directory
tools.view.servlet.error.template = error.vm

#  所有布局文件的默认路径
#  relative to web application root directory
tools.view.servlet.layout.directory = /WEB-INF/layout/

#  默认的布局文件
#  relative to the layout directory 
#  NOT relative to the root directory of the webapp!
tools.view.servlet.layout.default.template =  default.vm

 

3. 布局测试

编写测试布局文件default.vm放置于上述配置中的默认布局文件存放路径中,内容如下

<html>
<head>
  <title>$!page_title</title>
</head>
<body>
  $screen_content
</body>
</html>

上面源码中 $screen_content 便是VelocityLayoutServlet 保留的关键字,Velocity依此关键字来潜入实际被引用的页面内容,其他变量开发者可以灵活处理。

另编写测试页面 test.vm存放于web根目录下,内容如下

#set($page_title="Layout Test")
Hello Velocity Layout!

启动服务器,测试该页面输出的HTML内容如下:

<html>
<head>
  <title>Layout Test</title>
</head>
<body>
  Hello Velocity Layout!
</body>
</html>

如此便达到我们预期的效果

 

 

Velocity 快速入门教程

1. 变量

(1) 变量的定义

#set($name = "hello")      说明:velocity中变量是弱类型的。

当使用#set 指令时,括在双引号中的字面字符串将解析和重新解释,如下所示:

#set($directoryRoot = "www" )
#set($templateName = "index.vm" )
#set($template = "$directoryRoot/$templateName" )
$template

输出将会是:

www/index.vm

注:在velocity中使用$2.5这样的货币标识是没有问题的,因为velocity中的变量总是以一个大写或者小写的字母开始的。

 

(2) 变量规范的写法

${name} ,也可以写成:$name,提倡用前面的写法。

例如:你希望通过一个变量$vice来动态的组织一个字符串。

 Jack is a $vicemaniac.

本来变量是$vice现在却变成了$vicemaniac,这样Veloctiy就不知道您到底要什么了。所以,应该使用规范的格式书写 :

 Jack is a ${vice}maniac

现在Velocity知道变量是$vice而不是$vicemaniac。

注意:当引用属性的时候不能加{}

 

(3)变量的赋值: 

$name="hello"

赋值的左边必须是一个变量或者是属性引用,右边可以是下面六种类型之一:

  1. 变量引用
  2. 字符串
  3. 属性引用
  4. 方法引用
  5. 数字
  6. 数组列表

下面的例子演示了上述的每种类型:

#set( $monkey = $bill ) ## variable reference(变量引用)

#set( $monkey.Friend = "monica" ) ## string(字符串)

#set( $monkey.Blame = $whitehouse.Leak ) ## property reference(属性引用)

#set( $monkey.Plan = $spindoctor.weave($web) ) ## method reference(方法引用)

#set( $monkey.Number = 123 ) ##number(数字)

#set( $monkey.Say = ["Not", $my, "fault"] ) ## ArrayList(数组列表)

注意:

① 如果上述例子中的右值是null, 则左值不会被赋值,也就是说会保留以前的值。

② velocity模板中未被定义的变量将被认为是一个字符串。例如:

#set($foo = "gibbous") 
$moon = $foo

输出结果为:

$moon = gibbous

③ velocity模板中不会将reference解释为对象的实例变量。例如:$foo.Name将被解释为Foo对象的getName()方法,而不是Foo对象的Name实例变量。例如:

$foo.getBar()  等同于$foo.Bar ;

$data.getUser("jon") 等同于$data.User("jon") ;

data.getRequest().getServerName() 等同于

$data.Request.ServerName等同于${data.Request.ServerName}

 

2. 循环

#foreach ($element in $list)
     $velocityCount 
     This is $element.
#end

例子:

#set( $list = ["pine", "oak", "maple"])
#foreach ($element in $list)
	$velocityCount
	This is $element.<br>
#end

输出的结果为:

1 This is pine. 
2 This is oak. 
3 This is maple.

每次循环$list中的一个值都会赋给$element变量。

$list可以是一个Vector、Hashtable、Array

分配给$element的值是一个java对象,并且可以通过变量被引用。例如:如果$element t是一个java的Product类,并且这个产品的名字可以通过调用他的getName()方法得到。

#foreach ( $key in $list.keySet())
	Key: $key -> Value: $list.get($key) <br>
#end

提示:velocity中大小写敏感

Velocity还特别提供了得到循环次数的方法,$velocityCount变量的名字是Velocity默认的名字。

例子:

First example:
  #foreach ( $foo in [1..5] )
    $foo
  #end

Second example:
  #foreach ( $bar in [2..-2] )
    $bar
  #end

Third example:
  #set ( $arr = [0..1] )
  #foreach ( $i in $arr )
    $i
  #end

上面三个例子的输出结果为:

  First example:
  1 2 3 4 5

  Second example:
  2 1 0 -1 -2

  Third example:
  0 1

 

3. 条件语句

#if (condition)

#elseif (condition)

#else

#end

 

4. 语句的嵌套推荐

#foreach ($element in $list)

   ## inner foreach 内循环
   #foreach ($element in $list)
   		This is $element. $velocityCount <br>inner<br>
   #end
   ## inner foreach 内循环结束

## outer foreach
	This is $element.
	$velocityCount <br>outer<br>
#end

语句中也可以嵌套其他的语句,如#if…#else…#end等。

 

5. 注释

(1)单行注释:
  ## This is a single line comment.

(2)多行注释:
  #*
   Thus begins a multi-line comment. Online visitors won’t
   see this text because the Velocity Templating Engine will
  ignore it.

  *#

(3)文档格式:
  #**
   This is a VTL comment block and
   may be used to store such information
  as the document author and versioning
   information:
   @version 1.1

   @author  xiao
     *#

 

6. 关系和逻辑操作符

Velocity 也具有 AND, OR ,  NOT 逻辑操作符

## example for AND

#if($foo && $bar)

   <strong> This AND that</strong>

#end

例子中#if() 指令仅在$foo 和$bar 都为真的时候才为真。如果$foo 为假,则表达式也为假;并且 $bar将不被求值。如果 $foo 为真,Velocity 模板引擎将继续检查$bar的值,如果 $bar 为真,则整个表达式为真。并且输出This AND that 。如果 $bar 为假,将没有输出因为整个表达式为假。

 

7. Velocity 宏

Velocity中的宏我们可以理解为函数。

①宏的定义

#macro(宏的名称 $参数1 $参数2 …)

   语句体(即函数体)

#end

②宏的调用

#宏的名称($参数1 $参数2 …)

       说明:参数之间用空格隔开。

 

8. #stop

停止执行模板引擎并返回,把它应用于debug是很有帮助的。

 

9. #include与#parse

#include和#parse的作用都是引入本地文件, 为了安全的原因,被引入的本地文件只能在TEMPLATE_ROOT目录下。

区别:

(1) 与#include不同的是,#parse只能指定单个对象。而#include可以有多个

如果您需要引入多个文件,可以用逗号分隔就行:
#include ("one.gif", "two.txt", "three.htm" )
在括号内可以是文件名,但是更多的时候是使用变量的:
#include ( “greetings.txt”, $seasonalstock )

 

(2) #include被引入文件的内容将不会通过模板引擎解析;

而#parse引入的文件内容Velocity将解析其中的velocity语法并移交给模板,意思就是说相当与把引入的文件copy到文件中。

#parse是可以递归调用的,例如:如果dofoo.vm包含如下行:

Count down.<br>
#set ($count = 8)
#parse ("parsefoo.vm")
<br>All done with dofoo.vm!

那么在 parsefoo.vm 模板中,你可以包含如下VTL:velocity tag laugane

$count
#set($count = $count - 1)
#if ( $count > 0 )<br>
#parse( "parsefoo.vm" )
#else
<br>All done with parsefoo.vm!
#end

显示结果为:

Count down.
8
7
6
5
4
3
2
1
0
All done with parsefoo.vm!

All done with dofoo.vm!

注意:在vm中使用#parse来嵌套另外一个vm时的变量共享问题。如:
->a.vm 里嵌套 b.vm(a.vm在外层,b.vm在内层);
->a.vm 里定义了变量 $param;
->b.vm 里可以直接使用$param,无任何限制。
但需要特别注意的是,如果b.vm里同时定义有变量$param,则b.vm里将使用b.vm里定义的值。

 

10. 转义字符'\'的使用

如果reference被定义,两个’\’意味着输出一个’\’,如果未被定义,刚按原样输出。如:

#set($email = "foo" )

$email

\$email

\\$email

\\\$email

输出:

foo
$email
\foo
\$email

如果$email 未定义

$email

\$email

\\$email

\\\$email

输出:

$email
\$email
\\$email
\\$email            (前面三个斜线,这里两个)

 

11. 内置对象

Velocity内置了一些对象,在vm模版里可以直接调用,列举如下:
$request、$response、$session

另外,模板内还可以使用 $msg内的消息工具访问 Struts 的国际化资源,达到简便实现国际化的方法。

 

12. 数组访问

对数组的访问在Velocity中存在问题,因为Velocity只能访问对象的方法,而数组又是一个特殊的Array,所以虽然数组可以进行循环列举,但却不能定位访问特定位置的元素,如 strs[2],数组对固定位置元素的访问调用了Array的反射方法get(Object array, int index),而Velocity没能提供这样的访问,所以数组要么改成List等其他类容器的方式来包装,要么就通过公用Util类的方式来提供,传入数组对象和要访问的位置参数,从而达到返回所需值的目的。

 

 

参考推荐

Spring+Velocity+Mybatis入门

Velocity布局(layout)功能介绍

原 Velocity入门指南——第一章 快速入门(系列教程)