收藏
回答

canvas怎么可以使图片全部显示出来,跪求方法

问题模块 框架类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
API和组件 小程序 canvasContext.drawImage 微信iOS客户端 全部 阿达

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

})


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

最后一次编辑于  2018-02-01  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

10 个回答

  • 不急
    不急
    2018-02-02

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

    2018-02-02
    赞同
    回复
  • 亨利
    亨利
    2018-02-02

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


    2018-02-02
    赞同
    回复
  • 不急
    不急
    2018-02-02

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

    2018-02-02
    赞同
    回复
  • 亨利
    亨利
    2018-02-02

    感谢,我先试试去

    2018-02-02
    赞同
    回复
  • David
    David
    2018-02-04

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

    2018-02-04
    赞同
    回复
  • 亨利
    亨利
    2018-02-07



    还是没出来

    2018-02-07
    赞同
    回复
  • 不急
    不急
    2018-02-07

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

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

    2018-02-07
    赞同
    回复
  • 亨利
    亨利
    2018-02-07

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

    2018-02-07
    赞同
    回复
  • 不急
    不急
    2018-02-07
    getImageInfo(url) {
      return new Promise(resove => {
        wx.getImageInfo({
          src: url,
          success: res => {
            resove(res.path);
          },
          fail() {
            throw Error(`获取图片信息失败 ${url}`);
          }
        })
      })
    },


    @亨利  promise 封装下微信的 api

    2018-02-07
    赞同
    回复
  • David
    David
    2018-02-07

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

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



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

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




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


    2018-02-07
    赞同
    回复