1. UIView属性动画
常用方法animateWithDuration
duration,动画时间
delay,动画在耽误多久之后实验
options,动画的展示方式
animations,动画代码
completion,动画完成后代码
// 动画时间,,options,completion+ (void)animateWithDurationNSTimeInterval)duration delayNSTimeInterval)delay optionsUIViewAnimationOptions)options animationsvoid (^)(void))animations completionvoid (^ __nullable)(BOOL finished))completion)// delay = 0.0, options = 0, completion = NULL+ (void)animateWithDurationNSTimeInterval)duration animationsvoid (^)(void))animations)// delay = 0.0, options = 0+ (void)animateWithDurationNSTimeInterval)duration animationsvoid (^)(void))animations completionvoid (^ __nullable)(BOOL finished))completion)1.1 可实现动画的属性
frame,实现移动的动画效果
bounds,实现内部子控件移动的动画效果
center,实现移动的动画效果
alpha,实现淡入淡出的动画效果
backgroundColor,实现配景致渐变的动画效果
transform,实现移动、缩放、旋转的动画效果,详见iOS CGAffineTransform仿射变动
frame属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.frame = CGRectMake(20, 80, 240, 240);} completion:nil];bounds属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.bounds = CGRectMake(30, 30, 160, 160);} completion:nil];center属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.center = CGPointMake(160, 220);} completion:nil];alpha属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.alpha = 0.2;} completion:nil];
backgroundColor属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.backgroundColor = [UIColor blueColor];} completion:nil];transform属性
[UIView animateWithDuration:1 animations:^(void) { self.animationView.transform = CGAffineTransformMakeRotation(M_PI_4);} completion:nil];
1.2 options动画的展示方式
options是UIViewAnimationOptions,主要分为3种
动画效果
值分析UIViewAnimationOptionLayoutSubviews提交动画的时间结构子控件,表现子控件将和父控件一同动画。UIViewAnimationOptionAllowUserInteraction动画时答应用户交换,好比触摸UIViewAnimationOptionBeginFromCurrentState从当前状态开始动画UIViewAnimationOptionRepeat动画无穷重复UIViewAnimationOptionAutoreverse实验动画回路,条件是设置动画无穷重复UIViewAnimationOptionOverrideInheritedDuration忽略外层动画嵌套的实验时间UIViewAnimationOptionOverrideInheritedCurve忽略外层动画嵌套的时间变革曲线UIViewAnimationOptionAllowAnimatedContent通过改变属性和重绘实现动画效果,如果key没有提交动画将使用快照UIViewAnimationOptionShowHideTransitionViews用显隐的方式更换添加移除图层的动画效果UIViewAnimationOptionOverrideInheritedOptions忽略嵌套继续的选项动画运行加快
值分析UIViewAnimationOptionCurveEaseInOut由慢到快再到慢UIViewAnimationOptionCurveEaseIn由慢到快UIViewAnimationOptionCurveEaseOut由快到慢UIViewAnimationOptionCurveLinear匀速分别接纳四种加快模式UIViewAnimationOptionCurveEaseInOut, UIViewAnimationOptionCurveEaseIn, UIViewAnimationOptionCurveEaseOut, UIViewAnimationOptionCurveLinear
转场动画
值分析UIViewAnimationOptionTransitionNone无转场动画UIViewAnimationOptionTransitionFlipFromLeft转场从左翻转UIViewAnimationOptionTransitionFlipFromRight转场从右翻转UIViewAnimationOptionTransitionCurlUp上卷转场UIViewAnimationOptionTransitionCurlDown下卷转场UIViewAnimationOptionTransitionCrossDissolve转场交织消散UIViewAnimationOptionTransitionFlipFromTop转场从上翻转UIViewAnimationOptionTransitionFlipFromBottom转场从下翻转1.3 弹簧效果
弹簧效果的方法多了两个参数dampingRatio和velocity
+ (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;dampingRatio参数的值为0.0f到1.0f,数值越小「弹簧」的振动效果越显着。
分别设置为0.2、0.5和1,显示如下:
velocity参数表现初始的速率,数值越大一开始移动越快。
分别设置为5、10和20,效果如下:
2. UIView过渡动画
当一个视图的内容需要变革时,可以使用过渡动画。
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^ __nullable)(void))animations completion:(void (^ __nullable)(BOOL finished))completion);view是加入转换的视图,options是UIViewAnimationOptions范例,
UIViewAnimationOptionTransitionCurlUp和UIViewAnimationOptionTransitionCurlDownUIViewAnimationOptionTransitionCrossDissolveUIViewAnimationOptionTransitionFlipFromLeft和UIViewAnimationOptionTransitionFlipFromRight
UIViewAnimationOptionTransitionFlipFromTop和UIViewAnimationOptionTransitionFlipFromBottom另有一个过渡动画的方法,在动画过程中,起首将fromView从父视图中删除,然后将toView添加,就是做了一个更换利用。
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^ __nullable)(BOOL finished))completion);3. UIView关键帧动画
duration,总连续时间
options,摆列UIViewKeyframeAnimationOptions
frameStartTime,相对开始时间
frameDuration,相对连续时间
+ (void)animateKeyframesWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewKeyframeAnimationOptions)options animations:(void (^)(void))animations completion:(void (^ __nullable)(BOOL finished))completion);+ (void)addKeyframeWithRelativeStartTime:(double)frameStartTime relativeDuration:(double)frameDuration animations:(void (^)(void))animations);options可以指定动画效果:
值分析UIViewKeyframeAnimationOptionLayoutSubviews提交动画的时间结构子控件,表现子控件将和父控件一同动画。UIViewKeyframeAnimationOptionAllowUserInteraction动画时答应用户交换,好比触摸UIViewKeyframeAnimationOptionBeginFromCurrentState从当前状态开始动画UIViewKeyframeAnimationOptionRepeat动画无穷重复UIViewKeyframeAnimationOptionAutoreverse实验动画回路,条件是设置动画无穷重复UIViewKeyframeAnimationOptionOverrideInheritedDuration忽略外层动画嵌套的实验时间UIViewKeyframeAnimationOptionOverrideInheritedOptions忽略外层动画嵌套的时间变革曲线UIViewKeyframeAnimationOptionCalculationModeLinear选择使用一个简朴的线性插值盘算的时间关键帧之间的值UIViewKeyframeAnimationOptionCalculationModeDiscrete选择不插入关键帧之间的值,而是直接跳到每个新的关键帧的值UIViewKeyframeAnimationOptionCalculationModePaced选择盘算中心帧数值算法使用一个简朴的节奏。这个选项的效果在一个匀称的动画UIViewKeyframeAnimationOptionCalculationModeCubic选择盘算中心帧使用默认卡特莫尔罗花键,通过关键帧的值UIViewKeyframeAnimationOptionCalculationModeCubicPaced选择盘算中心帧使用立方筹划而忽略的时间属性动画示例代码
[UIView animateKeyframesWithDuration:1 delay:0 options:0 animations:^{ [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:0.2 animations:^{ self.magentaView.frame = CGRectMake(120, 100, 160, 160); }]; [UIView addKeyframeWithRelativeStartTime:0.2 relativeDuration:0.7 animations:^{ self.magentaView.frame = CGRectMake(160, 240, 80, 80); }]; [UIView addKeyframeWithRelativeStartTime:0.7 relativeDuration:1 animations:^{ self.magentaView.frame = CGRectMake(20, 100, 160, 160); }];} completion:nil];源码下载: https://github.com/nai-chen/IosBlog |