Velocity魔法堂系列一:入门示例

简介:

一、前言                          

  Velocity作为历史悠久的模板引擎不单单可以替代JSP作为Java Web的服务端网页模板引擎,而且可以作为普通文本的模板引擎来增强服务端程序文本处理能力。而且Velocity被移植到不同的平台上,如.Net的NVelocity和js的Velocity.js,虽然各平台在使用和实现上略有差别,但大部分语法和引擎核心的实现是一致的,因此学习成本降低不少哦。

  最好的学习资源——官网:http://velocity.apache.org/

  本系列打算采用如下结构对Velocity进行较为全面的学习,若有不妥或欠缺望大家提出,谢谢。

  1. 入门示例

  2. VTL语法详解

  3. 模板与宿主环境通信

  4. 基础配置项

  5. 深入模板引擎及调优配置

 

二、入门示例                        

  示例结果是生成如下的html表单:

复制代码
<form action="./submit">
<div>
  <label for="title">标题:</label>
  <input type="text" id="title" name="title"/>
</div>
<div>
  <label for="brief">摘要:</label>
  <input type="text" id="brief" name="brief"/>
</div>
<div>
  <label for="sex">性别:</label>
  <select id="sex" name="sex">
    <option value="0">男</option>
    <option value="1">女</option>
  </select>
</div>
<div>
  <label for="job">职业:</label>
  <select id="job" name="job">
    <option value="0">Java工程师</option>
    <option value="1">Net工程师</option>
  </select>
</div>
</form>
复制代码

   引入依赖项——velocity-1.7-dep.jar

   模板文件frm.vm

复制代码
##表单模板
##@author fsjohnhuang
##@version 1.0
## 引入外部模板文件
#parse('macro.vm')
## 主逻辑
<form action="$action">
#foreach($input in $inputs)
#input($input.title $input.id)
#end
#foreach($select in $selects)
#select($select.title $select.id $select.items)
#end
</form>
复制代码

   模板文件macro.vm

复制代码
## 生成input表单元素区域的宏
#macro(input $title $id)
<div>
  <label for="$id">$title</label>
  <input type="text" id="$id" name="$id"/>
</div>
#end
## 生成select表单元素区域的宏
#macro(select $title $id $items)
<div>
  <label for="$id">$title</label>
  <select id="$id" name="$id">
## VTL指令紧贴左侧才能确保结果的排版正常(不会有多余空格)
#foreach($key in $items.keySet())
    <option value="$key">$items.get($key)</option>
#end
  </select>
</div>
#end
复制代码

   Java代码:

复制代码
public static void main(String[] args) {
        // 初始化模板引擎
        Properties props = new Properties();
        props.put("file.resource.loader.path", ".\\vm");
        VelocityEngine ve = new VelocityEngine(props);
        // 配置引擎上下文对象
        VelocityContext ctx = new VelocityContext();
        ctx.put("action", "./submit");
        ArrayList<HashMap<String, String>> inputs = new ArrayList<HashMap<String,String>>();
        HashMap<String, String> input1 = new HashMap<String, String>();
        input1.put("id", "title");
        input1.put("title", "标题:");
        inputs.add(input1);
        HashMap<String, String> input2 = new HashMap<String, String>();
        input2.put("id", "brief");
        input2.put("title", "摘要:");
        inputs.add(input2);
        ctx.put("inputs", inputs);
        ArrayList<HashMap<String, Object>> selects = new ArrayList<HashMap<String,Object>>();
        HashMap<String, Object> select1 = new HashMap<String, Object>();
        selects.add(select1);
        select1.put("id", "sex");
        select1.put("title", "性别:");
        HashMap<Integer, String> kv1 = new HashMap<Integer, String>();
        kv1.put(0, "");
        kv1.put(1, "");
        select1.put("items", kv1);
        HashMap<String, Object> select2 = new HashMap<String, Object>();
        selects.add(select2);
        select2.put("id", "job");
        select2.put("title", "职业:");
        HashMap<Integer, String> kv2 = new HashMap<Integer, String>();
        kv2.put(0, "Java工程师");
        kv2.put(1, "Net工程师");
        select2.put("items", kv2);
        ctx.put("selects", selects);
        // 加载模板文件
        Template t = ve.getTemplate("test.vm");
        StringWriter sw = new StringWriter();
        // 渲染模板
        t.merge(ctx, sw);
        System.out.print(sw.toString());
    }
复制代码

 Velocity模板引擎使用时的关注点分别为以外部文件形式存在的Velocity模板Java代码调用

 Velocity模板由VTL(Velocity Template Language)引擎上下文对象构成;Java代码调用部分则负责初始Velocity引擎构建引擎上下文对象加载Velocity模板启动模版渲染。而Velocity模板与Java代码调用部分通信的纽带就是引擎上下文对象了。

 

