animated动画
-
列队 sequence([])
-
并行 parallel([])
-
基本使用
this.state = { width:new Animated.Value(num)};
//事件触发
Animated.spring(this.state.width,{toValue:num})
-
spring 弹簧动画
- Option:
- toValue:num || toValue:{x:num,y:num}复合值动画
- friction:num 弹动值,越小幅度越大 defaul:7
- tension:num 摩擦值,越小弹动越平缓 defaul:40
- Option:
-
timing 缓动动画
- Option:
- toValue:num || toValue:{x:num,y:num}复合值动画
- duration:持续时间
- delay:延迟时间
- easing:缓动函数 例:Easing.out(Easing.ease)
- Option:
-
decay 速率动画
- Option:
- velocity:初始值
- deceleration:减速速率
- 最终值为 velocity += velocity* deceleration
- Option:
-
start 函数接收一个回调参数 当动画执行完后调用
image.png
网友评论