UIView Animation 是UIKit 框架中,针对UIView 动画做的封装。
一、 首先看 UIView(UIViewAnimation) 类别
1、主要方法:
+ (void)beginAnimations:(nullable NSString *)animationID context:(nullable void*)context; // 事务开始,标记开始添加动画内容,可以填写id 与上下文,与commitAnimations成对出现,中间可以嵌套beginAnimations/commitAnimations组合。
+ (void)commitAnimations; //事务提交,标示动画启动,顶层动画是提交
2、常见方法:
需要设置在beginAnimations/commitAnimations之间或者动画的block里,
+ (void)setAnimationDelegate:(nullableid)delegate; // 设置动画的代理
+ (void)setAnimationWillStartSelector:(nullable SEL)selector; // 设置动画即将开始的监听方法
+ (void)setAnimationDidStopSelector:(nullable SEL)selector; // 设置动画结束的监听方法
+ (void)setAnimationDuration:(NSTimeInterval)duration; // 设置动画时间,默认0.2秒
+ (void)setAnimationDelay:(NSTimeInterval)delay; // 设置动画延时时间 默认0秒
+ (void)setAnimationStartDate:(NSDate*)startDate; // 设置动画开始时间,默认是当前时间
+ (void)setAnimationCurve:(UIViewAnimationCurve)curve; // 动画的节奏控制 默认淡入淡出
动画的节奏效果:
typedef NS_ENUM(NSInteger, UIViewAnimationCurve) {
UIViewAnimationCurveEaseInOut, //淡入淡出
UIViewAnimationCurveEaseIn, //开始慢
UIViewAnimationCurveEaseOut, //结束慢
UIViewAnimationCurveLinear //线性的
};
+ (void)setAnimationRepeatCount:(float)repeatCount; //动画的重复次数
+ (void)setAnimationRepeatAutoreverses:(BOOL)repeatAutoreverses; //如果设置为YES,代表动画每次重复执行的效果会跟上一次相反
+ (void)setAnimationBeginsFromCurrentState:(BOOL)fromCurrentState; // 如果设置为YES那么当动画在运行过程中,当前视图的位置将会作为新的动画的开始状态。如果设置为NO,当前动画结束前新动画将使用视图最后状态的位置作为开始状态。
+ (void)setAnimationTransition:(UIViewAnimationTransition)transition forView:(UIView*)view cache:(BOOL)cache; // 设置视图view的过渡效果; transition指定过渡类型;参数cache,如果是YES,那么在开始和结束图片视图渲染一次并在动画中创建帧,否则视图将会在每一帧都渲染。例如缓存,你不需要在视图转变中不停的更新,你只需要等到转换完成再去更新视图。
动画效果:
typedef NS_ENUM(NSInteger, UIViewAnimationTransition) {
UIViewAnimationTransitionNone, 没有动画效果
UIViewAnimationTransitionFlipFromLeft, 从左向右旋转翻页
UIViewAnimationTransitionFlipFromRight, 从右向左旋转翻页
UIViewAnimationTransitionCurlUp, 卷曲翻页,从下往上
UIViewAnimationTransitionCurlDown, 卷曲翻页,从上往下
};
+ (void)setAnimationsEnabled:(BOOL)enabled; //设置是否激活动画,如果是YES那就激活动画,否则NO。默认是YES
+ (BOOL)areAnimationsEnabled; //返回一个布尔值表示动画是否结束。如果动画结束返回YES,否则NO。
+ (void)performWithoutAnimation:(void (^)(void))actionsWithoutAnimation NS_AVAILABLE_IOS(7_0); //可以强制一些动作不使用动画,它是一个简单的封装,先检查动画当前是否启用,然后禁止动画,执行块语句,最后重新启用动画。一个需要说明的地方是,它并不会阻塞基于CoreAnimation的动画。iOS7的新方法
二、UIView(UIViewAnimationWithBlocks)主要是UIView基于block形式的基本动画
1、基本动画
+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void(^)(void))animations completion:(void(^__nullable)(BOOLfinished))completion;
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void(^)(void))animations completion:(void(^__nullable)(BOOLfinished))completion;
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void(^)(void))animations;
上述三个方法类似,课根据需要选用合适的方法,
参数解析:
duration:动画时长
delay:动画延时时长
options:动画类型参数
animations:动画内容block
completion:动画完成后block
代码示例:
[UIView animateWithDuration:2 //动画时长 单位为秒
delay:0//动画延时, 不需要延时,设0
options:UIViewAnimationOptionCurveEaseInOut //执行的动画选项
animations:^{//动画的内容
self.customView.transform=CGAffineTransformMakeScale(0.1,0.1);
}completion:^(BOOLfinished) {
//嵌套动画(恢复原来视图大小)
[UIViewanimateWithDuration:1animations:^{
self.customView.transform=CGAffineTransformMakeScale(1,1);
}];
}];
下边是options参数解析:
/*
1.常规动画属性设置(可以同时选择多个进行设置)
UIViewAnimationOptionLayoutSubviews:动画过程中保证子视图跟随运动。**提交动画的时候布局子控件,表示子控件将和父控件一同动画。**
UIViewAnimationOptionAllowUserInteraction:动画过程中允许用户交互。
UIViewAnimationOptionBeginFromCurrentState:所有视图从当前状态开始运行。
UIViewAnimationOptionRepeat:重复运行动画。
UIViewAnimationOptionAutoreverse :动画运行到结束点后仍然以动画方式回到初始点。**执行动画回路,前提是设置动画无限重复**
UIViewAnimationOptionOverrideInheritedDuration:忽略嵌套动画时间设置。**忽略外层动画嵌套的时间变化曲线**
UIViewAnimationOptionOverrideInheritedCurve:忽略嵌套动画速度设置。**通过改变属性和重绘实现动画效果,如果key没有提交动画将使用快照**
UIViewAnimationOptionAllowAnimatedContent:动画过程中重绘视图(注意仅仅适用于转场动画)。
UIViewAnimationOptionShowHideTransitionViews:视图切换时直接隐藏旧视图、显示新视图,而不是将旧视图从父视图移除(仅仅适用于转场动画)**用显隐的方式替代添加移除图层的动画效果**
UIViewAnimationOptionOverrideInheritedOptions :不继承父动画设置或动画类型。**忽略嵌套继承的选项**
----------------------------------------------------------------------------
2.动画速度控制(可从其中选择一个设置)时间函数曲线相关**时间曲线函数**
UIViewAnimationOptionCurveEaseInOut:动画先缓慢,然后逐渐加速。
UIViewAnimationOptionCurveEaseIn :动画逐渐变慢。
UIViewAnimationOptionCurveEaseOut:动画逐渐加速。
UIViewAnimationOptionCurveLinear :动画匀速执行,默认值。
-----------------------------------------------------------------------------
3.转场类型(仅适用于转场动画设置,可以从中选择一个进行设置,基本动画、关键帧动画不需要设置)**转场动画相关的**
UIViewAnimationOptionTransitionNone:没有转场动画效果。
UIViewAnimationOptionTransitionFlipFromLeft :从左侧翻转效果。
UIViewAnimationOptionTransitionFlipFromRight:从右侧翻转效果。
UIViewAnimationOptionTransitionCurlUp:向后翻页的动画过渡效果。
UIViewAnimationOptionTransitionCurlDown :向前翻页的动画过渡效果。
UIViewAnimationOptionTransitionCrossDissolve:旧视图溶解消失显示下一个新视图的效果。
UIViewAnimationOptionTransitionFlipFromTop :从上方翻转效果。
UIViewAnimationOptionTransitionFlipFromBottom:从底部翻转效果。
*/
2、带弹簧效果动画
+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay usingSpringWithDamping:(CGFloat)dampingRatio initialSpringVelocity:(CGFloat)velocity options:(UIViewAnimationOptions)options animations:(void(^)(void))animations completion:(void(^__nullable)(BOOLfinished))completion;
参数:
dampingRatio: 阻尼系数 值越小弹簧效果越明显 取值0到1
velocity: 初始的速度,数值越大一开始移动越快
代码示例:
[UIView animateWithDuration:2
delay:0
usingSpringWithDamping:0.1
initialSpringVelocity:1
options:UIViewAnimationOptionCurveEaseIn
animations:^{
self.customView.transform = CGAffineTransformMakeTranslation(0, 200);
}completion:^(BOOLfinished) {
[UIView animateWithDuration:2 animations:^{
self.customView.transform = CGAffineTransformMakeTranslation(0, 0);
}];
}];
3、转场动画
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion
参数解析:
duration:动画的持续时间
view:需要进行转场动画的视图
options:转场动画的类型
animations:将改变视图属性的代码放在这个block中
completion:动画结束后,会自动调用这个block
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion
方法调用完毕后,相当于执行了下面两句代码:
// 添加toView到父视图
[fromView.superview addSubview:toView];
// 把fromView从父视图中移除
[fromView removeFromSuperview];
参数解析:
duration:动画的持续时间
options:转场动画的类型
animations:将改变视图属性的代码放在这个block中
completion:动画结束后,会自动调用这个block
[UIView transitionWithView:self.customView duration:2 options:(UIViewAnimationOptionTransitionCurlUp) animations:^{
[self.customView exchangeSubviewAtIndex:0 withSubviewAtIndex:1]; }completion:^(BOOLfinished) {
}];
三 、UIView (UIViewKeyframeAnimations) 是基于UIView形式的关键帧动画
1、方法
关键帧动画核心方法有两个,要同时使用:
+ (void)animateKeyframesWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewKeyframeAnimationOptions)options animations:(void(^)(void))animations completion:(void(^__nullable)(BOOLfinished))completion;
参数解析:
duration:动画总时长
delay:动画延时时长
options:动画类型参数
animations:动画内容block
completion:动画完成后block
+ (void)addKeyframeWithRelativeStartTime:(double)frameStartTime relativeDuration:(double)frameDuration animations:(void(^)(void))animations;
参数解析:
frameStartTime:相对于Duration所开始的时间(第0秒开始动画)
frameDuration:相对于Duration所持续的时间
animations:动画内容block
代码示例:
[UIView animateKeyframesWithDuration:6 delay:0 options:(UIViewKeyframeAnimationOptionRepeat) animations:^{
[UIView addKeyframeWithRelativeStartTime:0.0 // 相对于6秒所开始的时间(第0秒开始动画)
relativeDuration:1/3.0// 相对于6秒动画的持续时间(动画持续2秒)
animations:^{
self.customView.backgroundColor= [UIColorcolorWithRed:RandomColorgreen:RandomColorblue:RandomColoralpha:1];
}];
[UIView addKeyframeWithRelativeStartTime:1/3.0 // 相对于6秒所开始的时间(第2秒开始动画)
relativeDuration:1/3.0// 相对于6秒动画的持续时间(动画持续2秒)
animations:^{ self.customView.backgroundColor= [UIColorcolorWithRed:RandomColorgreen:RandomColorblue:RandomColoralpha:1];
}];
[UIView addKeyframeWithRelativeStartTime:2/3.0 // 相对于6秒所开始的时间(第4秒开始动画)
relativeDuration:1/3.0// 相对于6秒动画的持续时间(动画持续2秒)
animations:^{
self.customView.backgroundColor= [UIColorcolorWithRed:RandomColorgreen:RandomColorblue:RandomColoralpha:1]; }];
}completion:nil];
关于UIView Animation ,就写到这里了,附demo一份GitHub - Tony-iOS-Personal/AnimationDemo: 关于动画的总结demo