三、总结                              

 现在我们对Velocity引擎应该有个大概的了解,后续内容将对上述内容逐一深入。

 尊重原创,转载请注明来自:http://www.cnblogs.com/fsjohnhuang/p/4112328.html  ^_^肥仔John

 吐槽:倘若对文本的排版有强烈的要求,那么Velocity就不是最佳选择了。

 如上述示例,若想改成如下格式就要重新设计模板形式了:

复制代码
<form action="./submit">
  <div>
    .................
  </div>
  <div>
    .................
  </div>
  <div>
    .................
  </div>
  <div>
    .................
  </div>
</form>
复制代码

如果您觉得本文的内容有趣就扫一下吧!捐赠互勉!

分类: Velocity
2
0
« 上一篇: Java魔法堂:深入正则表达式API
» 下一篇: Velocity魔法堂系列二:VTL语法详解
posted @ 2014-11-21 14:26 ^_^肥仔John 阅读( 7777) 评论( 4) 编辑 收藏
  
#1楼 2015-08-26 10:47 张听听  
为什么说我找不到marco.vm?? 哭...
  
#2楼 2015-12-02 21:34 stanxu  
你好,请问
Template t = ve.getTemplate("test.vm"); 中的“test.vm"文件指的是哪个?
  
#3楼 2015-12-02 21:56 stanxu  
楼主的
props.put("file.resource.loader.path", ".\\vm");
这行代码有误,应改为:props.put("file.resource.loader.class","org.apache.velocity.runtime.resource.loader.ClasspathResourceLoader");
  
#4楼 2015-12-02 21:57 stanxu  
@ 张听听
把.vm文件放在src目录下,试试
相关文章
|
定位技术
Echarts实战案例代码(10):echarts结合世界所有国家地图数据集geojson的(英文翻译映射)解决方案
Echarts实战案例代码(10):echarts结合世界所有国家地图数据集geojson的(英文翻译映射)解决方案
680 0
Echarts实战案例代码(10):echarts结合世界所有国家地图数据集geojson的(英文翻译映射)解决方案
|
4月前
|
JSON 前端开发 数据格式
Cesium案例解析(十)——CZML点
Cesium案例解析(十)——CZML点
90 0
|
Java
Velocity简明教程(1)
Velocity简明教程(1)
258 0
|
7月前
|
人工智能 前端开发 JavaScript
BS-PT-108 基于Springboot+Vue大学生英语在线学习平台
本项目基于Springboot和Vue开发实现一个前后端分离的英语在线学习网站。系统分为四类用户角色:游客、学生、教师、管理员。游客进入系统可以进行相应信息查看和不记名学习。学生注册登录后可以在线查看英语学习视频、查看相关学习用书、在线交流论坛、在线进行专项测试、查看各类英语范文、个人中心等,个人中心可以查看自己的收藏记录、专题测试记录、错题本、论坛发言记录等相关信息。老师的账户由管理员分配,可以在线发布相关视频、书籍、专题测试等。管理员可以对所有的信息进行相应的管理操作,具体看下面展示。
119 1
|
前端开发
前端项目实战玖拾玖react-admin+material ui-踩坑-List的用法之filters解决过滤的问题
前端项目实战玖拾玖react-admin+material ui-踩坑-List的用法之filters解决过滤的问题
130 0
|
前端开发
前端项目实战玖拾柒react-admin+material ui-踩坑-List的用法之emptyWhileLoading来解决数据未定义的问题
前端项目实战玖拾柒react-admin+material ui-踩坑-List的用法之emptyWhileLoading来解决数据未定义的问题
90 0
|
移动开发 定位技术 HTML5
|
移动开发 JSON JavaScript
百度地图(HTML5新特性)-全面详解(学习总结---从入门到深化)(上)
百度地图提供了一套由JavaScript语言编写的应用程序接口,该套接 口目前最新版本为 JavaScript API GL v1.0 。
370 0
百度地图(HTML5新特性)-全面详解(学习总结---从入门到深化)(上)
|
存储 小程序 JavaScript
Sophomore Year Optional Course:Web 开发实践——小程序标点地图
选修课大作业:开发一款地图微信小程序。
141 0
Sophomore Year Optional Course:Web 开发实践——小程序标点地图
|
Web App开发 移动开发 JavaScript
WebComponent魔法堂:深究Custom Element 之 标准构建
前言  通过《WebComponent魔法堂:深究Custom Element 之 面向痛点编程》,我们明白到其实Custom Element并不是什么新东西,我们甚至可以在IE5.5上定义自己的alert元素。
1560 0