更新记录

1.0.0（2023-03-27） 下载此版本

首次上传

平台兼容性

微信专用CANVAS

组件属性Props

config配置文件

主要靠该数组显示内容，组件自动将rpx转为px

config配置例子

config: [{
    type: 'image',
    src: 'https://img6.bdstatic.com/img/image/pcindex/sunjunpchuazhoutu.JPG',
    x: 0,
    y: 0,
    width: 600,
    height: 700,
    radius: 20
}, {
    type: 'block',
    x: 20,
    y: 20,
    width: 560,
    height: 660,
    color: 'rgba(255,255,255,.5)',
    radius: 20
}, {
    type: 'image',
    src: 'https://img6.bdstatic.com/img/image/pcindex/sunjunpchuazhoutu.JPG',
    x: 50,
    y: 60,
    width: 80,
    height: 80,
    radius: 40,
}, {
    type: 'text',
    content: 'uni-app微信小程序专用canvas，单位rpx，自动转为px',
    x: 150,
    y: 60,
    width: 400,
    fontSize: 24,
    fontWeight: 700,
    color: 'green',
    lineHeight: 36,
    baseline: 'bottom',
    rowNum: 2,
    ellipsis: true,
    showLineation: true,
    lineation: 0,
    lineWidth: 4,
    lineColor: '#ff9900'
}]

生成图片

// 通过ref调用内部saveTempImage方法，返回值promise对象，内含tempFilePath
async saveImage() {
    this.poster = await this.$refs.lunCanvas.saveTempImage()
}