手把手教你WEB套打程序开发
WEB套打可选方案不多,理想的更少,利用免费控件Lodop+JavaScript实现精确套打,算是较为经典的选择。这种方案其实比较简单,利用一个htm文件就可以实现模板设计过程,几乎是“空手套”式的开发,但理解这几个步骤还是需要点时间,下面一步步详细演示说明:
第一步:建立一个空白的模板设计文件
把以下超文本代码复制到一个本地htm文件中:
![](/assets/blank.gif)
<html> <body> <object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0></object> <script language="javascript" type="text/javascript">function CreatePrintPage() {LODOP.PRINT_INIT("套打EMS的模板");}; </script> 进入<a href="javascript:;" οnclick="javascript:CreatePrintPage();LODOP.PRINT_DESIGN();">模板设计</a><br><br> 进入<a href="javascript:;" οnclick="javascript:CreatePrintPage();LODOP.PREVIEW();">模板的打印预览</a> </body> </html>
![](/assets/blank.gif)
本文模拟EMS特快专递单的程序开发,文件起名为printEMS.htm,权且称它为模板设计文件。
第二步:用浏览器打开该文件
在本地文件夹中双击该文件就可以打开,但在进入设计之前,你的机器需要安装Lodop,如果还没安装过,
请在如下地址下载安装文件(解压rar后运行那个exe文件,Lodop是一个1M左右的小文件):
http://mt.runon.cn/samples/install_lodop.rar
或 http://mtsoftware.v053.gokao.net/samples/install_lodop.rar
第三步:准备设计
成功安装Lodop之后再次打开模板设计文件printEMS.htm,点击其中“模板设计”链接,就弹出如下空白的打印设计窗口:
为了尽快定位模板中的数据位置,你需要做一张票据扫描图作为背景,当然没有扫描图也能完成,只是需要多摸索几次,费点时间而已。
下面是我做的EMS扫描图,你把该图另存成一个jpg文件,以便我们一起完成后面的演示步骤。
第四步:装载背景图并调整图片大小
在打印设计窗口,点下图所示的“装载背景图...”菜单,调入以上保存的EMS图片文件。
装载背景图后,点上图所示的“调整背景图...”菜单,弹出下图“背景图调整”窗口,设定其中的图片宽度为209mm,高度113mm会自动变化。
这个宽度值是我测量实际票据得来的。如果扫描图是按1:1比例获得的,那么调整背景图这一步就免了。
第五步:添加数据内容,开始打印测试
点下图所示“插入文本项”菜单,添加打印内容,内容项可以拖拉或精细调整,基本对准之后,点击“预览”按钮(注意旁边的“打印”按钮是收费功能,纸上会有水印,而“预览时的打印”按钮是完全免费的,我们用后者)。
把内容打印到薄一点的白纸上,然后在阳光下与真实票据透亮对比,以最左最上的某个内容为基准,其它内容远近调整,如此反复测试直到所有内容相互位置都对准。
这一步先做到内容之间的相互位置对准,等下一步处理整体位置。
第六步:整体对准
由于打印机左边距或上边距不一定是零或票据边缘有误差,所以尽管第五步打印出来的内容相互之间位置是准确的,但打印到真实票据上仍会整体偏离一些,需要进行整体位置调整。
点击下图红圈所示的“纸钉”按钮,“纸钉”弹起后,整个设计版面就可以上下左右调整了,然后按上一步的办法打印测试,直到整体对准成功。为了避免浪费票据,打印时仍可用薄白纸测试,注意此时透光对照时,纸张的左边沿和上边沿要与票据对齐,通过观察内容的位置来判断是否整体对准。
第七步:生成打印模板的程序代码
套打测试成功后,点击第五步图中所示的“生成程序代码”菜单,出现下图结果,这些代码就是我们需要的模板程序代码,把他们复制出来,准备融合到你的页面程序中使用。
第八步:完成打印模板设计文件
想不想知道WEB套打有啥感觉?好,我们先做一个静态WEB页面爽一下:把第七步生成的程序代码,
插入替换第一步的空白设计文件CreatePrintPage函数内,变成如下内容:
![](/assets/blank.gif)
<html> <body> <object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0></object> <script language="javascript" type="text/javascript">function CreatePrintPage() {LODOP.PRINT_INITA(14,11,800,600,"套打EMS的模板");LODOP.ADD_PRINT_TEXT(95,95,75,20,"寄件人姓名");LODOP.ADD_PRINT_TEXT(123,148,194,20,"寄件人单位名称");LODOP.ADD_PRINT_TEXT(158,101,238,35,"寄件人的详细地址");LODOP.ADD_PRINT_TEXT(92,446,75,20,"收件人姓名");LODOP.ADD_PRINT_TEXT(122,496,208,20,"收件人单位名称");LODOP.ADD_PRINT_TEXT(160,460,244,35,"收件人详细地址");LODOP.ADD_PRINT_TEXT(289,47,178,22,"内件品名");LODOP.ADD_PRINT_TEXT(290,258,100,20,"内件数量");LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人电话");LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人电话");}; </script> 进入<a href="javascript:;" οnclick="javascript:CreatePrintPage();LODOP.PRINT_DESIGN();">模板设计</a><br><br> 进入<a href="javascript:;" οnclick="javascript:CreatePrintPage();LODOP.PREVIEW();">模板的打印预览</a> </body> </html>
![](/assets/blank.gif)
把以上内容复制到另外一个htm文件printEMS_OK.htm中,双击打开它,点其中的打印预览,就可以实现简单的WEB套打了。
以上八步基本完成了模板设计,并实现静态页面套打,但要把模板代码融合到实际的WEB程序中,还需要做些工作。
第九步:模板程序代码的使用
把以上CreatePrintPage函数进行简单改造,原函数如下:
![](/assets/blank.gif)
function CreatePrintPage() {LODOP.PRINT_INITA(14,11,800,600,"套打EMS的模板");LODOP.ADD_PRINT_TEXT(95,95,75,20,"寄件人姓名");LODOP.ADD_PRINT_TEXT(123,148,194,20,"寄件人单位名称");LODOP.ADD_PRINT_TEXT(158,101,238,35,"寄件人的详细地址");LODOP.ADD_PRINT_TEXT(92,446,75,20,"收件人姓名");LODOP.ADD_PRINT_TEXT(122,496,208,20,"收件人单位名称");LODOP.ADD_PRINT_TEXT(160,460,244,35,"收件人详细地址");LODOP.ADD_PRINT_TEXT(289,47,178,22,"内件品名");LODOP.ADD_PRINT_TEXT(290,258,100,20,"内件数量");LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人电话");LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人电话"); };
![](/assets/blank.gif)
把其中的打印内容提出来做为变量参数,函数改成如下样式:
![](/assets/blank.gif)
function CreatePrintPage(strPName,strJJRXM,strJJRDW,strJJRDZ,strSJRXM,strSJRDW,strSJRDZ,strNJPM,strNJSL,strJJRDH,strSJRDH) {LODOP.PRINT_INITA(14,11,800,600,strPName); //打印任务名LODOP.ADD_PRINT_TEXT(95,95,75,20,strJJRXM); //寄件人姓名LODOP.ADD_PRINT_TEXT(123,148,194,20,strJJRDW); //寄件人单位名称LODOP.ADD_PRINT_TEXT(158,101,238,35,strJJRDZ); //寄件人的详细地址LODOP.ADD_PRINT_TEXT(92,446,75,20,strSJRXM); //收件人姓名LODOP.ADD_PRINT_TEXT(122,496,208,20,strSJRDW); //收件人单位名称LODOP.ADD_PRINT_TEXT(160,460,244,35,strSJRDZ); //收件人详细地址LODOP.ADD_PRINT_TEXT(289,47,178,22,strNJPM); //内件品名LODOP.ADD_PRINT_TEXT(290,258,100,20,strNJSL); //内件数量LODOP.ADD_PRINT_TEXT(92,245,100,20,strJJRDH); //寄件人电话LODOP.ADD_PRINT_TEXT(90,608,75,20,strSJRDH); //收件人电话 };
![](/assets/blank.gif)
这个改造后的JS函数还是很好理解的,无论写入js文件还是直接嵌在页面内都简单易用。
如果你改变了内容的字体、大小、粗斜体等格式,代码还会多一些,但总体来说比较简洁。
第十步:设置纸张高度,实现连续套打
多数套打业务的票据是连续纸,需要精确地分页,从而保证连续多页打印不偏移,
为此以上代码还要在PRINT_INITA之后加一行SET_PRINT_PAGESIZE语句:
![](/assets/blank.gif)
function CreatePrintPage() {LODOP.PRINT_INITA(14,11,800,600,"套打EMS的模板");LODOP.SET_PRINT_PAGESIZE(1,"209mm","113mm","");//设置纸张高度LODOP.ADD_PRINT_TEXT(95,95,75,20,"寄件人姓名");LODOP.ADD_PRINT_TEXT(123,148,194,20,"寄件人单位名称");LODOP.ADD_PRINT_TEXT(158,101,238,35,"寄件人的详细地址");LODOP.ADD_PRINT_TEXT(92,446,75,20,"收件人姓名");LODOP.ADD_PRINT_TEXT(122,496,208,20,"收件人单位名称");LODOP.ADD_PRINT_TEXT(160,460,244,35,"收件人详细地址");LODOP.ADD_PRINT_TEXT(289,47,178,22,"内件品名");LODOP.ADD_PRINT_TEXT(290,258,100,20,"内件数量");LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人电话");LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人电话"); };
![](/assets/blank.gif)
其中209mm这个纸宽参数意义不大,主要是113mm这个高度参数,它决定了每页的走纸距离,对连续打印影响很大。这个值是我测量实际票据高度得来的,包含纸张之间的撕孔间隙。理想的测量方式,是若干页连起来一起测量取其平均高。
加入纸高控制后的打印预览如下,你可以连续打印两页内容到同一张长一点的白纸上,测试对照一下看看。把以上加入SET_PRINT_PAGESIZE语句的代码复制进第三个htm文件printEMS_OKM.htm试试。假如从第二页开始,内容向下偏移,说明纸张高度设置比实际票据大,就减小113mm这个参数值,否则增大它,这个参数可以精确到0.1mm。
第十一步:让操作者自己调整位置
以上十步实现的套打可以很精确,但都是以当前打印机为前提。如果你的打印程序要面对许多种类型的打印机,甚至一些未知的打印机类型,那么“打印维护”功能会很有用处。你可以根据情况在程序中把该功能授权给最终操作者或现场技术维护人员,让使用者自己来调整打印位置,以适应各种类型的打印机。
打印维护的指令语句是PRINT_SETUP,进入包含该功能的在线文件PrintEMS_OKMSetup.htm,先在打印维护中调整一下打印内容或整体位置,点“应用”按钮。关闭浏览器后重新打开,进入“打印预览”,看看是否有关联变化。下图是打印维护界面,其中能看到“应用”按钮和“恢复整体缺省”按钮的位置。
转:http://blog.sina.com.cn/s/blog_721e77e50100ng1o.html
今天帮朋友使用LODOP实现一个套打程序时,发现LODOP打印插件在chrome下始终无法使用。分析后发现是自己才升级了chrome,chrome新版默认是禁用npapi的,因此需要手动启用一下,启用方法如下:
chrome://flags/#enable-npapi
手把手教你WEB套打程序开发相关推荐
- 手把手教你进行微信小程序开发案例1---计算器
由于之前的文章中已经教会了大家如何注册自己的一个微信小程序,并且利用微信开发工具进行小程序的开发,所以这里不再介绍如何下载工具和注册账号,不懂的小伙伴们可以观看我之前发过的教程哦. #####下面我将 ...
- 实例:用C#.NET手把手教你做微信公众号开发(20)--使用微信支付线上收款:jsapi方式
在做线上.线下销售时,可以使用微信便捷支付,通过微信公众号收款有很多种收款方式,如下图: 今天我们来讲一下jsapi支付,场景就是在微信内打开某个页面,完成在线支付,同样一个网页,使用微信打开就是js ...
- Flutter教程之Windows桌面应用程序开发
Flutter教程之Windows桌面应用程序开发 一.前言 二.环境安装 三.创建项目 四.已有项目添加其他平台支持 一.前言 Flutter 是 Google 开源的 UI 工具包,帮助开发者通过 ...
- 手把手教你iPhone 3G手机软件开发
手把手教你iPhone 3G手机软件开发 "iPhone 是一款革命性的.不可思议的产品,比市场上其它任何移动电话整整领先了五年,"苹果公司首席执行官史蒂夫·乔布斯如是说,&quo ...
- 正点原子linux驱动教程,正点原子 手把手教你学Linux之驱动开发篇
简 介 该课程是正点原子手把手教你学Linux系列课程,该课程配套开发板为正点原子alpha/mini Linux开发板. 手把手教你学Linux之驱动开发篇: 第1讲 Linux驱动开发与裸机开发区 ...
- 实例:用C#.NET手把手教你做微信公众号开发(21)--使用微信支付线上收款:H5方式
在做线上.线下销售时,可以使用微信便捷支付,通过微信公众号收款有很多种收款方式,如下图: 今天我们来讲一下H5场景支付,使用手机浏览器打开就是H5方式,最常见的推广是短信内置链接,这种场景需要调用微信 ...
- 16w行的nginx源码,如何分拆模块阅读,手把手教你造轮子丨Nginx模块开发丨C/C++丨Linux服务器开发丨后端开发
16w行的nginx源码,如何分拆模块阅读,让你明白轮子如何造 1. 多进程模型下的惊群处理 2. 内存池的代码封装 3. slab共享内存分配 视频讲解如下,点击观看: 16w行的nginx源码, ...
- Web微信小程序开发(一)
微信作为一种通讯工具的使用可以说是越来越频繁了,随之兴起的也有很多,比如服务号,小程序,但是似乎小程序更能符合大众的心意,在面临着越来越多的APP的普及,大家更多的是希望手机上的APP能越来越少 所以 ...
- 手把手教你实现一个IAP程序
从裸机到嵌入式Linux--手把手教你实现一个IAP程序 什么是IAP IAP实现过程分析 内存分布及划分 IAP更新过程分析 使用方法 什么是IAP 简单讲IAP就是一个用于应用更新的程序,常见于物 ...
最新文章
- 玩不转大数据就别勉强了,或许“小数据”才是真正的终南捷径
- linux下编译动态和静态链接库
- [转]SAP ABAP中使用Read_Text函数读取项目文本的方法
- python第五次作业——陈灵院
- php连接数据库输出的中文几个字就…
- java国际化——Locale+数字格式
- 显示计算机硬盘驱动器更改,计算机更换硬盘驱动器后蓝屏发生了什么
- java 反射 获取方法列表_Java 反射获取类详细信息的常用方法汇总
- 进制转换演示及其Python示例
- Echarts异步获取数据不显示问题
- 每日新闻丨英特尔公布未来10年技术路线图;微软下月起终止支持Windows 7
- 基础教学 | 什么是负载均衡?
- [论文解读 IJCAI 19] LogAnomaly Unsupervised Detection of Sequential and Quantitative Anomalies
- typora定制主题分享--绿豆沙背景主题+新night背景主题
- android课程设计健身,健身软件课程设计-毕业论文.doc
- 想说说关于在刷题网站(牛客 、C语言网、力扣)上测试样例过了但是OJ判错这档子事
- iphone6 因为充电线电压不稳,产生的错乱现象
- ArcGIS中将一个shp图层批量分割成单个的shp;shp批量转geojson
- Js二代身份证号码正则验证
- HaaS EDU场景式应用学习 - 分歧争端机
热门文章
- 深入浅出Attribute (转载)
- Drupal 自定义主题实体 Theming Custom Entities
- smarty中section的使用
- linux shutdown 命令 关机 重启
- [Swift]数组排序:sort和sorted
- 【springboot】之 解析@EnableWebMvc 、WebMvcConfigurationSupport和WebMvcConfigurationAdapter
- bzoj1051 [HAOI2006]受欢迎的牛 tarjan缩点
- jquery通过ajax向后台发送(checkbox)数组,并在后台接收,(发送的数据是checkedbox)...
- Android分渠道打包(Python 3.4 实现)
- 大页内存(HugePages)