ActivityIndicator活动指示器 - 图1

ActivityIndicator 活动指示器

基本用法

  1. import { Cell, ActivityIndicator } from 'zarm';
  2. ReactDOM.render(
  3. <>
  4. <Cell description={<ActivityIndicator />}>普通</Cell>
  5. <Cell description={<ActivityIndicator size="lg" />}>大号</Cell>
  6. <Cell description={<ActivityIndicator loading={false} />}>无旋转动画</Cell>
  7. <Cell description={<ActivityIndicator loading={false} percent={75} />}>指定百分比</Cell>
  8. </>
  9. , mountNode);

传统菊花状

  1. import { Cell, ActivityIndicator } from 'zarm';
  2. ReactDOM.render(
  3. <>
  4. <Cell description={<ActivityIndicator type="spinner" />}>普通</Cell>
  5. <Cell description={<ActivityIndicator type="spinner" size="lg" />}>大号</Cell>
  6. </>
  7. , mountNode);

API

属性类型默认值说明
typestring'circular'可选值 circular 圆环状、spinner 传统菊花状
loadingbooleanture是否执行动画
strokeWidthnumber5指示器线条宽度
percentnumber20填充百分比, 圆环状无动画状态下可用
sizestring'md'大小,可选值 mdlg