爸妈搜海报Maker
使用方法1、 在微信小程序管理后台——设置——第三方服务，按 AppID（wxbf07f0f22c6c200d）搜索到该插件并申请授权（ps：一般不会出现拒绝的情况。如果申请被拒绝了，请重新申请，有时候管理员手抽点错了，请见谅）。 2、在要使用该插件的小程序 app.json 文件中引入插件声明。 [代码]"plugins": {
"calendar": {
"version": "1.0.0",
"provider": "wxbf07f0f22c6c200d"
}
}[代码]3、在需要使用到该插件的小程序页面的 JSON 配置文件中，做以下配置： [代码]{
"usingComponents": {
"calendar": "plugin://poster/poster"
}
}[代码]4、在相应的 HTML 页面中添加以下语句即可完成插件的嵌入。 [代码]<poster />[代码]属性[代码]属性名[代码][代码]类型[代码][代码]默认值[代码][代码]说明[代码][代码]drawing[代码][代码]Array[代码][代码][][代码][代码]画图的数据[代码][代码]savebtnText[代码][代码]String[代码][代码]"点击按钮进行图片保存"[代码][代码]按钮文字信息[代码][代码]drawing参数说明[代码][代码]drawing[代码]数据目前有两种数据信息，一种是图片信息，另一种是文字信息。 [代码]图片信息[代码][代码]属性名[代码][代码]类型[代码][代码]值[代码][代码]说明[代码][代码]type[代码][代码]String[代码][代码]image[代码][代码]图片类型[代码][代码]url[代码][代码]String[代码] [代码]图片路径，为线上图片[代码][代码]left[代码][代码]Number[代码] [代码]距离画布的左边距[代码][代码]top[代码][代码]Number[代码] [代码]距离画布的顶部距离[代码][代码]width[代码][代码]Number[代码] [代码]绘画图片的宽度[代码][代码]height[代码][代码]Number[代码] [代码]绘画图片的高度[代码][代码]circle[代码][代码]Boolean[代码][代码]true、false[代码][代码]是否是绘制圆形，默认为false[代码]文字信息[代码]属性名[代码][代码]类型[代码][代码]值[代码][代码]说明[代码][代码]type[代码][代码]String[代码][代码]text[代码][代码]文字类型[代码][代码]content[代码][代码]String[代码] [代码]绘图的文字内容[代码][代码]left[代码][代码]Number[代码] [代码]距离画布的左边距[代码][代码]top[代码][代码]Number[代码] [代码]距离画布的顶部距离[代码][代码]width[代码][代码]Number[代码] [代码]文字绘画的宽度[代码][代码]color[代码][代码]String[代码] [代码]文字信息[代码][代码]textAlign[代码][代码]String[代码] [代码]文字水平对齐方式[代码][代码]fontSize[代码][代码]Number[代码][代码]默认为26rpx[代码][代码]文字大小[代码][代码]textAlign参数[代码][代码]属性名[代码][代码]类型[代码][代码]说明[代码][代码]left[代码][代码]String[代码][代码]左对齐[代码][代码]center[代码][代码]String[代码][代码]居中对齐[代码][代码]right[代码][代码]String[代码][代码]右对齐[代码]如图： [图片] 实例： [代码]data:{
data: {
drawing: [
{
type: 'image',
url: '此处是线上图片',
left: 0,
top: 0,
width: 650,
height: 950
},
{
type: 'text',
content: '此处是文本信息',
fontSize: 26,
color: 'white',
textAlign: 'left',
left: 170,
top: 50,
width: 650,
}
],
}[代码]样式类名说明[代码]canvas-style[代码][代码]画布样式样式[代码][代码]savebtn-style[代码][代码]按钮样式[代码][代码]/* 画布样式 */
.canvas-style{
width: 650rpx !important;
height: 950rpx !important;
margin: 0 auto;
border: 1px solid orangered;
margin-top: 10rpx;
}[代码][代码]<poster
drawing='{{drawing}}'
savebtnText='{{savebtnText}}'
canvas-style='canvas-style'
savebtn-style='savebtn-style'
/>[代码]注意： 样式的优先级！ 效果[图片] 联系方式[图片]
