Skip to content

Latest commit

 

History

History
53 lines (40 loc) · 1.99 KB

README.md

File metadata and controls

53 lines (40 loc) · 1.99 KB

react-native-gradient-loading

运行效果

  • IOS

react-native-gradient-loading

  • Android

react-native-gradient-loading

安装

  • npm: npm install react-native-gradient-loading --save
  • Yarn: yarn add react-native-gradient-loading

link

  • 此组件依赖于react-native-svg,需要安装 react-native-svg, 运行 yarn add react-native-svg, 运行react-native link react-native-svg

属性

  • 共有属性(即为Loading 属性)
名字 默认值 类型 描述
size 100 number svg大小/画布的宽高/圆环的直径
speed 1200 number 动画时长
linearGradientColor ['red', 'blue'] array 渐变颜色
start { x: 0, y: 0 } object 渐变开始坐标
end { x: 100, y: 100 } object 渐变结束坐标
ringWidth 6 number 圆环的宽度
showBackCircle true bool 是否显示底色
backCircleColor '#eee' color 底部圆环颜色
direction 0 number 0 顺时针, -1 为逆时针
strokeLinecap 'round' ['square', 'round'] 是否圆角描边
  • Load 属性
名字 默认值 类型 描述
initialNum 0 number 动画开始数值
targetNum 100 number 最终显示数值
startDirection 'right' ['top', 'right', 'bottom', 'left'] 起始位置
textStyle undefined style 文本样式
textSpeed 10 number 文字步进 此值尽量小
percentage 0.8 number 百分比,取值为 0~1
useAnimation true bool 是否是有动画加载

License

如有问题加群:397885169