简介
IOS 动画主要是指Core Animation框架。官方使用文档地址为:Core Animation Guide。
Core Animation是IOS和OS X平台上负责图形渲染与动画的基础框架。Core Animation可以作用与动画视图或者其他可视元素,为你完成了动画所需的大部分绘帧工作。你只需要配置少量的动画参数(如开始点的位置和结束点的位置)即可使用Core Animation的动画效果。Core Animation将大部分实际的绘图任务交给了图形硬件来处理,图形硬件会加速图形渲染的速度。这种自动化的图形加速技术让动画拥有更高的帧率并且显示效果更加平滑,不会加重CPU的负担而影响程序的运行速度。
那些酷炫的实现,其实进行步骤分解,你就会发现都是基础动画合理的搭配组合,对坐标尺寸、视图显示、形态变化一一进行了代码描述,就形成了你呈现在你眼前的动画效果。
结构
常用属性
duration:动画持续时间
beginTime:动画开始时间
repeatCount:动画重复次数
autoreverses:执行的动画按照原动画返回执行
timingFunction:控制动画的显示节奏,系统主要提供了以下几种
kCAMediaTimingFunctionLinear 线性动画
kCAMediaTimingFunctionEaseIn 先慢后快(慢进快出)
kCAMediaTimingFunctionEaseOut 先块后慢(快进慢出)
kCAMediaTimingFunctionEaseInEaseOut 先慢后快再慢
kCAMediaTimingFunctionDefault 默认,也属于中间比较快
delegate : 动画代理。能够检测动画的执行和结束。
@interface NSObject (CAAnimationDelegate)
- (void)animationDidStart:(CAAnimation *)anim;
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;
@end
path:关键帧动画中的执行路径
type:过渡动画的动画类型,系统提供了四种过渡动画。
kCATransitionFade 渐变效果
kCATransitionMoveIn 进入覆盖效果
kCATransitionPush 推出效果
kCATransitionReveal 揭露离开效果 subtype : 过渡动画的动画方向
kCATransitionFromRight 从右侧进入
kCATransitionFromLeft 从左侧进入
kCATransitionFromTop 从顶部进入
kCATransitionFromBottom 从底部进入
动画的三种调用方式
使用block
[UIView animateWithDuration:1.0f animations:^{
self.animationView.frame = CGRectMake(SCREEN_WIDTH, SCREEN_HEIGHT/2-100, 50, 50);
} completion:^(BOOL finished) {
}];
UIView [begin commit]
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0f];
self.animationView.frame = CGRectMake(SCREEN_WIDTH, SCREEN_HEIGHT/2-100, 50, 50);
[UIView commitAnimations];
CABaseAnimation
CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:@"position"];
anima.fromValue = [NSValue valueWithCGPoint:CGPointMake(0, SCREEN_HEIGHT/2-100)];
anima.toValue = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH, SCREEN_HEIGHT/2-75)];
anima.duration = 2.0f;
//fillMode=kCAFillModeForwards和removedOnComletion=NO
anima.fillMode = kCAFillModeBackwards;
anima.removedOnCompletion = YES;
anima.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
[self.animationView.layer addAnimation:anima forKey:@"positionAnimation"];
一、基础动画
重要属性
fromValue:keyPath对应的初始值
toValue:keyPath对应的结束值
基础动画主要提供了对于CALayer对象中的可变属性进行简单动画的操作。比如:位移(position)、透明度(opacity)、缩放(scale)、旋转(rotate)、背景色(backgroundColor)等等。
具体效果实例演示
二、关键帧动画(keyAnimation)
具体效果实例演示
三、动画组(animationGroup)
具体效果实例演示
三、转场动画 (transition)
iOS7开始,苹果就提供了自定义转场的API,模态推送present和dismiss、导航控制器push和pop、标签控制器的控制器切换都可以自定义转场,具体效果实例演示
1、转场协议
转场动画的实现 遵从上面这个协议以及实现协议中的两个方法,如下:
//返回动画事件
- (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext;
//所有的过渡动画事务都在这个方法里面完成
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext;
四、动画扩展
1、Lottie动画库
1.1、简介
Easily add high-quality animation to any native app.
Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.
简单的为任何原生APP添加高质量动画
Lottie是一个iOS,Android和React Native库,可以实时渲染After Effects动画,并且允许本地app像静态资源那样轻松地使用动画。