<view>
<u-button @click=“createPoster”>生成海报</u-button>
<u-popup :show="show" round="10rpx" closeOnClickOverlay @close="colsePay()">
//生成海报
<lPainter customStyle='position: fixed; left: 10px;top:10px' ref="painter" :board="base" isRenderImage @success="onSuccess($event)" />
</u-popup><u-button @click=“onPosterSuccess”>保存相册</u-button>
<u-button @click=“Posterweixin”>分享微信</u-button>
</view>
createPoster() {
const width = 350;
const height = 600;
let that = this;
let config = {
width: width + "px",
height: height + "px",
// background: '#F6F7FB',背景色
views: [
// 背景图片设置
{
type: "image",
css: {
objectFit: "cover",
width: width + "px",
height: height + "px",
},
src: "../../static/haibao.jpg",
},
// 文字
{
type: "view",
css: {
top: "390px",
},
views: [{
type: "text",
text: "邀请码",
css: {
color: "#000000",
ontSize: '27rpx',
lineHeight: '40rpx',
width: '100%',
textAlign: 'center', //居中,要设置width: '100%',
}
}, ]
},
// 个人头像
{
type: "view",
css: {
top: "410px",
left: '50px',
},
views: [{
type: "image",
css: {
width: "30px",
height: "30px",
borderRadius: "50%", //设置圆形头像
},
src: this.avatar //后台的接口 ,可以直接跟地址src: '地址'
}]
},
// 文字拼接
{
type: "view",
css: {
top: "410px",
left: '90px',
},
views: [{
type: "text",
text: this.userName + ',邀请您加入,' + this.storeName ,
css: {
maxLines: 3, //超出三行显示...
width: '440rpx',
ontSize: '27rpx',
lineHeight: '40rpx'
}
}, ]
},],
}
// 赋值海报
this.base = config;
},// 生成海报地址
onSuccess(e) {
this.path = e
},
//保存到相册
onPosterSuccess() {
uni.saveImageToPhotosAlbum({ //保存图片到系统相册。
filePath: this.path, //图片文件路径
success: function() {
uni.showToast({
title: '图片保存成功',
icon: 'none',
});
},
fail: function(e) {
console.log(e);
uni.showToast({
title: '图片保存失败',
icon: 'none',
});
}
});
},
// 微信分享好友和朋友圈
Posterweixin() {
uni.share({
provider: "weixin",
// 分享到微信好友:WXSceneSession。朋友圈:WXSceneTimeline
scene: "WXSceneSession",
type: 2,
imageUrl: this.path,
miniProgram: {
id: 'gh_abcdefg',
path: 'pages/index/index',
type: 0,
webUrl: 'http://uniapp.dcloud.io'
},
success: function(res) {
console.log("success:" + JSON.stringify(res));
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
}
});
},