Core Animation

来源:互联网 发布:ubuntu系统字体 编辑:程序博客网 时间:2024/05/17 07:47

Core Animation

Core Animation是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍
使用步骤:
1. 初始化一个动画对象(CAAnimation)并设置一些动画相关属性
2. 添加动画对象到层(CALayer)中
3. 开始执行动画
CALayer中很多属性都可以通过CAAnimation实现动画效果
包括:opacity、position、transform、bounds、contents等(可以在API文档中搜索:CALayer Animatable Properties)
通过调用CALayer的addAnimation:forKey增加动画到层(CALayer)中,这样就能触发动画了。
通过调用removeAnimationForKey可以停止层中的动画
Core Animation的动画执行过程都是在后台操作的,不会阻塞主线程

CAAnimation继承结构

这里写图片描述

CAAnimation

它是所有动画对象的父类,负责控制动画的持续时间和速度,是个抽象类,不能直接使用,应该使用它具体的子类
属性:
duration:动画的持续时间

repeatCount:动画的重复次数

repeatDuration:动画的重复时间

removedOnCompletion:默认为YES,代表动画执行完毕后就从图层上移除,图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态,那就设置为NO,不过还要设置fillMode为kCAFillModeForwards

fillMode:决定当前对象在非active时间段的行为.比如动画开始之前,动画结束之后

beginTime:可以用来设置动画延迟执行时间,若想延迟2s,就设置为CACurrentMediaTime()+2,CACurrentMediaTime()为图层的当前时间

timingFunction:速度控制函数,控制动画运行的节奏

timingFunction可选的值有:
kCAMediaTimingFunctionLinear(线性):匀速,给你一个相对静态的感觉
kCAMediaTimingFunctionEaseIn(渐进):动画缓慢进入,然后加速离开
kCAMediaTimingFunctionEaseOut(渐出):动画全速进入,然后减速的到达目的地
kCAMediaTimingFunctionEaseInEaseOut(渐进渐出):动画缓慢的进入,中间加速,然后减速的到达目的地。这个是默认的动画行为。

delegate:动画代理

 @interface NSObject (CAAnimationDelegate) // 动画开始执行的时候触发这个方法 - (void)animationDidStart:(CAAnimation *)anim; // 动画执行完毕的时候触发这个方法 - (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag; @end

CAPropertyAnimation

它是CAAnimation的子类,也是个抽象类,要想创建动画对象,应该使用它的两个子类:CABasicAnimation和CAKeyframeAnimation
属性:
keyPath:通过指定CALayer的一个属性名称为keyPath(NSString类型),并且对CALayer的这个属性的值进行修改,达到相应的动画效果。比如,指定@”position”为keyPath,就修改CALayer的position属性的值,以达到平移的动画效果

CABasicAnimation

它是CAPropertyAnimation的子类
属性:
fromValue:keyPath相应属性的初始值

toValue:keyPath相应属性的结束值

随着动画的进行,在长度为duration的持续时间内,keyPath相应属性的值从fromValue渐渐地变为toValue
如果fillMode=kCAFillModeForwards和removedOnComletion=NO,那么在动画执行完毕后,图层会保持显示动画执行后的状态。但在实质上,图层的属性值还是动画执行前的初始值,并没有真正被改变。比如,CALayer的position初始值为(0,0),CABasicAnimation的fromValue为(10,10),toValue为(100,100),虽然动画执行完毕后图层保持在(100,100)这个位置,实质上图层的position还是为(0,0)

CABasicAnimation用法

 1 // 说明这个动画对象要对CALayer的position属性执行动画 2 CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; 3 // 动画持续1.5s 4 anim.duration = 1.5;  5  6 // position属性值从(50, 80)渐变到(300, 350) 7 anim.fromValue = [NSValue valueWithCGPoint:CGPointMake(50, 80)]; 8 anim.toValue = [NSValue valueWithCGPoint:CGPointMake(300, 350)]; 9 10 // 设置动画的代理11 anim.delegate = self;12 13 // 保持动画执行后的状态14 anim.removedOnCompletion = NO;15 anim.fillMode = kCAFillModeForwards;16 17 // 添加动画对象到图层上18 [_myView.layer addAnimation:anim forKey:@"translate"];

第2行设置的keyPath是@”position”,说明要修改的是CALayer的position属性,也就是会执行平移动画

  • 注意第7、8行,这里并不是直接使用CGPoint这种结构体类型,而是要先包装成NSValue对象后再使用。这2行代码表示CALayer从位置(50, 80)移动到位置(300, 350)

  • 如果将第8行的toValue换成byValue,代表CALayer从位置(50, 80)开始向右移动300、向下移动350,也就是移动到位置(350, 430)

  • 默认情况下,动画执行完毕后,动画会自动从CALayer上移除,CALayer又会回到原来的状态。为了保持动画执行后的状态,可以加入第14、15行代码

  • 第18行后面的@”translate”是给动画对象起个名称,以后可以调用CALayer的removeAnimationForKey:方法根据动画名称停止相应的动画

