首页 » iOS编程(第4版) » iOS编程(第4版)全文在线阅读

《iOS编程(第4版)》27.1 基础动画

关灯直达底部

为应用添加适当的动画是提升用户体验的最佳方式。实际上,并不只是游戏类应用才需要动画,普通应用也可以通过动画提升界面的流畅性,例如,当界面元素出现或消失时,可以使用过渡动画减少突兀感;如果需要重点强调界面上的某个功能,或提示用户执行某项操作,则可以使用动画吸引用户的注意力;当用户执行完一项操作后,可以使用动画告诉用户执行结果和下一步操作。

在为HypnoNerd添加动画之前,首先需要查看iOS提供了哪些动画效果。打开Xcode文档,搜索UIView,然后在搜索结果中打开UIView类参考手册(UIView Class Reference),找到动画(Animations)部分。文档中列出了使用动画API的建议(文档建议iOS 4之后应该使用带有Block对象的动画API,本书也将使用这类API),以及UIView中可以添加动画效果的属性(见图27-1)。

图27-1 UIView动画文档

读者在开始学习一项新技术时,查看文档是最好的学习方式。根据文档提供的信息,下面请读者尝试为HypnoNerd添加一些动画效果。首先添加基础动画(basic animation)。基础动画非常简单,只要提供UIView属性的起始值和终止值就可以了(见图27-2)。

图27-2 基础动画

打开HypnoNerd.xcodeproj,首先为UILabel对象添加透明度(alpha属性)的淡入动画效果。

打开BNRHypnosisViewController.m,修改drawHypnoticMessage:方法,代码如下:

[self.view addSubview:messageLabel];

// 设置messageLabel透明度的起始值

messageLabel.alpha = 0.0;

// 让messageLabel的透明度由0.0变为1.0

[UIView animateWithDuration:0.5 animations:^{

messageLabel.alpha = 1.0;

}];

UIInterpolatingMotionEffect *motionEffect =

[[UIInterpolatingMotionEffect alloc] initWithKeyPath:@“center.x”

type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];

构建并运行应用。输入一些文字后点击Done,UILabel对象会有淡入的动画效果。显然,相比让UILabel对象突然出现在屏幕上,淡入动画更加流畅自然。

在带有Block对象的动画API中,最简单的就是animateWithDuration:animations:。该方法有两个参数,第一个参数是动画持续时间,第二个参数是用于执行动画的Block对象。该方法会遵循一个渐快-渐慢(ease-in/ease-out)的速度曲线,也就是说,动画开始时会逐渐加快,结束时会逐渐减慢。

时间函数

动画的速度曲线是由时间函数(timing function)控制的。animateWithDuration: animations:使用默认的渐快-渐慢函数。其他时间函数还包括线性函数(速度保持不变)、渐快函数(速度逐渐加快)和渐慢函数(速度逐渐减慢)等。

如果需要设置动画的时间函数,则可以使用animateWithDuration:delay:options: animations:completion:方法。options:参数中可以设置时间函数和其他一些选项(稍后将介绍可以设置的选项)。除此之外,该方法还可以使动画延迟一段时间执行(delay:),以及在动画结束时执行特定的代码(completion:)。

在BNRHypnosisViewController.m中修改drawHypnoticMessage:,使用新的动画方法:

[self.view addSubview:messageLabel];

// 设置messageLabel透明度的起始值

messageLabel.alpha = 0.0;

// 让messageLabel的透明度由0.0变为1.0

[UIView animateWithDuration:0.5 animations:^{

messageLabel.alpha = 1.0;

}];

[UIView animateWithDuration:0.5

delay:0.0

options:UIViewAnimationOptionCurveEaseIn

animations:^{

messageLabel.alpha = 1.0;

}

completion:NULL];

UIInterpolatingMotionEffect *motionEffect =

[[UIInterpolatingMotionEffect alloc] initWithKeyPath:@“center.x”

type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];

与之前不同,这次使用的是渐快函数(UIViewAnimationOptionCurveEaseIn),动画结束时速度将不会逐渐减慢。options:中使用的是位掩码,可以使用按位或运算符(“|”)将多个选项值连接起来。以下是常用的选项值。

时间函数选项,控制动画的时间函数曲线

•UIViewAnimationOptionCurveEaseInOut

•UIViewAnimationOptionCurveEaseOut

•UIViewAnimationOptionCurveEaseIn

•UIViewAnimationOptionCurveLinear

UIViewAnimationOptionAllowUserInteraction

只有显式设置了该选项,视图在动画过程中才能响应用户事件。该选项通常用于重复动画,例如在抖动的视图中需要响应用户点击事件,以便执行删除操作(类似于在主屏幕中删除某个应用)。

UIViewAnimationOptionRepeat

让动画反复执行。该选项通常与UIViewAnimationOptionAutoreverse结合使用。

UIViewAnimationOptionAutoreverse

让UIView的属性从起始值变化到终止值后自动执行反转动画,再从终止值变化到起始值。

UIView类参考手册的Constants(常量)部分列举了所有可用的动画选项。本章稍后还会介绍更多选项。