微信小程序Canvas绘图存图

简介: 微信小程序Canvas绘图存图

正文


使用 canvas 画图,并保存至相册的过程,以下是踩过的坑:

  1. canvas 标签不可以设置为 display: none;若不想显示到页面,可以采用 fixed 布局视觉隐藏;
  2. context.draw(boolean reserve, function callback) 是异步的,wx.canvasToTempFilePath一定要写在回调里,否则会出现无法绘图的情况;
  3. wx.canvasToTempFilePath 保存图片至相册,需要用户授权,所以保存前需要检查权限。一旦用户一次拒绝授权,第二次保存时是不会有授权弹窗的,可以使用 wx.openSetting 去引导用户授权。(插一句:支付宝小程序,只要没权限,每次调用都会弹出授权弹窗)

代码片段:一个简单的canvas demo


5128488-a10707178cf68eba.webp.jpg

目录
相关文章
|
9月前
|
前端开发 小程序 JavaScript
微信小程序canvas手写签字
微信小程序canvas手写签字
108 0
|
9月前
|
前端开发 小程序
微信小程序canvas画布绘制base64图片并保存图片到相册中
微信小程序canvas画布绘制base64图片并保存图片到相册中
242 0
|
4月前
|
前端开发 小程序 JavaScript
小程序 canvas 生成海报 一次搞掂
小程序 canvas 生成海报 一次搞掂
73 1
|
4月前
|
前端开发 小程序 JavaScript
微信小程序 canvas 备忘
微信小程序 canvas 备忘
49 0
|
7月前
|
前端开发 小程序
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
451 0
|
9月前
|
前端开发 小程序
微信小程序绘制canvas时在不同 设备上的大小不同的问题
微信小程序绘制canvas时在不同 设备上的大小不同的问题
304 0
|
9月前
|
前端开发 小程序
【微信小程序5】利用canvas实现纯色背景抠图功能
【微信小程序5】利用canvas实现纯色背景抠图功能
407 0
|
9月前
|
前端开发 小程序
微信小程序canvas画布绘制;canvas画布图片保存
微信小程序canvas画布绘制;canvas画布图片保存
105 0
|
26天前
|
小程序 前端开发 关系型数据库
基于Uniapp+php校园小程序,校园圈子论坛系统功能,校园跑腿二手交流功能设计
校园圈子论坛及综合服务平台集成了校园跑腿、兼职信息、外卖团购、闲置交换、租赁服务、表白墙等多功能模块,提供一站式校园生活解决方案。系统采用uniapp前端和PHP后端开发,支持多城市、多学校切换,配备分站式后台管理,确保稳定性和安全性。通过融云IM SDK实现即时通讯功能,增强用户互动与粘性。适用于大学校园、城市及社区圈子,满足多样化需求,提升便捷体验。
|
1月前
|
移动开发 小程序 前端开发
超详细攻略!uniapp陪玩系统,打包陪玩小程序、H5需要注意什么?
陪玩系统的打包过程涵盖APP、小程序和H5平台。APP打包需使用uni-app开发工具,配置项目信息并选择云打包;小程序打包需在微信公众平台注册账号并提交审核;H5打包则直接通过uni-app生成文件并上传至服务器。各平台需注意权限配置、代码规范及充分测试,确保应用稳定性和兼容性。

热门文章

最新文章