iOS 基本动画、关键帧动画、利用缓动函数实现物理动画效果

iOS基本动画/关键帧动画/利用缓动函数实现物理动画效果

先说下基本动画部分
基本动画部分比较简单, 但能实现的动画效果也很局限
使用方法大致为:
#1. 创建原始UI或者画面
#2. 创建CABasicAnimation实例, 并设置keypart/duration/fromValue/toValue
#3. 设置动画最终停留的位置
#4. 将配置好的动画添加到layer层中
举个例子, 比如实现一个圆形从上往下移动, 上代码:

//设置原始画面UIView *showView= [[UIView alloc] initWithFrame:CGRectMake（0, 0, 100, 100）];showView.layer.masksToBounds= YES;showView.layer.cornerRadius= 50.f;showView.layer.backgroundColor = [UIColor redColor].CGColor;[self.view addSubview:showView];//创建基本动画CABasicAnimation *basicAnimation = [CABasicAnimation animation];//设置属性basicAnimation.keyPath= @"position";basicAnimation.duration = 4.0f;basicAnimation.fromValue = [NSValue valueWithCGPoint:showView.center];basicAnimation.toValue= [NSValue valueWithCGPoint:CGPointMake（50, 300）];//设置动画结束位置showView.center = CGPointMake（50, 300）;//添加动画到layer层[showView.layer addAnimation:basicAnimation forKey:nil];

接下来说下关键帧动画
其实跟基本动画差不多, 只是能设置多个动画路径使用方法也类似, 大致为
#1. 创建原始UI或者画面
#2. 创建CAKeyframeAnimation实例, 并设置keypart/duration/values 相比基本动画只能设置开始和结束点, 关键帧动画能添加多个动画路径点
#3. 设置动画最终停留的位置
#4. 将配置好的动画添加到layer层中
举个例子, 红色圆形左右晃动往下坠落上代码:

//设置原始画面UIView *showView= [[UIView alloc] initWithFrame:CGRectMake（0, 0, 100, 100）];showView.layer.masksToBounds= YES;showView.layer.cornerRadius= 50.f;showView.layer.backgroundColor = [UIColor redColor].CGColor;[self.view addSubview:showView];//创建关键帧动画CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animation];//设置动画属性keyFrameAnimation.keyPath = @"position";keyFrameAnimation.duration = 4.0f;keyFrameAnimation.values = @[[NSValue valueWithCGPoint:showView.center], [NSValue valueWithCGPoint:CGPointMake（100, 100）], [NSValue valueWithCGPoint:CGPointMake（50, 150）], [NSValue valueWithCGPoint:CGPointMake（200, 200）]];//设置动画结束位置showView.center = CGPointMake（200, 200）;//添加动画到layer层[showView.layer addAnimation:keyFrameAnimation forKey:nil];

最后是利用缓动函数配合关键帧动画实现比较复杂的物理性动画
先说说什么是缓动函数, 就是有高人写了一个库可以计算出模拟物理性动画（比如弹簧效果）所要的路径
Github地址: https://github.com/YouXianMing/EasingAnimation
具体有哪些动画效果可看库中的缓动函数查询表, 简单举个小球落地的效果
上代码:

//设置原始画面UIView *showView= [[UIView alloc] initWithFrame:CGRectMake（0, 0, 100, 100）];showView.layer.masksToBounds= YES;showView.layer.cornerRadius= 50.f;showView.layer.backgroundColor = [UIColor redColor].CGColor;[self.view addSubview:showView];//创建关键帧动画CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animation];//设置动画属性keyFrameAnimation.keyPath = @"position";keyFrameAnimation.duration = 4.0f;    //关键处, 在这里使用的缓动函数计算点路径keyFrameAnimation.values = [YXEasing calculateFrameFromPoint:showView.center toPoint:CGPointMake（50, 300）func:BounceEaseOut frameCount:4.0f * 30];//设置动画结束位置showView.center = CGPointMake（50, 300）;//添加动画到layer层[showView.layer addAnimation:keyFrameAnimation forKey:nil];

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！