收藏
评论

爸妈搜海报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 />

属性

属性名类型默认值说明
drawingArray[]画图的数据
savebtnTextString"点击按钮进行图片保存"按钮文字信息
drawing参数说明

drawing数据目前有两种数据信息,一种是图片信息,另一种是文字信息。

图片信息
属性名类型说明
typeStringimage图片类型
urlString
图片路径,为线上图片
leftNumber
距离画布的左边距
topNumber
距离画布的顶部距离
widthNumber
绘画图片的宽度
heightNumber
绘画图片的高度
circleBooleantrue、false是否是绘制圆形,默认为false
文字信息
属性名类型说明
typeStringtext文字类型
contentString
绘图的文字内容
leftNumber
距离画布的左边距
topNumber
距离画布的顶部距离
widthNumber
文字绘画的宽度
colorString
文字信息
textAlignString
文字水平对齐方式
fontSizeNumber默认为26rpx文字大小
textAlign参数
属性名类型说明
leftString左对齐
centerString居中对齐
rightString右对齐

如图:

实例:

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'

/>

注意: 样式的优先级!

效果


联系方式

赞 6
收藏

11 个评论

  • chenFangLin
    chenFangLin
    2019-10-14

    请问一下 网络不好的时候 提示“操作频繁” 这句话能隐藏吗  或者换个提示语

    2019-10-14
    赞同 2
    回复
  • Leon
    Leon
    2019-03-02

    引入插件有问题啊


    2019-03-02
    赞同 1
    回复 1
    • 冷风吹
      冷风吹
      2020-10-17
      我也是引入有问题
      2020-10-17
      回复
  • biu~
    biu~
    2018-11-29

    马克

    2018-11-29
    赞同 1
    回复
  • 王浪浪-百因
    王浪浪-百因
    2018-11-08

    不错不错

    2018-11-08
    赞同 1
    回复
  • 随风
    随风
    2018-11-08

    mark

    2018-11-08
    赞同 1
    回复
  • 移动-振杰
    移动-振杰
    2018-11-05

    不错的样子


    2018-11-05
    赞同 1
    回复 2
    • 爸妈搜
      爸妈搜
      2018-11-06

      欢迎使用

      2018-11-06
      回复
    • 额朋克欧光明
      额朋克欧光明
      2018-11-06

      挺好的


      2018-11-06
      1
      回复
  • 涛涛啊嘞嘞
    涛涛啊嘞嘞
    09-29

    有人吗,我这一直请求失败怎么搞的呀。

    09-29
    赞同
    回复
  • 冷风吹
    冷风吹
    2020-10-17

    这啥问题啊

    2020-10-17
    赞同
    回复
  • 锤锤
    锤锤
    2020-01-17

    文字字体需求很大的话,怎么处理字体高度的问题

    2020-01-17
    赞同
    回复
  • 
    
    2019-11-04

    为什么多张图的时候  会有出现覆盖的问题?

    2019-11-04
    赞同
    回复

正在加载...

登录 后发表内容