iOS 动画基础

来源:互联网 发布:大数据广告精准投放 编辑:程序博客网 时间:2024/05/16 09:45

iOS中核心动画分为几类:基础动画(CABasicAnimation)、关键帧动画(CAKeyframeAnimation)、动画组(CAAnimationGroup)、转场动画(CATransition)

 CAAnimation  核心动画的基础类,不能直接使用 他是负责动画的运行时间速度的控制 本身实现了CAMediaTiming协议

 CAPropertyAnimation:属性动画的基类(通过属性进行动画设置,注意是动画属性),不能直接使用。

 CABasicAnimation:基础动画,通过属性修改进行动画参数控制,只有初始状态和结束状态。

 CAKeyframeAnimation:关键帧动画,同样是通过属性进行动画参数控制,但是同基础动画不同的是它可以有多个状态控制。

 CAAnimationGroup:动画组,动画组是一种组合模式设计,可以通过动画组来进行所有动画行为的统一控制,组中所有动画效果可以并发执行。

 CATransition:转场动画,主要通过滤镜进行动画效果设置。

 基础动画、关键帧动画都属于属性动画,就是通过修改属性值产生动画效果,开发人员只需要设置初始值和结束值,中间的过程动画(又叫补间动画)由系统自动计算产生。和基础动画不同的是关键帧动画可以设置多个属性值,每两个属性中间的补间动画由系统自动完成,因此从这个角度而言基础动画又可以看成是有两个关键帧的关键帧动画

 speed默认是1.0 把速度变为0.0  动画就会停止

 

 repeatCount 默认的是 0,意味着动画只会播放一次 这个不应该和 repeatDration 属性一块使用。(负数不是无限循环)

 

 repeatDuration 这个属性指定了动画应该被重复多久。动画会一直重复,直到设定的时间流逝完。它不应该和 repeatCount一起使用

 

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

 

 fillMode  设置当前对象在非活动时间段的行为比如动画开始之前或者动画结束之后

 fillMode属性值(上面提到过要想fillMode有效,需要设置removedOnCompletion = NO

 

 kCAFillModeRemoved 这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态

 kCAFillModeForwards当动画结束后,layer会一直保持着动画最后的状态

 kCAFillModeBackwards在动画开始前,只需要将动画加入了一个layerlayer便立即进入动画的初始状态并等待动画开始。

 kCAFillModeBoth 这个其实就是上面两个的合成.动画加入后开始之前,layer便处于动画初始状态,动画结束后layer保持动画最后的状态

- (void)viewDidLoad {

    [super viewDidLoad];

    UIImage *image = [UIImage imageNamed:@"06.jpg"];

    showLayer = [[CALayer alloc]init];

    showLayer.bounds = CGRectMake(0, 0, image.size.height/5, image.size.height/5);

    showLayer.cornerRadius = image.size.height/10;

    showLayer.masksToBounds = YES;

    showLayer.position = self.view.center;

    showLayer.contents = (id)image.CGImage;

    [self.view.layer addSublayer:showLayer];

  }

- (void)animation

{

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];

    animation.fromValue = @(-0.1);

    animation.toValue = @(0.1);

    animation.duration = 0.05;

    animation.repeatCount = -1;

    animation.autoreverses = YES;

    [showLayer addAnimation:animation forKey:@"抖动"];

}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

{


    [self animation];

}


关键针动画代码实现:

/*

 CAKeyframeAnimation关键帧动画 也属于CAPropertyAnimation

 关键帧动画

 path 属性 执行动画轨迹的路径

 values 执行动画轨迹的数组

 

 */

#import "ViewController.h"


@interface ViewController ()

{

    CALayer *heartLayer;

}

@end


@implementation ViewController


- (void)viewDidLoad {

    [super viewDidLoad];

    [self addHeart];

}

- (void)addHeart

{

    UIImage *image = [UIImage imageNamed:@"心型 2"];

    heartLayer = [[CALayer alloc]init];

    heartLayer.position = CGPointMake(self.view.center.x, 200);

    heartLayer.bounds = CGRectMake(0, 0, image.size.width/8, image.size.height/8);

    heartLayer.contents = (id)image.CGImage;

    [self.view.layer addSublayer:heartLayer];

}

- (void)addAnimation

{

    CAKeyframeAnimation *draw = [CAKeyframeAnimation animationWithKeyPath:@"position"];

    draw.duration = 3;

    draw.values = @[[self getPointWithX:0 andY:0],[self getPointWithX:50 andY:-50],[self getPointWithX:100 andY:-65],[self getPointWithX:120 andY:-50],[self getPointWithX:170 andY:0],[self getPointWithX:120 andY:100],[self getPointWithX:50 andY:150],[self getPointWithX:0 andY:200],[self getPointWithX:-50 andY:150],[self getPointWithX:-120 andY:100],[self getPointWithX:-170 andY:0],[self getPointWithX:-120 andY:-50],[self getPointWithX:-100 andY:-65],[self getPointWithX:-50 andY:-50],[self getPointWithX:0 andY:0]];

    [heartLayer addAnimation:draw forKey:@"move"];

}

#pragma mark ---------CGPoint转换成NSValue的方法---------

- (NSValue *)getPointWithX:(CGFloat)x andY:(CGFloat)y

{

    

    return [NSValue valueWithCGPoint:CGPointMake(heartLayer.position.x + x, heartLayer.position.y + y)];

}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

{

    [self addAnimation];

}

@end




0 0