背景

目前手头有一个小程序项目，希望转发时分享消息的界面可以定制。但是微信小程序只提供设置图片的url和标题。

/* * *用户点击右上角分享*/onsharepmessage : function(){ return { imageurl 3360 ' '，title : ' ' }；}实现

在我们要转发的显示内容中还有一点：头像、用户名、点赞数。好在这个排版不是很复杂，所以我们就想到了通过canvas生成一张图片，然后返回canvas生成的图片的url。

代码如下(其实你要在显示器上做一些优化，自己调试):

首先在页面上创建一个画布标签

canvas canvasid-id=' canvasid ' style=' width : 375 px；' height: 500px'wx : if=' { { lachow } } '/canvascontext let context=wx . createcanvascontext(' canvasid ')context . Draw image(back . path，0，60，backWidth，BackHeight) //画下面的背景图//画一个圆形头像，参考教程：https://www.jianshu.com/p/9a6ee2648d6f,上下文的第二种方法. save()；var d=2 * 25var cx=0 25var cy=0 25context.arc(cx，cy，25，0，2 * Math。PI)；context . clip()；context.drawImage(avatar.path，0，0，d，d)；context . restore()；//画出喜欢的名字和数量。context . setfontsize(14)context . fill text(' username '，70，32)让Zan length=('100 ' '秒赞')。length context.fillText('100 ' '秒点赞'，375-14 * zanLength，32) //执行draw来渲染并返回图片url context.draw(true，()={//这个方法应该在draw的回调中执行，wx . canvastotempfilepath({ x 3360 0 0，y : 0 0 0，width: 375，height: 400，destWidth: 375，destHeight: 400然而！

在画布中显示绘制的图片存在问题(画布污染)，非同源图片不会在画布中显示。后来我们用wx.getImageInfo获取图片信息，通过里面的地址显示图片(相当于把图片翻在一起)。

Wx.getimaginfo ({src : imgur，success : function (RES) {/* *)获取返回值res[0]。路径，然后将该值作为路径上下文。drawimage (RES [0])。path，x，x，x)* */让drawimgur=Emmmm.文章很短，这里只是提供一些解决方案，希望对大家有所帮助~

摘要

以上就是本文的全部内容。希望本文的内容对大家的学习或工作有一定的参考价值。谢谢你的支持。