UniApp—分享一个工作中用到的海报插件

129 阅读1分钟

先上链接海报画板 - DCloud 插件市场

这个插件可以帮助我们用html+css的语法来绘制一个海报,海报可以保存到用户的手机相册里,非常好用。

用法也很简单,下面简单的贴一下代码,更加详细的用法可以点击上面的链接进入到插件详情查看:

<l-painter
            isCanvasToTempFilePath
            @success="handleDrawPainterSuccess"
            hidden
            css="width: 750rpx; padding: 48rpx;"
        >
        <l-painter-qrcode
            css="width: 160rpx; height: 160rpx; margin-right: 42rpx;"
            text="www.baidu.com">
        </l-painter-qrcode>
        <l-painter-text
            text="hello world"
            css="color: #333; font-size: 20rpx"
        />
 </l-painter>
 
 
 // 海报绘制成功后保存到用户手机
 const handleDrawPainterSuccess = (e) => {
    showLoading()
    uni.saveImageToPhotosAlbum({
        filePath: e, //图片文件路径
        success: function () {
            uni.showToast({
                title: '图片保存成功',
                icon: 'none',
            })
        },
        fail: function (e) {
            uni.showToast({
                title: '图片保存失败',
                icon: 'none',
            })
        },
        complete: () => {
            
        },
    })
}