前端js,uniapp使用printease连接打印机打印,打印命令生成

接下来我们将使用printease实现前端js,uniapp打印。

此外,连接打印机的方式有很多种,这里并不会涉及到,该库只是提供了一种打印机指令的生成方式,你可以将生成的指令发送到打印机,打印机会执行一次印刷过程。

这个教程是关于tspl指令的,如果你使用的其他指令,可以提出issue,我们会尽快更新。

文档地址

参考文档地址

下载

bash 复制代码
npm install printease

使用教程

使用下面命令打印一个内容hello, printease!

打印文本

js 复制代码
import printsea from 'printsea'
let tspl = new printsea.tspl.TsplLib()
tspl.init()
tspl.setSize(60, 40)
tspl.setGap(0, 0)
tspl.setCls()
tspl.setText(50,50,'3',0,1,1,'Hello, Printease!')
tspl.setPrint(1)
console.log(tspl.getBuffer())

可以看到我们使用了``tspl.getBuffer()```来获取一段缓冲区数据,需要连接到打印机,然后将缓冲区内容发送到打印机,打印机会执行一次 印刷过程。

打印条码

js 复制代码
import printsea from 'printsea'
let tspl = new printsea.tspl.TsplLib()
tspl.init()
tspl.setSize(60, 40)
tspl.setGap(0, 0)
tspl.setCls()
tspl.setBarCode(10, 10, '39', 100, 1, 0, 2, 4, '123456789')
tspl.setPrint(1)
console.log(tspl.getBuffer())

打印二维码

js 复制代码
import printsea from 'printsea'
let tspl = new printsea.tspl.TsplLib()
tspl.init()
tspl.setSize(60, 40)
tspl.setGap(0, 0)
tspl.setCls()
tspl.setQRCode(10, 10, 'L', 5, 'A', 0, '123456789')
tspl.setPrint(1)
console.log(tspl.getBuffer())

打印图片

js 复制代码
import printsea from 'printsea'
let imageData = [0, 0, 0, 0, 0, 0, 7, 255, 3, 255, 17, 255, 24, 255, 28, 127, 30, 63, 31, 31, 31, 143, 31, 199, 31, 227, 31, 231, 31, 255, 31, 255]
let tspl = new printsea.tspl.TsplLib()
tspl.init()
tspl.setSize(60, 40)
tspl.setGap(0, 0)
tspl.setCls()
tspl.setBitmap(200, 200, 16, 16, 0, imageData)
tspl.setPrint(1)
console.log(tspl.getBuffer())

如果你不想自己组织图像数据,可以使用``imagePixelInformation```进行处理,如下所示:

js 复制代码
import printsea from 'printsea'
import img from './test.png'
let ctx = new printsea.imagePixelInformation.JavaScriptImagePixelInformation(100);
ctx.getImageData(img,200,300,(res)=>{
    let tspl = new printsea.tspl.TsplLib()
    tspl.init()
    tspl.setSize(60, 40)
    tspl.setGap(0, 0)
    tspl.setCls()
    tspl.setBitmap(10, 10, res.width, res.height, 0, res.data)
    tspl.setPrint(1)
    console.log(tspl.getBuffer())
})

如果您使用uniapp,请使用UniappImagePixelInformation```的uniGetImageData方法。 例如: ctx.uniGetImageData('myCanvas','./test.png',200,300,(res)=>{})```

js 复制代码
let ctx = new printsea.imagePixelInformation.UniappImagePixelInformation(100);
ctx.uniGetImageData('myCanvas',img,200,300,()=>{
    // ...
})

需要注意的是:由于uniapp的一些限制,您需要提前创建画布。 另外,画布的宽度和高度应设置为大于要打印图形的宽度和高度

设置编码

编码默认是utf-8,如果产生中文乱码,可以设置编码为GB18030,当然,也可以设置为其他编码。

js 复制代码
import printsea from 'printsea'
let tspl = new printease.tspl.TsplLib()
tspl.init()
tspl.setEncoding('GB18030')
tspl.setSize(60, 40)
tspl.setGap(3, 0)
tspl.setCls()
tspl.setText(10, 10, 'TSS24.BF2', 0, 1, 1, '世界你好')
tspl.setPrint(1)
console.log(tspl.getBuffer())

如果使用过程中遇到问题,可以在github上提issue,或者加入q群。

相关推荐
lUie INGA30 分钟前
rust web框架actix和axum比较
前端·人工智能·rust
OPHKVPS1 小时前
VoidStealer新型窃密攻击:首例利用硬件断点绕过Chrome ABE防护,精准窃取v20_master_key
前端·chrome
月光宝盒造梦师1 小时前
Ant Design Ellipsis 中的判断逻辑 isEleEllipsis 方法非常消耗性能
javascript·react·优化
gechunlian881 小时前
SpringBoot3+Springdoc:v3api-docs可以访问,html无法访问的解决方法
前端·html
驾驭人生2 小时前
ASP.NET Core 实现 SSE 服务器推送|生产级实战教程(含跨域 / Nginx / 前端完整代码)
服务器·前端·nginx
酉鬼女又兒2 小时前
零基础快速入门前端ES6 核心特性详解:Set 数据结构与对象增强写法(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·javascript·职场和发展·蓝桥杯·es6
慧一居士2 小时前
Vue项目中,子组件调用父组件方法示例,以及如何传值示例,对比使用插槽和不使用插槽区别
前端·vue.js
我是伪码农3 小时前
HTML和CSS复习
前端·css·html
林恒smileZAZ3 小时前
前端实现进度条
前端
前端老石人3 小时前
邂逅前端开发:从基础到实践的全景指南
开发语言·前端·html