TreeviewCopyright © aleen42 all right reserved, powered by aleen42
蓝牙打印
一、创建页面
- 新建打印页面:页面建模 -> 新建页面 -> 选择空白页 -> 勾选移动端页面 -> 下一步 -> 填写基本属性 -> 完成
- 点击建好的页面进入移动端设计器,点击层级,在页面右键组件,最终效果如下图所示,点击保存。
- 将【多行文本框】的名称改为‘打印内容’
- 将【多行文本框】的控件高度改为20
- 将【按钮】的名称改为‘打印’
二、加入插件
- 层级 -> 选择页面 -> 动作绑定 -> 将 onShow 事件绑定前端函数 -> 编辑函数
- 将示例代码复制到编辑器中,修改下图红框内容,改为自己页面中多行文本框的编码
- 示例代码
function (event) {
var viewModel = this;
var script = document.createElement('script'); //添加的补丁js
script.type = 'text/javascript';
script.src = 'https://cdn.jsdelivr.net/gh/jiangzhenya110/images/mtl/mtl.js';
document.head.appendChild(script);
// 初始化打印模板
viewModel.get('1622703465557_8').setValue("\r\n" +
"=========== 购物清单 ===========\r\n" +
"物品 件数 单价\n" +
"猪肉 5 30\n" +
"土豆 1 5\n" +
"鸡蛋 15 0.5\r\n" +
"客户签字:___________________\r\n" +
"===============================\n" +
"\r\n");
}
三、编写打印代码
- 打印代码流程图
- 给打印按钮绑定点击事件,点击编辑函数,将下面示例代码复制其中,并修改红框内容,同样为多行文本框编码
- 示例代码
function(event) {
var viewModel = this;
connectState();
/**
* 获取蓝牙打印机连接状态
*/
function connectState() {
mtl.upesn.blueToothConnectState({
success: function(res) {
console.log('获取蓝牙连接状态成功:', res);
if (typeof deviceName != "undefined" && deviceName !== null &&
deviceName !== "" && deviceName.indexOf('DP-HT201') !== -1) { // 已连接
print();
} else { // 未连接
blueToothState();
}
},
fail: function(err) {
console.log('获取蓝牙连接状态失败:', err);
}
})
}
// 将logo图片转为base64编码,一定要把前缀"data:image/png;base64,"删除
var imgBase64 ="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";
/**
* 打印内容
*/
function print() {
var value = viewModel.get('1622703465557_8').getValue();
mtl.upesn.blueToothPrint({
// 打印页数
printNum: 1,
// 自定义打印内容
content: [
{
"type": "img",
"value": imgBase64
},
{
"type": "txt",
"value": value
},
{
"type": "txt",
"value": "\r\n\r\n"
}
],
success: function(res) {
console.log('打印成功:', res)
},
fail: function(err) {
console.log('打印失败:', err)
}
})
}
/**
* 获取蓝牙状态
*/
function blueToothState() {
mtl.upesn.getBlueToothState({
success: function(res) {
var state = res.state;
console.log('获取蓝牙状态成功:', state);
if (!state) {
console.log('未打开蓝牙');
alert('请打开蓝牙');
return;
}
scan();
},
fail: function(err) {
console.log('获取蓝牙状态失败:', err)
},
})
}
/**
* 扫描蓝牙设备
*/
function scan() {
mtl.upesn.blueToothScan({
registerFunc: function(res) {
console.log('扫描结果:', res);
if (res.peripheralArray.length > 0) {
var index = res.peripheralArray.length - 1;
var deviceName = res.peripheralArray[index].deviceName;
var deviceIndentify = res.peripheralArray[index].deviceIndentify;
console.log('扫描结果deviceName:', deviceName);
console.log('扫描结果deviceIndentify:', deviceIndentify);
if (typeof deviceName != "undefined" && deviceName !== null &&
deviceName !== "" && deviceName.indexOf('DP-HT201') !== -1) { //扫描到设备
connect(deviceName, deviceIndentify);
}
}
},
success: function(res) {
console.log('扫描成功:', res);
},
fail: function(err) {
console.log('扫描失败:', err)
}
})
}
/**
* 连接蓝牙打印机
*/
function connect(deviceName, deviceIndentify) {
mtl.upesn.blueToothConnect({
deviceIndentify: deviceIndentify, //'9F186DEC-1368-3394-D704-0A9AC0767188'
deviceName: deviceName, //'DP-HT201-4'
success: function(res) {
console.log('连接成功:', res)
// 打印
print();
// 停止扫描
stopScan();
},
fail: function(err) {
console.log('连接失败:', err)
}
});
}
/**
* 停止扫描
*/
function stopScan() {
mtl.upesn.blueToothStopScan({
success: function(res) {
console.log('停止扫描成功:', res)
},
fail: function(err) {
console.log('停止扫描失败', err)
}
});
}
}
四、测试预览
全部修改完成后,切记点击此处右上角的保存按钮,然后点击预览,即可出现预览界面,可以选择普通或者调试模式,使用友空间扫码,点击蓝牙打印按钮即可。
注意:
- 只能通过手机调试,电脑无法识别蓝牙设备
- 必须通过友空间扫码,因为原生插件基于手机友空间开发
- 打印机长按'mode'按钮,红灯亮、滴一声为开机
- 打印机指示灯为下图紫色状为已连接成功