uniapp中uview组件库丰富的LoadingIcon 加载动画

目录

基本使用

#动画文字

#模式类型

#排列类型

#动画模式

#动画运行时间

#图标颜色

#图标尺寸

#显示或隐藏动画

API

#Props


基本使用

通过mode设定动画的类型,circle为圆圈的形状,flower为经典类似花朵的形状


#动画文字

text可以指定文字内容 textSize可以指定文字大小


#模式类型

mode可以指定模式




#排列类型

vertical可以指定文字和图标是否垂直排列


#动画模式

timing-function可以指定modesemicirclecircle时动画里css中animation-timing-function的属性,默认为ease-in-out


#动画运行时间

duration可以指定动画的运行周期时间


#图标颜色

color可以指定动画活动区域的颜色, inactive-color可以制定modecircle时的暗边颜色




#图标尺寸

通过size设定尺寸,单位rpx,组件内把size值体现为组件的宽和高


#显示或隐藏动画

通过show设置为truefalse,来显示或隐藏动画



/* 等价于 */

API

#Props

参数 说明 类型 默认值 可选值
show 是否显示动画 Boolean true false
color 图标颜色 String color['u-tips-color'] -
textColor 提示文本颜色 String color['u-tips-color'] -
vertical 图标和文字是否垂直排列 Boolean false true
mode 模式选择,见上方说明 String circle circle \ semicircle
size 加载图标的大小,单位px String | Number 24 -
textSize 加载文字的大小,单位px String | Number 15 -
text 文字内容 String - -
timingFunction 指定animation-timing-function的css属性,但只支持modecirclesemicircle才有效 String ease-in-out -
duration 动画执行周期时间,单位ms string | Number 1200 -
inactiveColor 图标的暗边颜色, modecircle 模式有效 String transparent -

你可能感兴趣的:(uniapp,uni-app,nginx,运维)