Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

关于二维码绘制范围和白边的问题 #25

Open
yhl714387953 opened this issue May 9, 2019 · 1 comment
Open

关于二维码绘制范围和白边的问题 #25

yhl714387953 opened this issue May 9, 2019 · 1 comment

Comments

@yhl714387953
Copy link

我自己改了下绘制的方法,不知道这样会不会有问题,目前在iOS设备上还行。就是确定下二维码的区域,然后把画布上的这个区域给生成一张图片使用,这样就没有白边了。
/**
* 新增$this参数,传入组件的this,兼容在组件中生成
*/
draw: function (str, canvas, cavW, cavH, $this, ecc) {
var that = this;
ecclevel = ecc || 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.createCanvasContext(canvas, $this),
    px = Math.round(size / (width + 8));
  var roundedSize = px * (width + 8),
    offset = Math.floor((size - roundedSize) / 2);
  size = roundedSize;
  //ctx.clearRect(0, 0, cavW, cavW);
  ctx.setFillStyle('#ffffff')
  ctx.fillRect(0, 0, cavW, cavW);//底部区域绘制,注释掉择不绘制底色
  ctx.setFillStyle('#000000');

  var minX = cavW;
  var minY = cavH;
  var maxX = 0;
  var maxY = 0;
  for (var i = 0; i < width; i++) {
    for (var j = 0; j < width; j++) {
      if (frame[j * width + i]) {
        ctx.fillRect(px * (4 + i) + offset, px * (4 + j) + offset, px, px);

        if (px * (4 + i) + offset < minX){
          minX = px * (4 + i) + offset
        }

        if (px * (4 + j) + offset < minY) {
          minY = px * (4 + j) + offset
        }

        if (px * (4 + i) + offset > maxX) {
          maxX = px * (4 + i) + offset
        }

        if (px * (4 + j) + offset > maxY) {
          maxY = px * (4 + j) + offset
        }

      }
    }
  }
  ctx.draw();

  var area = { minX: minX, minY: minY, maxX: maxX + px, maxY: maxY + px }
  
  return area
}
@jianghao123ok
Copy link

白色padding的距离是算出来然后输出图片的时候裁剪掉么

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants