@gizwits/vantui/types/ring-slider.d.ts

机智云组件库

import { FunctionComponent } from 'react'

export interface RingSliderProps {
  /**
   * @description 当前值，范围0-100
   * @default 0
   */
  value?: number

  /**
   * @description 监听回调，滑动结束时触发
   * @default
   */
  onChange: (val: number) => void

  /**
   * @description 圆环的开始角度，正下方为0度
   * @default 45
   */
  startAngle?: number

  /**
   * @description 宽度
   * @default 200
   */
  width?: number

  /**
   * @description 圆环的终止角度，正下方为0度
   * @default 315
   */
  endAngle?: number

  /**
   * @description 线条宽度
   * @default 20
   */
  lineWidth?: number

  /**
   * @description 圆环背景色
   * @default #EEEEEE
   */
  strokeBgColor?: string

  /**
   * @description 圆环颜色,支持渐变
   * @default #3FBEA2
   */
  strokeTintColor?: string | [string, string]

  /**
   * @description 指示器半径，为0时不启用指示器
   * @default 0
   */
  indicatorR?: number

  /**
   * @description 指示器线条宽度
   * @default 8
   */
  indicatorLineWidth?: number

  /**
   * @description 指示器颜色,支持渐变
   * @default #cccccc
   */
  indicatorTintColor?: string | [string, string]

  /**
   * @description 圆环外围刻度线
   * @default false
   */
  showScale?: boolean

  /**
   * @description 刻度线颜色
   * @default #3FBEA2
   */
  scaleColor?: string
}

declare const RingSlider: FunctionComponent<RingSliderProps>

export { RingSlider }