安装

tnpm install --save @alipay/mas-adc-circle

组件介绍

圆环形的进度条组件，支持进度渐变动画。

参数说明

属性 | 必填 | 参数类型 | 参数说明 | 默认值 | 示例 --|:--:|:--:|:--:|:--: | :-: value | 否 | number | 值 | 0 | 50 size | 否 | number | 圆环直径 | 100 | 50 color | 否 | string | 进度条颜色 | #1989fa | #1989fa layerColor | 否 | string | 轨道颜色 | #fff | #1989fa fill | 否 | string | 填充颜色 | - | #1989fa speed | 否 | number | 动画速度 | 50 | 100 text | 否 | string | 文字 | - | demo strokeWidth | 否 | number | 进度条宽度 | 4 | 10 clockwise | 否 | boolean | 是否顺时针增加 | true | false

在小程序中使用

{
  "usingComponents": {
    "mas-adc-circle": "@alipay/mas-adc-circle/es/index"
  }
}

在 page.axml 中引用组件

<!-- 页面使用方式 -->
 <mas-adc-circle
  value="{{50}}"
/>

Badges