微信小程序分享海报生成的实现方法

为了吸引更多的用户，有必要设计一张分享海报。但是小程序生成海报还是有点坑。让我们分享一些打卡小程序的经验。

分享海报效果图如下：

制造要求：

海报以弹出的形式展示，各种手机型号都能正常展示海报内容。海报保存的图片尺寸是iphone 6的两倍(750 * 1334)。由于弹出的图片和保存的图片是两种尺寸，所以我先看了一些其他的在线教程。建议做两块画布，一大一小。在实际过程中，使用大画布偏离窗口显示区域(不可见)并生成临时文件。img组件用于弹出图像，并引入临时文件来设置其高度；保存时，直接下载临时文件。

虽然实现了，但在优化过程中对方案进行了重新设计。优化方案详述如下：

以用画布画二维码为主；弹出窗口的图片是画布；共享图片是画布导出的大图；为了达到最好的效果，我们应该在输入名言警句时处理它们的新行。设计弹出窗口的图片比例

因为最终海报的图片尺寸是iphone 6 (750 * 1334)的两倍，这里弹出窗口的图片是画布的尺寸，设计为对应尺寸的一定比例。

弹出图片的高度=窗口的高度-顶部和底部空白-按钮的高度-图片和按钮之间的距离imgheight=100vh-40rpx * 2-50rpx-15rpx

弹出画面宽度/弹出画面高度=750/1334弹出画面宽度=(750/1334) *弹出画面高度

由于像素只能是整数，这样画出来的图片底部可能会有1px的空白，所以设置高度时可以减少1px，不会影响视觉效果。

画一幅背景图

如果是网络图片，必须先下载图片再画背景图。可以通过wx.getImageInfo或者wx.downloadfile下载图片，下载成功后插入临时地址，然后用wx画布的drawImage绘制。请注意，图片的格式不能是gif。

绘制二维码

绘制二维码换了好几个库，安卓下生成的每个二维码都经常失败。查了很多资料，我说安卓在绘图的时候要设置一个setTimeout，所以最后选择了weapp-二维码，修改了它的绘图功能，增加了setTimeout(更不用说添加二维码绘图成功了)。

Ctx.draw (false，函数(e){ settimeout()={//修改添加的选项. callback options.callback (e)}，20)；})此外，目前这些绘制小程序二维码的库都是在一个单独的新画布中完成的，所以只要稍微修改一下源代码，就可以提供另一个界面，直接在现有的画布中绘制(表示其他内容一开始就绘制在画布中)。

如果二维码扫描不到，说明二维码的绘制有问题。但是安卓微信6.7.2版本本身有bug，二维码本身没有问题，但是无法识别。但只需升级微信版本。

保存图片

首先，获取用户是否打开了用户授权的相册。如果没有权限，弹出提示打开权限。如果有权限，直接调用saveImageToPhotosAlbum接口保存图片。如果弹出提示接受打开权限，则调用SaveIMAGETOPHOSAlbum界面保存图片。如果弹出提示拒绝，则再次弹出设置打开权限。如果是，输入设置权限的性能注意。

经过练习，整个绘图过程其实非常快，但如果有临时的文件保存操作(wx.canvasToTempFilePath)，通常需要一半左右的时间。此外，还有一个measureText api，用于测量单词的长度。这在实现单词换行时使用，但会消耗更多性能。

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。