微信小程序> Painter(微信小程序分享卡片)

Painter(微信小程序分享卡片)

浏览量:10106 时间: 来源:小西几的iye

Painter 的优势

  • 功能全,支持文本、图片、矩形、qrcode 类型的 view 绘制
  • 布局全,支持多种布局方式,如 align(对齐方式)、rotate(旋转)
  • 支持圆角,其中图片,矩形,和整个画布支持 borderRadius 来设置圆角
  • 杠杠的性能优化,我们对网络素材图片加载实现了一套 LRU 存储机制,不用重复下载素材图片。 杠杠的容错,因为某些特殊情况会导致
  • Canvas 绘图不完整。我们对此加入了对结果图片进行检测机制,如果绘图出错会进行重绘。

使用方法

  1. 引入代码

    Painter 的核心代码在另一个 repo
    中,https://github.com/Kujiale-Mobile/PainterCore.git 。你可以通过submodule
    的方式进行库的引入。有关 submodule 的用法可自行 Google。

    https://github.com/Kujiale-Mobile/PainterCore.git components/painter
  2. 作为自定义组件引入,注意目录为第一步引入的代码所在目录

    "usingComponents":{   "painter":"/components/painter/painter" }
  3. 组件接收 palette 字段作为画图数据的数据源, 图案数据以json形式存在,推荐使用“皮肤模板”的方法进行传递,示例代码如下:

    <painter palette="{{data}}" bind:imgOK="onImgOK" />  
  4. 数据传入后,则会自动进行绘图。绘图完成后,你可以通过绑定 imgOK 或 imgErr 事件来获得成功后的图片 或失败的原因。

    bind:imgOK="onImgOK" bind:imgErr="onImgErr"onImgOK(e) {   其中 e.detail.path 为生成的图片路径},

Painter - github下载地址

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