| 本站：VPS参考评测推荐，专注分享VPS服务器优惠信息！若您是商家也可以在本站进行投稿，查看详情！此外我们还提供软文收录、PayPal代付、广告赞助等服务，查看详情！ |
| 部分文章发布时间较久远，可能存在未知因素，购买时建议在本站搜索商家名称，可查看相关文章充分了解商家！若非中文页面可使用谷歌浏览器同步翻译！PayPal代付/收录合作 |
本文带你谈谈微信小程序保存图片组件的开发，希望对你有所帮助！
很多微信小程序通过保存海报让用户分享活动，让更多人了解他们的小程序。想必他们应该是平时开发小程序的时候认识的。【相关学习推荐:小程序开发教程】
今天我要分享的是我之前在公司做的一个保存海报的小程序的功能。首先我来描述一下之前在公司的要求是什么。公司的线上小程序会有一个长期的活动，推广新用户。每个用户都要有自己的海报，通过个人海报推广只是一种简单的方式。
接到任务后，我也去环球互联做了一个调查，但是我哥告诉我，这个也做过类似的东西，但是当时只是为了完成任务，代码很乱。然后他找了又找其他项目的代码，然后给我找~ ~ ~，但是当时给我的时间紧，任务重，我只好先调整一部分，做一个工作。之后我根据网上的文章一步步实现了一个保存海报的组件。
通过画布画海报。通过uni.canvasToTempFilePath将绘制的画布变成图片通过uni.saveImageToPhotosAlbum将本地临时路径的图片保存到手机相册我的想法是将所有采用的方法封装成组件，只通过父组件调用需要使用的方法并调整相关参数。有关详细信息，您可以查看示例代码。
通过画布绘制海报内容的顺序决定了使用promise对象绘制海报内容的顺序。promise.all()方法执行canvas context.draw()的最后一次绘制操作
关注uni.getImageInfo()。在绘制图片和头像时，组件可以通过uni.getImageInfo()获取图片的相关信息。成功调用该方法的前提是需要在微信小程序后台配置下载域名和请求域名。当然，最好将uploadFile域名配置在一起，以防出错。但是官方提示是配置下载域名白名单，却无法获取图片信息，这是一个很大的漏洞。
如果没有相关配置，调试时打开的是vconsole调试工具，或者是正式版的体验版。Uni.getImageInfo()可以获取图片信息，而vconsole uni.getImageInfo()一旦关闭就会失效，这也是一个坑。
该组件的方法和变量引入了propscanvasInfo对象(必需的)
画布宽度
CanvasHeight画布高度
CanvasId画布Id
isFullScreen布尔值
True表示画布为手机全屏，canvasInfo设置的宽度和高度将无效。
默认值为false。
Methodscanvasinit(回调)画布初始化，所有画布操作都需要在其回调函数中操作。
Drawcanvas Image (context，src，_ imagewidth，_ imageheight，dx，dy)在画布中绘制图片。
Drawcircular avatar (context，URL，_ circular x，_ circular y，_ circular r)在画布上绘制圆形图片。
DrawText(选项)在画布中绘制单行和多行文本。
StartToImage (context，promise arr，callback)绘制画布操作draw()
PosterToPhotosAlbum(文件路径)保存到手机相册。
示例代码
有关编程的更多信息，请访问:编程入门！！也就是小程序中保存图片组件的功能细节是手工拍摄的。请多关注本站其他相关文章！
本文由本站刊发，转载请注明：手把手带你实现小程序中保存图片组件的功能。 https://本站.com/76578.html
推荐站内搜索：虚拟空间购买、in域名注册、联通虚拟主机、外国虚拟主机、免费cn域名注册、查域名、公司域名如何备案、免备案cdn加速、网站备案系统美国仿牌空间、
