iOS之弹簧效果动画

2022-07-12 11:14:16

            [UIView animateWithDuration:1 delay:(0.1 + i * 0.1) usingSpringWithDamping:0.8 initialSpringVelocity:0.2 options:UIViewAnimationOptionCurveLinear animations:^{
                        editView.y = _topLabel.bottom + 30 * (i / 4 + 1) + 70 * (i / 4);
                } completion:nil];

+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay usingSpringWithDamping:(CGFloat)dampingRatio initialSpringVelocity:(CGFloat)velocity options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^ __nullable)(BOOL finished))completion API_AVAILABLE(ios(7.0))

(NSTimeInterval)duration —— 动画时间
(NSTimeInterval)delay —— 延时几秒后开始执行动画
Spring Animation 的 API 和一般动画相比多了两个参数，分别是 usingSpringWithDamping和 initialSpringVelocity
- usingSpringWithDamping 参数
  usingSpringWithDamping的范围为0.0f到1.0f，数值越小「弹簧」的振动效果越明显。下图演示了在initialSpringVelocity为0.0f的情况下，usingSpringWithDamping分别取0.2f，0.5f和1.0f的情况，如下图
  
  tutu
- initialSpringVelocity 参数
  initialSpringVelocity则表示初始的速度，数值越大一开始移动越快。下图演示了在usingSpringWithDamping为1.0f时，initialSpringVelocity分别取5.0f，15.0f和25.0f的情况。值得注意的是，初始速度取值较高而时间较短时，也会出现反弹情况
  
  ttt

options —— 为动画执行的选项，如下：

||
|:|
| UIViewAnimationOptionLayoutSubviews | 提交动画的时候布局子控件，表示子控件将和父控件一同动画 |
| UIViewAnimationOptionAllowUserInteraction | 动画时允许用户交流，比如触摸 |
| UIViewAnimationOptionBeginFromCurrentState | 从当前状态开始动画 |
| UIViewAnimationOptionRepeat | 动画无限重复 |
| UIViewAnimationOptionAutoreverse | 执行动画回路,前提是设置动画无限重复 |
| UIViewAnimationOptionOverrideInheritedDuration | 忽略外层动画嵌套的执行时间 |
| UIViewAnimationOptionOverrideInheritedCurve | 忽略外层动画嵌套的时间变化曲线 |
| UIViewAnimationOptionAllowAnimatedContent | 通过改变属性和重绘实现动画效果，如果key没有提交动画将使用快照|
| UIViewAnimationOptionShowHideTransitionViews | 用显隐的方式替代添加移除图层的动画效果|
| UIViewAnimationOptionOverrideInheritedOptions | 忽略嵌套继承的选项|

| 时间函数曲线相关||
|:|
| UIViewAnimationOptionCurveEaseInOut | 时间曲线函数，由慢到快|
| UIViewAnimationOptionCurveEaseIn | 时间曲线函数，由慢到特别快 |
| UIViewAnimationOptionCurveEaseOut | 时间曲线函数，由快到慢 |
| UIViewAnimationOptionCurveLinear | 时间曲线函数，匀速 |

|转场动画相关的 ||
|:|
| UIViewAnimationOptionTransitionNone | 无转场动画 |
| UIViewAnimationOptionTransitionFlipFromLeft | 转场从左翻转 |
| UIViewAnimationOptionTransitionFlipFromRight | 转场从右翻转 |
| UIViewAnimationOptionTransitionCurlUp | 上卷转场 |
| UIViewAnimationOptionTransitionCurlDown | 下卷转场 |
| UIViewAnimationOptionTransitionCrossDissolve | 转场交叉消失 |
| UIViewAnimationOptionTransitionFlipFromTop | 转场从上翻转 |
| UIViewAnimationOptionTransitionFlipFromBottom | 转场从下翻转 |

completion —— 为动画执行完毕以后执行的代码块
animations —— 动画效果的代码块（动画结束以后的效果）

iOS之弹簧效果动画

码农公寓

相关文章