• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

wx小程序用canvas生成图片流程与注意事项

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

1、需要画入canvas的 图片都需要先缓存到本地 

  

let ps = []
    ps.push(that.loadImageFun(this.statusInfo.avatar_url, "headImg"))
    Promise.all(ps).then(res => {
    // 画图
})


loadImageFun(url, index) {
    let _this = this
    return new Promise((resolve, reject) => {
      wx.downloadFile({
        url,
        success(res) {
          if (res.statusCode === 200) {
            _this.loadedImgs[index] = res.tempFilePath
            resolve()
          }
          else
            reject()
        },
        fail() {
          reject()
        }
      })
    })
  },

2、从canvas中导出图片时,android手机生成不了图片。(原因是,draw的回调函数在android上是假回调,ios上貌似是真的555,因为canvas还没准备好,所以得手动加延时了...)

//绘制图片
      ctx.draw(false, () => {
        setTimeout(()=>{
          wx.canvasToTempFilePath({
            x: 0,
            y: 0,
            width: size,
            height: imgHeight,
            destWidth: size,
            destHeight: imgHeight,
            canvasId: \'shcanvas\',
            success: function (res) {
              var tempFilePath = res.tempFilePath;
              that.share_img = tempFilePath;
              // wx.previewImage({
              //   urls: [that.share_img],
              // })
            }
          })
        },1000)
      })

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
公布读取瑞星注册码的小程序源代码发布时间:2022-07-18
下一篇:
微信小程序在2018年将成为各个行业的危机发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap