有个需求:蓝牙要显示二维码,需要得到二维码的位图(点阵图、矩阵图)。
实现思路:
1.获得canvas的二维码图片,要求为64px乘64px
2.获得二维码的图片,然后解析像素数组,获得像素的二进制状态码
3.将二进制状态码转化为byte数组,然后发送给蓝牙。
这里强调一点,draw方法和canvasGetImageData都是异步加载,需要通过promise来做等待处理。
首先,按照网上通用的二维码生成代码实现获得二维码矩阵,使用qrcode.js来获得。
核心代码为draw方法:
/**
* 新增$this参数,传入组件的this,兼容在组件中生成
*/
draw: function (str, canvas, cavW, cavH, $this) {
console.log("draw");
var that = this;
// ecclevel = ecc || ecclevel;
// console.log("ecclevel>>" + ecclevel);
canvas = canvas || _canvas;
if (!canvas) {
console.warn('No canvas provided to draw QR code in!')
return;
}
var size = Math.min(cavW, cavH);
str = that.utf16to8(str); //增加中文显示
var frame = that.getFrame(str),
// 组件中生成qrcode需要绑定this
ctx = wx.create