更新记录

1.4(2019-11-22)

增加开钱箱,切刀切纸功能.

1.3(2019-09-27)

  1. 新增网关端口连接打印机

  2. 新增标签打印

  3. 新增 IOS 版本

查看更多

原生插件通用使用流程:

  1. 购买插件,选择该插件绑定的项目。
  2. 在HBuilderX里找到项目,在manifest的app原生插件配置中勾选模块,如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码,在代码中引用插件,调用插件功能。
  4. 打包自定义基座,选择插件,得到自定义基座,然后运行时选择自定义基座,进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://ask.dcloud.net.cn/article/35763
iOS 离线打包原生插件另见文档 https://ask.dcloud.net.cn/article/35764


Android 和 IOS 佳博小票 / 标签 打印机插件

1. 插件说明

一、实例化插件

const gp= uni.requireNativePlugin('Html5app-Gprinter'); 

2.本插件包含5个方法

方法名称 说明
BluetoothPort() 蓝牙连接打印机
connectIP() 网关端口连接打印机
Print() 打印小票 或 标签纸
PrinterState() 查询连接状态
Disconnect() 断开打印机连接

一、打开蓝牙搜索界面,搜索蓝牙打印机 ,setBackgroundColor:是蓝牙搜索界面头部背景颜色,默认为:蓝色 ,安卓有效.

gp.BluetoothPort({setBackgroundColor:"#2088d2"},result=>{

            result //返回值                
});

返回 JSON 格式 : {"state":"1","msg":"未连接"} 状态码

状态码 说明
0 已连接打印机,重新选择请先断开打印机
1 未连接
2 连接中
3 已连接
4 连接失败

二、网关端口连接打印机

//端口网络连接
let _this=this;
gp.connectIP({},result=>{   

    _this.title=JSON.stringify(result);
});

图片

3、查询打印器状态

gp.PrinterState(result=>{

result //返回值    

});

返回 JSON 格式 : {"state":"1","msg":"请先连接打印机!"} 状态码

4、断开打印机

gp.Disconnect(result=>{ 
result //返回值    

});

返回 JSON 格式 :{"state":"1","msg":"未连接"} ,这个代表已经断开。

图片

5、打印小票

 gp.Print({"ESC":data},result=>{

    result //返回值    

 });

参数是一个 数组包含JSON 格式的 小票打印数据,

6. 小票制作格式说明

首先,先定义一个数组, var data=[]; //定义一个数组, 数组主要为了装每一行的内容 var line={}; //定义一个JSON,用来生成每一行的内容

一共包含 单行文字,单行文字并排,图片,条型号,二维码 这几行打印。

例如:要创建一行文字

    //制作小票格式, 
    var data=[];  //定义一个数组
    var line={};  //每添加一个,代表一行字

    1.要创建一行文字
    line.text="万达广场销售单";  // 内容
    line.center="center";  // 文字居中方式:center=> 居中,left=> 靠左 ,right=> 靠右
    line.font="max"; //文属性:max=> 特大加粗字, normal=> 默认普通字 ,bold=> 普通加粗字,underline=> 带下巴线的字,underline|bold=>带下巴线且加粗字
    line.bottom="2"; //底部行距离
    data.push(line); //每添加一个,代表一行字

    line={}; //添加新行时,清空一下

    2. 创建一个并排的文字表格式

    line={};
    line.title=["数量:1", "单价:305", "金额:305"];  // 并排一起
    line.left=[0, 30, 60]; // 第一个是0不用改,第二参考对应上面第二参数,距离第一个参数的距离
    line.center="left";  // 文字居中方式:center=> 居中,left=> 靠左 ,right=> 靠右
    line.font="normal"; //文属性:max=> 特大加粗字, normal=> 默认普通字 ,bold=> 普通加粗字,underline=> 带下巴线的字,underline|bold=>带下巴线且加粗字
    line.bottom="2"; //底部行距离
    data.push(line); //每添加一个,代表一行字

    3. 创建一个图片行

    //加入图片
    line={};
    line.image="http://www.html5-app.com/gprinter.png"; //支持本地图片和 网络图片地址,PNG 格式黑白Logo图片
    line.width="350"; //图片宽度,高度默认随宽度变化
    line.center="center"; 
    line.bottom="2";
    data.push(line);

    4.创建一个条型码

    //加入条型码
    line={};
    line.barcode="2019563352660"; // 数据编号
    line.type="CODE128"; //条型码类型:CODE128,CODE93,CODE39,UPCA,UPCE,EAN13,EAN8,ITF
    line.height="100"; // 条型码高度
    line.position="BELOW"; //条型号编号是否显示: BELOW => 显示在条型码下方,ABOVE=> 显示在条型码上方,NO_PRINT=> 不显示
    line.width="2"; //条型宽度,这里的宽指的是 条型码 竖条的宽度,不是整个条型码的宽度
    line.center="center";
    line.bottom="2";
    data.push(line);

    5. 创建二维码
    line={};
    line.qrcode="www.html5-app.com"; //内容
    line.size="10"; //二维码大小
    line.center="center";
    line.bottom="0";
    data.push(line);

