在应用中加入适当的动画,可以赋予界面视觉线索,帮助用户了解应用的工作流程,从而营造更好的用户体验。这里我们的基础动画主要是基于类UIView的动画。
通过查阅文档,我们发现UIView类提供了基础动画的实现。SDK提供了两种方法来初始化一个动画:
- iOS4及其以后版本,使用基于块(block-based)的动画方法,这也是官方推荐的方法;
- 使用开始/提交(begin/commit)动画方法。
基于块的动画方法是很简单的,我们只需要使用类似(animateWithDuration:animations:)这样的方法,设定某个UIView的终止状态,就可以实现一个简单的动画了。然而这种方法只支持iOS4及其以上的版本,如果需要支持低于这些版本的话,则需要使用第二种方式(开始/提交动画)来实现。
以下这些属性是可以用来标识UIView的终止状态的,修改这些属性值可以触发动画效果。
- frame
- bounds
- center
- transform
- alpha
- backgroundColor
- contentStretch
首先我们来看一下常用的最基本的方法。其中duration就是动画持续时间, animations快中实现需要动画效果的view的相关属性。第二个方法还有一个completion块参数,这个块会在动画结束时被调用,所以我们可以在这里当动画结束后更新一些属性或进行下一个动画。
+ (void)animateWithDuration:(NSTimeInterval)duration
animations:(void (^)(void))animations
+ (void)animateWithDuration:(NSTimeInterval)duration
animations:(void (^)(void))animations
completion:(void (^)(BOOL finished))completion
= =。比如我们来写个小例子,让一个UILabel以渐变的方式出现。
//初始化Label的透明度为0
aLabel.alpha = 0.0;
[UIView animateWithDuration:0.5 animations:^
{
//在这里设定动画结束时Label的效果
aLabel.alpha = 1.0;
}];
是不是很简单!是不是很简单!是不是很简单!
//我会更新的!
动画的速度曲线都是由时间函数来控制的。我们上面提到的两个方法默认都是使用渐快-渐慢函数。而官方还给我们提供了以下多种不同的时间函数。
UIViewAnimationOptionCurveEaseInOut
UIViewAnimationOptionCurveEaseIn
UIViewAnimationOptionCurveEaseOut
UIViewAnimationOptionCurveLinear
如果我们需要对动画进行一些设定,那么之前那两个函数则无法满足我们的需求,所以我们需要另外一个方法。
+ (void)animateWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
options:(UIViewAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^)(BOOL finished))completion
这个方法比之前的参数多了一些,比如delay表示动画延时多久发生,options则是我们关注的可选参数。这些参数除了可以设置为上面的时间函数之外,还可以设置一些别的参数,这些参数可以用或(|
)操作符来连接,同时设置多个选项。以下是一些常用的可选参数设置。
UIViewAnimationOptionAllowUserInteraction
只有显示的设置了该选项,视图在动画过程中才能响应用户事件。UIViewAnimationOptionRepeat
让动画反复执行。该选项通常与UIViewAnimationOptionAutoreverse一起使用。UIViewAnimationOptionAutoreverse
让UIView的属性从起始值变化到终止值后自动执行反转动画,再从终止值变化到起始值。
之前的动画都属于基础动画,都是从一个状态变化到另一个状态,UIView的值进行了一次修改。如果我们需要在多个值之间进行变化,那么我们就需要关键帧动画了。首先我们先来看看关键帧动画的相关函数方法。
+ (void)animateKeyframesWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
options:(UIViewKeyframeAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^)(BOOL finished))completion
和之前的一样,duration表示动画持续时间, delay延时执行时间,options可选动画参数,completion动画结束后调用的块。它们最大的不同在于,我们需要在animations中进行动画关键帧的设置,给动画设置多个关键帧。
+ (void)addKeyframeWithRelativeStartTime:(double)frameStartTime
relativeDuration:(double)frameDuration
animations:(void (^)(void))animations
其中第一个参数是相对起始时间,表示该关键帧开始执行的时刻在整个动画持续时间中的百分比,取值范围是0到1.第二个参数是相对持续时间,表示该关键帧占整个动画持续时间的百分比,取值范围也是0到1。
Apple提供了一个轻松为视图添加弹簧动画的方法。
+ (void)animateWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
usingSpringWithDamping:(CGFloat)dampingRatio
initialSpringVelocity:(CGFloat)velocity
options:(UIViewAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^)(BOOL finished))completion
duration为动画持续时间;delay为动画延时执行时间;dampingRatio为弹性阻尼,取值范围是0到1,越接近0,动画的弹性效果就越明显;velocity动画开始时的加速度,通常传入0;options动画选项,与基础动画一样;animation设置动画block;completion动画结束后执行的block。
1 《iOS编程(第四版)》,THE BIG NERD RANCH GUIDE.
2 Apple iOS 9.2 开发文档.