收藏
回答

小程序条形码需要竖状的,canvas不能旋转?

小程序条形码用的是barcode插件,生成如下:


但最近有个需求要求是全屏的,如下图:


本来以为生成后,用css动画旋转90度即可,但是小程序组件canvas不支持动画,暂时也没其他办法了。问下大家有好的解决方案吗?

回答关注问题邀请回答
收藏

3 个回答

  • 吕
    2019-11-27

    对插件的方法进行旋转修改:ctx.translate(width/2, 0)

    ctx.rotate(90 * Math.PI / 180);

    然后将g的宽高和条码密度barweight进行改变:

    var g = new Graphics(ctx, height, width);

    var barWeight = g.area.height / ((codes.length - 3) * 11 + 35);

    可以试一试


    2019-11-27
    有用
    回复
  • 风平浪静
    风平浪静
    2019-11-05

    1. CanvasContext.rotate

    2. canvas导出图片,然后旋转图片

    2019-11-05
    有用
    回复 2
    • 逸世凌虚
      逸世凌虚
      2019-11-05
      用图片可以
      2019-11-05
      回复
    • IAMDCH
      IAMDCH
      2021-12-11回复逸世凌虚
      请问条形码竖向显示解决了吗
      2021-12-11
      回复
  • 睡前原谅一切
    睡前原谅一切
    2019-11-05

    ctx.rotate??  canvas不支持动画? https://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.rotate.html

    2019-11-05
    有用
    回复 2
    • 逸世凌虚
      逸世凌虚
      2019-11-05
      rotate只会旋转坐标轴,那样的话,就得去修改barcode插件源码了
      2019-11-05
      回复
    • 睡前原谅一切
      睡前原谅一切
      2019-11-05回复逸世凌虚
      插件在你本地。你自己应对需求改下咋啦。Painter的源码我都改过呢。跟需求走。不行 你可以去给barcode提issues嘛?
      2019-11-05
      回复
登录 后发表内容
问题标签