更新记录

1.0.0(2022-08-01) 下载此版本

首次提交


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.2.2 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

使用说明

使用示例

<template>
    <view class="content">
        <cv-view :cv="{lazy:true}" ref="cv" :loadImage="false" @onImage="onImage"></cv-view>
    </view>
</template>

其中loadImage为true时,绘制完成时@onImage会被调用,并输出一个图片的本地路径,canvas本身不会显示 其中loadImage为false时,绘制完成时@onImage不会被调用,界面上会展示绘制出的布局 其中cv的示例如下

{
    "rect": {
        "color": "",
        "components": [
            {
                "name": "rect",
                "props": {
                "display": "row",  
                "components":[{
                    "name": "rect",
                    "props": {
                        "w":15,
                        "h":15,
                        "color": "#00ff00"
                    }
                },{
                    "name":"text",
                    "props":{
                        "marginLeft":22,
                        "content":"我是标题",
                        "size":22
                    }
                }]  
                }
            },
            {
                "name": "text",
                "props": {
                    "color": "#00ff00",
                    "content": "哈哈",
                    "size": 16
                }
            },
            {
                "name": "image",
                "props": {
                    "h": 20,
                    "w": 20,
                    "filePath": "/static/logo.png"
                }
            },
            {
                "name": "text",
                "props": {
                    "color": "#00ff00",
                    "content": "哈哈",
                    "size": 16,
                    "marginTop":16,
                    "marginLeft":16
                }
            }
        ],
        "display": "col"
    }
}

暂时只支持rect\text\image 布局支持 col\row 属性支持 margin\size\color 等等

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问