CAKeyframeAnimation

它是CApropertyAnimation的子类,跟CABasicAnimation的区别是:CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue),而CAKeyframeAnimation会使用一个NSArray保存这些数值
属性:
values:就是上述的NSArray对象。里面的元素称为”关键帧”(keyframe)。动画对象会在指定的时间(duration)内,依次显示values数组中的每一个关键帧

path:可以设置一个CGPathRef\CGMutablePathRef,让层跟着路径移动。path只对CALayer的anchorPoint和position起作用。如果你设置了path,那么values将被忽略

keyTimes:可以为对应的关键帧指定对应的时间点,其取值范围为0到1.0,keyTimes中的每一个时间值都对应values中的每一帧.当keyTimes没有设置的时候,各个关键帧的时间是平分的
CABasicAnimation可看做是最多只有2个关键帧的CAKeyframeAnimation

CAKeyframeAnimation用法

#define SCREEN_WIDTH [UIScreen mainScreen].bounds.size.width#define SCREEN_HEIGHT [UIScreen mainScreen].bounds.size.height@interface ViewController ()@property (strong, nonatomic) IBOutlet UIView *redView;@property (strong, nonatomic) IBOutlet UIView *blackView;@end@implementation ViewController- (void)viewDidLoad {    [super viewDidLoad];}- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{//    [self test1];    [self test2];}// 修改位置:按“已”子路线走- (void)test1{    CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];    animation.keyPath = @"position";    NSValue *value0 = [NSValue valueWithCGPoint:CGPointMake(50, 50)];    NSValue *value1 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH - 50, 50)];    NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH - 50, 150)];    NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(50, 150)];    NSValue *value4 = [NSValue valueWithCGPoint:CGPointMake(50, 250)];    NSValue *value5 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH - 50, 250)];    animation.values = @[value0, value1, value2, value3, value4, value5];    animation.duration = 4;    animation.removedOnCompletion = NO;    animation.fillMode = kCAFillModeForwards;    [self.redView.layer addAnimation:animation forKey:nil];}// 抖动效果- (void)test2{    CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];    animation.keyPath = @"position";    NSValue *value0 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x + 5, self.blackView.center.y)];    NSValue *value1 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x, self.blackView.center.y)];    NSValue *value2 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x - 5, self.blackView.center.y)];    NSValue *value3 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x, self.blackView.center.y)];    NSValue *value4 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x + 5, self.blackView.center.y)];    NSValue *value5 = [NSValue valueWithCGPoint:CGPointMake(self.blackView.center.x, self.blackView.center.y)];    animation.values = @[value0, value1, value2, value3, value4, value5];    animation.duration = 0.1;    animation.removedOnCompletion = NO;    animation.fillMode = kCAFillModeForwards;    [self.blackView.layer addAnimation:animation forKey:nil];}@end

CAAnimationGroup

它是CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行
属性:
animations:用来保存一组动画对象的NSArray

默认情况下,一组动画对象是同时运行的,也可以通过设置动画对象的beginTime属性来更改动画的开始时间

CAAnimationGroup用法

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{    // 1.创建旋转动画对象    CABasicAnimation *rotate = [CABasicAnimation animation];    rotate.keyPath = @"transform.rotation";    rotate.toValue = @(M_PI);    // 2.创建缩放动画对象    CABasicAnimation *scale = [CABasicAnimation animation];    scale.keyPath = @"transform.scale";    scale.toValue = @(0.0);    // 3.平移动画    CABasicAnimation *move = [CABasicAnimation animation];    move.keyPath = @"transform.translation";    move.toValue = [NSValue valueWithCGPoint:CGPointMake(100, 100)];    // 4.将所有的动画添加到动画组中    CAAnimationGroup *group = [CAAnimationGroup animation];    group.animations = @[rotate, scale, move];    group.duration = 2.0;    group.removedOnCompletion = NO;    group.fillMode = kCAFillModeForwards;    [self.myvie.layer addAnimation:group forKey:nil];}

CATransition

它是CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果。iOS比Mac OS X的转场动画效果少一点
UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果
属性:
type:动画过渡类型

subtype:动画过渡方向

startProgress:动画起点(在整体动画的百分比)

endProgress:动画终点(在整体动画的百分比)

CATransition用法

// 下一页- (void)next:(UIButton *)btn{    if (_index == 9) {        _index = 0;    }    NSString *imageName = [NSString stringWithFormat:@"%d.jpg", ++_index];    self.pictureView.image = [UIImage imageNamed:imageName];    // 转场动画    CATransition *animation = [CATransition animation];    animation.duration = 0.5;    animation.type = @"push";    animation.subtype = kCATransitionFromRight;    [self.pictureView.layer addAnimation:animation forKey:nil];    // type值有://    pageCurl            向上翻一页//    pageUnCurl          向下翻一页//    rippleEffect        滴水效果//    suckEffect          收缩效果,如一块布被抽走//    cube                立方体效果//    oglFlip             上下翻转效果}
0 0
原创粉丝点击