wx.getImageInfo 获取网络图片的临时文件路径;接着使用图片的临时文件和相关的数据信息,使用小程序的 Canvas 接口,进行图像绘制。wx.canvasToTempFilePath 保存 Canvas 图像至临时文件区,之后,可使用 wx.saveImageToPhotosAlbum 接口,保存图片到手机相册中。wx.BaaS.login 进行登录,若用户允许,小程序就会获取用户个人信息。wx.BaaS.storage.get('userinfo') 即可获取。canvasContext.drawImage 并不能直接使用网络图片资源,所以我们应该将网络图片资源下载后,再使用它们来进行图片绘制。wx.getImageInfo 。当然,使用 wx.downloadFile 也能达到同样的效果。display: none 或者 visibility: hidden 。wx.showloading(object) 提示用户等待,并且设置 wx.showloading(object) 的参数 object.mask = true ,使得用户在图片生成动作完成之前无法操作页面。wx.getImageInfo 去获取该资源的临时文件。wx.getImageInfo 加载图片还是比较久的,怎么提高加载速度又不用每次上传都手动去压缩图片呢?绘制的过程,调用 wx.createCanvasContent(canvasID) 获取画布的上下文 ctx ,依次完成绘制背景、祝福语的内容、微信用户头像和昵称、祝福人数等信息的逻辑。ctx.drawImage(resources, x, y, width, height) 即可,resource 需要使用我们之前获得的临时文件路径。确定好要绘制的单行文本之后,使用 关于接口 附上 demo 绘制逻辑的代码: 保存与导出 wx.canvasToTempFilePath(OBJECT) ,可以获得图像的临时文件路径,这时,我们使用该路径,就可以把它显示在 标签中。wx.saveImageToPhotosAlbum(OBJECT) ,把临时文件保存到手机相册中。好了,关于如何使用 Canvas 绘制祝福语图片的教程就到此结束了。 对于 Canvas 还有什么问题,欢迎联系晓小云,加入开发交流群,有大神可以教你喔。 |
|
来自: 青木森森 > 《电脑~手机~网络》