您的位置:首页 > 产品设计 > UI/UE

IOS中UIView动画的简单实现

2014-08-04 00:47 302 查看
简述:

iOS的UIView类为我们提供了一系列的类方法来实现动画效果,在UIView对象或者它对应的CALayer对象中支持动画效果的属性有如下:

frame

bounds

center

transform

alpha

backgroundColor

1、通过UIView(UIViewAnimation)分类实现动画,这种方式是最原始的方式,所有的动画块代码都定义在commitAnimations方法之前

[objc] view
plaincopy

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic,retain)UIView *anView;

@end

@implementation ViewController

- (void)viewDidLoad

{

[super viewDidLoad];

UIButton *animationButton = [UIButton buttonWithType:UIButtonTypeCustom];

animationButton.frame = CGRectMake(0, 64, 200, 50);

[animationButton addTarget:self action:@selector(beginAnimation) forControlEvents:UIControlEventTouchUpInside];

[self.view addSubview:animationButton];

[animationButton setTitle:@"动画" forState:UIControlStateNormal];

[animationButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];

[animationButton setBackgroundColor:[UIColor blueColor]];

_anView = [[UIView alloc] initWithFrame:CGRectMake(0, 115, 320, 500)];

_anView.backgroundColor = [UIColor redColor];

[self.view addSubview:_anView];

// Do any additional setup after loading the view, typically from a nib.

}

- (void)beginAnimation{

/**

1、所有动画属性的设置和实现动画效果的代码必须放在beginAnimations:context:和commitAnimations快中

*/

[UIView beginAnimations:@"firstAnimation" context:nil];

[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];

[UIView setAnimationDidStopSelector:@selector(stop)];

[UIView setAnimationDuration:1.0f];

// --实现大小缩放一倍的动画效果

self.anView.transform = CGAffineTransformMakeScale(0.5f, 0.5f);

[UIView commitAnimations];

// --或者用层也可以实现动画效果</span>

[UIView beginAnimations:nil context:NULL];

CGAffineTransform moveTransform = CGAffineTransformMakeTranslation(180, 200);

self.anView.layer.affineTransform=moveTransform;

[UIView commitAnimations];

}

[objc] view
plaincopy

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">2、通过UIView(UIViewAnimationWithBlocks分类实现动画</span>

iOS4及以后推荐这种方式,它通过块的形式使得动画的实现代码简洁明了。二者原理是一样的,下面看一段代码

3、关键帧动画

iOS7为UIView封装了一组API,让我们很容易的得到与Core Animation框架中的CAKeyframeAnimation一样的效果。新引入的animateKeyframesWithDuration与CAKeyframeAnimation的关系,可以比对animateWithDuration和CABasicAnimation,我们只需要将每一帧动画加入到block方法中,并传入此段动画在全过程中的相对开始时间和执行时间(duration具体是指此段动画的执行时间占全过程的百分比)。同时,你可以在一次动画中使用多个关键帧,只需使用addKeyframe依次将所有关键帧加入动画执行栈中。

[objc] view
plaincopy

[UIView animateKeyframesWithDuration:duration delay:delay

options:options animations:^{

[UIView addKeyframeWithRelativeStartTime:0.0

relativeDuration:0.5 animations:^{

//第一帧要执行的动画

}];

[UIView addKeyframeWithRelativeStartTime:0.5

relativeDuration:0.5 animations:^{

//第二帧要执行的动画

}];

} completion:^(BOOL finished) {

//动画结束后执行的代码块

}];

4、弹簧动画

iOS7新引入的另一个block方法可以让你轻松将真实物理世界中的弹性效果集成进视图动画中。苹果公司一直建议开发者尽可能将动画效果做的跟真实物理世界一样——在视图滑动时,可以像弹簧一样,稍微拉伸一些,再弹回正确位置。使用新的弹簧动画API来实现此效果相较以往要简单很多。

[objc] view
plaincopy

[UIView animateWithDuration:duration delay:delay

usingSpringWithDamping:damping initialSpringVelocity:velocity

options:options animations:^{

//这里书写动画相关代码

} completion:^(BOOL finished) {

//动画结束后执行的代码块

}];

这里用到了一些物理上的概念:damping参数代表弹性阻尼,随着阻尼值越来越接近0.0,动画的弹性效果会越来越明显,而如果设置阻尼值为1.0,则视图动画不会有弹性效果——视图滑动时会直接减速到0并立刻停止,不会有弹簧类的拉伸效果。

velocity参数代表弹性修正速度,它表示视图在弹跳时恢复原位的速度,例如,如果在动画中视图被拉伸的最大距离是200像素,你想让视图以100像素每秒的速度恢复原位,那么就设置velocity的值为0.5。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: