需求背景:用户评论后实时生成一个图文卡片,可保存至手机后分享给朋友,像豆瓣标记某本书后生成的卡片
思路之一是用canvas画好图文,后通过API:wx.canvasToTempFilePath(OBJECT)输出为图片,预览该图片,用户可保存该图片到手机,而后可分享给朋友;
一些问题:文字换行,html5 canvas可通过measureText测量文字宽度来实现换行点击预览,而小程序API没有提供这个;
其他:
不知道能否直接用wxml写好卡片,再将其转化为图片,似乎想多了...
看到WeZRender:微信小程序Canvas增强组件, 来源于ZRender:一个轻量级Canvas类库,未确定是否能解决文字换行的问题
不知道这种需求,你们是怎么实现的;如果是用canvas,文字换行的问题是怎么解决的;是否还有其他比较重要的问题?
文字换行解决方案:
使用WeZRender绘图,文字间加上"n"换行符,可以成功换行,根据这个,可以限制一行显示固定字数比如20个,在画文字前,先在该换行的位置出入"n";
按照上面这个思路,直接canvas画图的话,也可将文字分多段画
其他的问题:
图片以圆形显示:暂不确定WeZRender可否用一个同样大小的圆来裁切图片,从而使得以圆形显示
卡片圆角:同上
canvas输出图片模糊:使得输出宽高为canvas宽高*设备像素比可解决,相关问题链接
问:微信小程序分享是在页面里配置onShareAppMessage
Page({ onShareAppMessage: function () { return { title: '自定义转发标题', path: '/page/user?id=123' } } })
但有些小程序会在页面有分享按钮,点击按钮主动分享,这个是怎么实现的呢?
工作日 8:30-12:00 14:30-18:00 周六及部分节假日提供值班服务
工作日 8:30-12:00 14:30-18:30