canvas怎么可以使图片全部显示出来，跪求方法
发布于 6 年前 作者 maoyong 3647 次浏览 来自 问答

var pw = wx.getSystemInfoSync().windowWidth;

var ph = wx.getSystemInfoSync().windowHeight;

var headImage = app.globalData.userInfo.avatarUrl;

var content = wx.createContext(“qrcodeCanvas”);

content.drawImage("…/…/images/qrcode_banner.jpg", 0, 0, pw, pw / 104 * 59);

content.drawImage("…/…/images/ewm.png", pw / 2 - pw / 2 / 2, ph / 16 * 12 - ph / 16 * 4, pw / 2, pw / 2);//二维码图片

content.restore()

content.drawImage(headImage, pw / 2 - pw / 8 / 2, ph / 16 * 12 - ph / 16 * 4 + pw / 2 / 2 - pw / 8 / 2, pw / 8, pw / 8);//二维码中间的图片

content.setStrokeStyle(‘black’);

content.setFontSize(16);

content.setTextAlign(‘center’)

content.fillText(“长按图片识别二维码”, pw / 2, ph / 16 * 12 - ph / 16 * 4 + pw / 2 + 25)

wx.drawCanvas({

canvasId: “qrcodeCanvas”,

actions: content.getActions(),

reserve: true

})

二维码下面还有一张图片，加载太快了就到下面去了，怎么把它弄上来

10 回复

还是没出来

感谢，我先试试去

统一用 getImageInfo 得到临时文件路径，控制异步顺序，

现在顺序就是拿张图片最后绘制，但是还是让盖住了，前两张加载的慢。

@天黑有星 官方回复我了，应该是安卓微信的bug

我分享下我的代码绘制用头像在图片上

是用户头像在上面绘制的文字上

如果把284和285行对调下文字就在上面，我给你改的效果图是这样

图片是否完整，需要看wxml里的宽高和你绘制图片的参数，总之后画在上层

@David  你的问题没遇到过诶，地址第二次可以打印出来吗。

@亨利   我是先统一获得路径的，然后再统一画，两个操作分开的，你可以试试。

getImageInfo(url) {
  return new Promise(resove => {
    wx.getImageInfo({
      src: url,
      success: res => {
        resove(res.path);
      },
      fail() {
        throw Error(`获取图片信息失败 ${url}`);
      }
    })
  })
},

@亨利  promise 封装下微信的 api

@天黑有星  文件临时路径，作为图片预览的http链接，安卓手机二次预览就会加载不出来？开发工具都正常，你们有遇到吗？

@天黑有星  还是不行，可以看看您的代码吗

要图片在二维码上面吗，后绘制的会覆盖，放后面呗

回到顶部