5、打印标签

 gp.Print({"TSC":data},result=>{

    result //返回值    

 });

6. 标签纸制作格式说明

TSC 指令代表标签打印, ESC 指令代表 小票打印

1.打印标签格式, 首先,先确定使用的标签纸规格,是多大的。

//制作标签格式, var data=[]; //定义一个数组 var line={}; //每添加一个,代表一个元素

2.设置标签纸大小 ,必填写

//设置标签纸大小, 80mmx55mm 纸大小
line={};
line.width=80; //单位mm 
line.height=55; //单位mm
line.gap=3; //标签纸之间,间隙长度 mm 
line.page=1; //打印几份
data.push(line); //这个配置只需添加一个即可。

3. 添加文字

line={};
line.text="HTML5+混合APP开发社区";
line.rotation=0; // 角度:有四个值:0,90,180,270
line.x=150; //横坐标,用于定位
line.y=20; //纵坐标, 用于定位
line.xscal=1; //横向加大,用于加大字体 :取值:1-10.
line.yscal=1; //纵向加大, 用于加大字体:取值:1-10.
data.push(line); //每添加一个,代表一元素

4.添加图片

line={};
line.image="http://www.html5-app.com/gprinter.png";
line.x=20;  //横坐标
line.y=20; //纵坐标
line.width=120; // 图片大小
data.push(line);

5.添加条型码

line={};
line.barcode="2019563352660";
line.x=20; //横坐标
line.y=140; //纵坐标
line.type="CODE128"; //条型码类型
line.height=100; //条型码高度
line.readable=true; //是否显示文字在条型下方
line.rotation=0;  // 角度:有四个值:0,90,180,270
data.push(line);

 6.加入二维码

line={};
line.qrcode="www.html5-app.com";
line.x=320; //横坐标
line.y=140; //纵坐标
line.width=6; //二维码大小
line.rotation=0;  // 角度:有四个值:0,90,180,270 
data.push(line);

这里的布局采用的是绝对定位, 从左上角0,0 开始计算,通过坐标把文字或图片或条型码二维码,放到相应的位置上。

7. IOS 版本需要设置蓝牙权限, 在配置文件 manifest.json 中 ios 项添加以下内容

 "ios" : {
     "privacyDescription" : {
         "NSBluetoothPeripheralUsageDescription" : "是否允许获取蓝牙用于连续打印机?"
     },
     "UIBackgroundModes" : ["bluetooth-central"]
 }

图片

扫一扫下载安卓DEMO 示例 体验

uniapp 原生插件如何使用,可以参考这个:https://ask.dcloud.net.cn/article/36106

详细使用参考,可以在本页面右上角=》 下载示例项目ZIP

隐私、权限及商业化声明

1. 本插件需要申请的手机端权限列表:

蓝牙

2. 本插件采集的手机端数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问