本文链接：https://blog.csdn.net/sunshine_leaf/article/details/50338089

一、核心动画（Core Animation）

1、强大的动画处理API，可以使用其做出各种炫彩的动画效果。

2、核心动画的特性：

（1）跨平台，可以在Mac OS X、iOS 平台上运行。

（2）Core Animation的动画执行过程都是在后台操作的，不会阻塞主线程，就是执行动画时，还能进行其他操作。

（3）Core Animation是直接作用在CALayer上的，并非UIView。

注：我们在使用动画的时候，一般不使用核心动画（Core Animation），而是使用UIView的动画。

3、CAMediaTiming：

（1）简介：是一个协议。

（2）属性

duration：动画的持续时间。

repeatCount：动画的重复次数。

fillMode：决定当前对象在非Active的时间段的行为。

beginTime：用来设置动画的延迟时间。（若想延迟：如延迟5秒，可以设置CACurrentMediaTime（）为当前图层的时间，想要延迟，就在其后面+5即可）。

4、CAAnimation：

（1）简介：是所有动画类的父类，但是它不能直接使用，应该使用它的子类。

（2）它继承了CAMediaTiming，CAMediaTiming是一个协议。

（3）CAMediTiming协议的属性：

duration：动画的持续时间。

repeatCount：动画的重复次数。

fillMode：决定当前对象在非Active的时间段的行为。

beginTime：用来设置动画的延迟时间。（若想延迟：如延迟5秒，可以设置CACurrentMediaTime（）为当前图层的时间，想要延迟，就在其后面+5即可）。

（4）CAAnimation的属性：

所有（3）CAMediTiming协议的属性，除此之外还有：

timingFunction：控制动画运行的效果。

delegate：动画的代理。

5、CAPropertyAction

（1）简介：是CABasicAnimation和CAKeyframeAnimation的父类，继承自CAAnimation。

（2）属性：keyPath：指定CALayer的某个属性名为keypath，并对这个属性的值进行自定义的修改。

6、CAAnimationGroup

（1）简介：组动画（CAAnimationGroup）,继承自CAAnimation，就是将你所需要用到的动画加到一个组中，进行整组的动画，可以用做简单的平移、缩放、旋转等组成你所需要的各种组合动画。

（2）属性：

animations：多个动画。

7、CATransition

(1)简介：转场动画（CATransition），继承自CAAnimation，设置动画，可以看到图片像在转动，校果级佳。

能够为层提供移出屏幕的动画效果。iOS比Mac OS X的转场动画效果少一点。UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果。

(2)属性：

type：动画过渡类型

subtype:动画过渡方向

startProgress：动画起点（在整体动画的百分比）

endProgress：动画终点（在整体动画的百分比）

二、核心动画（Core Animation）的使用步骤

1、添加QuartzCore.frameWork框架和引入头文件<QuartzCore/QuartzCore.h>。（iOS 7及之后的版本不需要此步骤）。

2、初始化一个CAAnimation对象，并设置其相关属性。

3、通过调用CALayer的addAnimation：forKey：方法增加CAAnimation对象到CALayer中，这样就可以开始执行动画了。（一般我们把forKey设置为nil，forkey相当于给这个动画设置了一个唯一的标识，方便你在其他地方调用这个动画，因此可以根据需要设置自定义的值）。

4、通过调用CALayer的removeAnimationForKey：方法，可以移除这个动画，停止CALayer中这个动画。

三、基础动画（CABasicAnimation）

1、简介：

1、CABasicAnimation是CAPropertyAction的子类

2、属性：

fromValue：keyPath相应的属性的初始值。

toValue： keyPath相应的属性的结束值。

2、注意事项：

随着动画的进行，在长度为duration的持续时间内，keyPath相应的属性值从fromValue渐渐变为toValue，如果fillMode = KCAFillModeForwards（实时跟新）和removeOnComletion = NO；（动画执行后移除动画设置为否），那么动画执行完毕后，图层会保持显示动画执行后的状态。但在实际上，图层的属性还是跟动画执行之前的初始值一样，并没有真正的被改变。

3、基础动画：（代码实现及其运行结果）

1、平移动画（无代理）

（1）构建思路：

1>使用CALayer，首先要在。h文件中定义一个CALayer对象。

2>创建所需的动画

3>给CALayer对象添加动画

4>创建两个UILabel用于显示CALayer的position，方便我们理解者个动画。

（2）代码

#import "TranslationViewController.h"

@interface TranslationViewController ()

{

UILabel *lbShow1;

UILabel *lbShow2;

}

@end

@implementation TranslationViewController

- (void)viewDidLoad {

[super viewDidLoad];

// 创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0,0,50,80);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 20;

//添加layer

[self.view.layer addSublayer:myLayer];

self.myLayer = myLayer;

//创建两个UILabel，用于显示位置的文本信息

lbShow1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 400, 280, 40)];

lbShow1.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow1.layer.borderWidth = 2;

lbShow1.layer.cornerRadius = 5;

lbShow1.textAlignment = NSTextAlignmentCenter;

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.myLayer.position)];

[self.view addSubview:lbShow1];

lbShow2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 500, 280, 40)];

lbShow2.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow2.layer.borderWidth = 2;

lbShow2.layer.cornerRadius = 5;

lbShow2.textAlignment = NSTextAlignmentCenter;

[self.view addSubview:lbShow2];

}

//设置动画（基础动画）

//touchesBegan:该方法在动画开始时被触发

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

//1.创建核心动画

//CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:(NSString *)];

CABasicAnimation *anima = [CABasicAnimation animation];

//1-1告诉系统要执行什么样的动画,@"position":说明要修改的是CALayer的position属性，也就是会执行平移动画

anima.keyPath = @"position";

//设置通过动画，将layer从哪儿移动到哪儿

anima.fromValue = [NSValue valueWithCGPoint:CGPointMake(0, 0)];

anima.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 300)];

//1-2设置动画执行完毕之后不删除动画

anima.removedOnCompletion = NO;

//1-3设置保存动画的最新状态

anima.fillMode = kCAFillModeForwards;

//1-4设置值动画的执行时间为：6秒

anima.duration = 6;

//2.添加核心动画到layer

[self.myLayer addAnimation:anima forKey:nil];

lbShow2.text = [NSString stringWithFormat:@"动画执行后：%@", NSStringFromCGPoint(self.myLayer.position)];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

（2）实现效果

图1：运行程序显示：图2：点击图片触发动画后的图片

2、平移动画（有代理）

（1）构建思路

1>使用CALayer，首先要在。h文件中定义一个CALayer对象。

2>创建所需的动画

3>给动画添加代理

4>给CALayer对象添加动画

5>实现代理的方法

6>创建两个UILabel用于显示CALayer的position，方便我们理解者个动画

（2）代码部分

.h部分

#import <UIKit/UIKit.h>

//平移动画（设置代理）：结果显示：position的值初始值和执行动画后的值都是{50，50}，并没有真正被改变为{200，300}

@interface TranslationViewController2 : UIViewController

@property (nonatomic,strong)CALayer *myLayer;

@end

.m部分

#import "TranslationViewController2.h"

@interface TranslationViewController2 ()

{

UILabel *lbShow1;

UILabel *lbShow2;

}

@end

@implementation TranslationViewController2

- (void)viewDidLoad {

[super viewDidLoad];

//创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0, 0, 50, 80);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 20;

//添加layer

[self.view.layer addSublayer:myLayer];

self.myLayer = myLayer;

//创建两个UILabel，用于显示位置的文本信息

lbShow1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 400, 280, 40)];

lbShow1.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow1.layer.borderWidth = 2;

lbShow1.layer.cornerRadius = 5;

lbShow1.textAlignment = NSTextAlignmentCenter;

//lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.myLayer.position)];

[self.view addSubview:lbShow1];

lbShow2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 500, 280, 40)];

lbShow2.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow2.layer.borderWidth = 2;

lbShow2.layer.cornerRadius = 5;

lbShow2.textAlignment = NSTextAlignmentCenter;

[self.view addSubview:lbShow2];

}

//设置动画（基础动画）

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

//1.创建核心动画

// CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:(NSString *)];

CABasicAnimation *anima = [CABasicAnimation animation];

//1.1告诉系统要执行什么样的动画,@"position":说明要修改的是CALayer的position属性，也就是会执行平移动画

anima.keyPath = @"position";

//设置通过动画，将layer从哪儿移动到哪儿

anima.fromValue = [NSValue valueWithCGPoint:CGPointMake(0, 0)];

anima.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 300)];

//1.2设置动画执行完毕之后不删除动画

anima.removedOnCompletion = NO;

//1.3设置保存动画的最新状态

anima.fillMode = kCAFillModeForwards;

anima.delegate = self;

//打印

NSString *str = NSStringFromCGPoint(self.myLayer.position);

NSLog(@"执行前：%@",str);

//2.添加核心动画到layer

[self.myLayer addAnimation:anima forKey:nil];

}

//动画开始执行调用的方法

-(void)animationDidStart:(CAAnimation *)anim{

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.myLayer.position)];

NSLog(@"开始执行动画");

}

//动画执行完毕调用的方法

-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{

//动画执行完毕，打印执行完毕后的position值

NSString *str = NSStringFromCGPoint(self.myLayer.position);

NSLog(@"执行后：%@",str);

//在UILabel中显示动画执行后CALayer的位置。

lbShow2.text = [NSString stringWithFormat:@"动画执行后：%@", NSStringFromCGPoint(self.myLayer.position)];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

（3）执行效果

图片1动画执行前图片2动画执行后

3、平移动画（kvc）

（1）构建思路

1>使用CALayer，首先要在。h文件中定义一个CALayer对象。

2>创建动画，通过transForm（kvc）方式来实现平移

3>给CALayer对象添加动画

5>创建两个UILabel用于显示CALayer的position，方便我们理解者个动画

(2)代码部分

#import "TranslationViewController3.h"

@interface TranslationViewController3 ()

{

UILabel *lbShow1;

UILabel *lbShow2;

}

@end

@implementation TranslationViewController3

- (void)viewDidLoad {

[super viewDidLoad];

// 创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0, 0, 150, 60);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 40;

//添加layer

[self.view.layer addSublayer:myLayer];

self.mylayer = myLayer;

//创建两个UILabel，用于显示位置的文本信息

lbShow1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 400, 280, 40)];

lbShow1.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow1.layer.borderWidth = 2;

lbShow1.layer.cornerRadius = 5;

lbShow1.textAlignment = NSTextAlignmentCenter;

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.mylayer.position)];

[self.view addSubview:lbShow1];

lbShow2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 500, 280, 40)];

lbShow2.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow2.layer.borderWidth = 2;

lbShow2.layer.cornerRadius = 5;

lbShow2.textAlignment = NSTextAlignmentCenter;

[self.view addSubview:lbShow2];

}

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

{

//1.创建动画

CABasicAnimation *anima=[CABasicAnimation animation];

anima.keyPath=@"transform";

//1.1设置动画执行时间

anima.duration=2.0;

//1.2修改属性，执行动画:CATransform3DMakeTranslation(tx,ty,tz)

anima.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeTranslation(100, 100, 1)];

//1.3设置动画执行完毕后不删除动画

anima.removedOnCompletion=NO;

//1.4设置保存动画的最新状态

anima.fillMode=kCAFillModeForwards;

//2.添加动画到layer

[self.mylayer addAnimation:anima forKey:nil];

lbShow2.text = [NSString stringWithFormat:@"动画执行后：%@", NSStringFromCGPoint(self.mylayer.position)];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

(3)效果实现：同方法1、2相似，此处略。

4、平移动画（通知）

(1) 构建思路

1>使用CALayer，首先要在。h文件中定义一个CALayer对象。

2>创建通知

3>在触摸的时候发送通知

4>调用通知的方法，在此方法中创建动画，添加给CALayer对象。

5>创建两个UILabel用于显示CALayer的position，方便我们理解者个动画

(2)代码部分

#import "TranslationViewController4.h"

@interface TranslationViewController4 ()

{

UILabel *lbShow1;

UILabel *lbShow2;

}

@end

@implementation TranslationViewController4

- (void)viewDidLoad {

[super viewDidLoad];

// 创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0,0,50,80);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 20;

//添加layer

[self.view.layer addSublayer:myLayer];

self.myLayer = myLayer;

//创建两个UILabel，用于显示位置的文本信息

lbShow1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 400, 280, 40)];

lbShow1.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow1.layer.borderWidth = 2;

lbShow1.layer.cornerRadius = 5;

lbShow1.textAlignment = NSTextAlignmentCenter;

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.myLayer.position)];

[self.view addSubview:lbShow1];

lbShow2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 500, 280, 40)];

lbShow2.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow2.layer.borderWidth = 2;

lbShow2.layer.cornerRadius = 5;

lbShow2.textAlignment = NSTextAlignmentCenter;

[self.view addSubview:lbShow2];

//注册通知

[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(touch) name:@"calayer" object:nil];

}

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

[[NSNotificationCenter defaultCenter]postNotificationName:@"calayer" object:nil];

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGPoint(self.myLayer.position)];

}

-(void)touch{

//1.创建核心动画

//CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:(NSString *)];

CABasicAnimation *anima = [CABasicAnimation animation];

//1.1告诉系统要执行什么样的动画,@"position":说明要修改的是CALayer的position属性，也就是会执行平移动画

anima.keyPath = @"position";

//设置通过动画，将layer从哪儿移动到哪儿

anima.fromValue = [NSValue valueWithCGPoint:CGPointMake(0, 0)];

anima.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 300)];

//1.2设置动画执行完毕之后不删除动画

anima.removedOnCompletion = NO;

//1.3设置保存动画的最新状态

anima.fillMode = kCAFillModeForwards;

//1.4设置值动画的执行时间为：6秒

anima.duration = 6;

//2.添加核心动画到layer

[self.myLayer addAnimation:anima forKey:nil];

lbShow2.text = [NSString stringWithFormat:@"动画执行后：%@", NSStringFromCGPoint(self.myLayer.position)];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

(3)效果实现：同方法1、2相似，此处略。

5、缩放动画

（1）代码部分

#import "ScaleViewController.h"

@interface ScaleViewController ()

{

UILabel *lbShow1;

UILabel *lbShow2;

}

@end

@implementation ScaleViewController

- (void)viewDidLoad {

[super viewDidLoad];

// 创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0, 0, 100, 50);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

//设置锚点

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 40;

//添加layer

[self.view.layer addSublayer:myLayer];

self.myLayer = myLayer;

//创建两个UILabel，用于显示CALayer对象的大小文本信息

lbShow1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 400, 280, 40)];

lbShow1.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow1.layer.borderWidth = 2;

lbShow1.layer.cornerRadius = 5;

lbShow1.textAlignment = NSTextAlignmentCenter;

lbShow1.text = [NSString stringWithFormat:@"动画执行前：%@", NSStringFromCGRect(self.myLayer.bounds)];

[self.view addSubview:lbShow1];

lbShow2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 500, 280, 40)];

lbShow2.layer.borderColor = [UIColor purpleColor].CGColor;

lbShow2.layer.borderWidth = 2;

lbShow2.layer.cornerRadius = 5;

lbShow2.textAlignment = NSTextAlignmentCenter;

[self.view addSubview:lbShow2];

}

//设置动画（基础动画）

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

//1.创建核心动画

CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:@"bounds"];

//1.1设置动画执行时间

anima.duration = 2.0;

//1.2设置动画执行完毕之后不删除动画

anima.removedOnCompletion = NO;

//1.3设置保存动画的最新状态

anima.fillMode = kCAFillModeForwards;

//1.4修改属性，执行动画

anima.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 200, 300)];

//2.添加核心动画到layer

[self.myLayer addAnimation:anima forKey:nil];

lbShow2.text = [NSString stringWithFormat:@"动画执行后：%@", NSStringFromCGRect(self.myLayer.bounds)];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

(2)效果实现

图一动画未执行图二动画执行完毕

6、旋转动画

(1)代码部分

@implementation RevolveViewController

- (void)viewDidLoad {

[super viewDidLoad];

// 创建layer

CALayer *myLayer = [CALayer layer];

//设置layer的属性

myLayer.bounds = CGRectMake(0, 0, 150, 60);

myLayer.backgroundColor = [UIColor yellowColor].CGColor;

myLayer.position = CGPointMake(50, 50);

//设置锚点

myLayer.anchorPoint = CGPointMake(0, 0);

myLayer.cornerRadius = 40;

//添加layer

[self.view.layer addSublayer:myLayer];

self.myLayer = myLayer;

}

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

//1.创建动画

CABasicAnimation *anima = [CABasicAnimation animationWithKeyPath:@"transform"];

//1.1设置动画执行时间

anima.duration = 2.0;

//1.2修改属性，执行动画

M_PI 代表pi

M_PI_2 代表pi/2

M_PI_4 代表pi/4

如果要让图形以2D的方式旋转，只需要把CATransform3DMakeRotation在z方向上的值改为1即可

CATransform3DMakeRotation（角度，x，y，z）

anima.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_2+M_PI_4, 1, 1, 0)];

//1.3设置动画执行完毕后不删除动画

anima.removedOnCompletion = NO;

//1.4设置保存动画的最新状态

anima.fillMode = kCAFillModeForwards;

//2.添加动画到layer

[self.myLayer addAnimation:anima forKey:nil];

}

(2)实现的效果

图1运行前图2运行后

四、关键帧动画（CAKeyframeAnimation）

1、简介：

关键帧动画（CAKeyframeAnimation）是CAPropertyAnimation的子类

2、与基础动画（CABasicAnimation）的区别

（1）CABasicAnimation只能从一个数值（fromValue）变为另一个数值（toValue）

（2）CAKeyframeAnimation会使用一个NSArray保存这些数值。

3、属性

（1）values：NSArray对象，里面的元素：关键帧。动画会在指定时间能依次显示每个元素。

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

（3）keyTimes：可以为对应的关键帧指定对应的时间点，其取值范围为0到1.0。keyTimes中的每一个时间值对应values中的每一帧，当keyTimes没有设置的时候，各个关键帧的时间是平分的

4、动画的节奏：（系统的）

（1）KCAMediaTimingFunctionDefault 默认

（2）KCAMediaTimingFunctionEaseIn 动画开始缓慢，然后慢慢加快

（3）KCAMediaTimingFunctionEaseInEaseOut 动画开始缓慢，中间加速，最后缓慢

（4）KCAMediaTimingFunctionEaseOut 动画开始快速，然后慢慢变慢

（5）KCAMediaTimingFunctionLinear 动画线性变化

5、实现一个闹钟

6、代码部分

先从githup中下载一个EasingAnimation，并导入文件

#import "ViewController.h"

#import "YXEasing.h"

#import "easing.h"

@interface ViewController ()

{

CALayer *secondLayer;

CALayer *minuteLayer;

CALayer *hourLayer;

NSTimer *myTimer;

}

@end

@implementation ViewController

缓动动画:CALayer

UIView 是特殊的CALayer,基于CALayer层，帧数越多，动画效果约好，但cpu运行效果不好，占的CPU资源越多。

- (void)viewDidLoad {

[super viewDidLoad];

// 创建表盘

UIView *showView = [[UIView alloc]initWithFrame:CGRectMake(60, 150, 200, 200)];

showView.backgroundColor = [UIColor clearColor];

showView.layer.cornerRadius = 100;

showView.layer.borderColor = [UIColor redColor].CGColor;

showView.layer.borderWidth = 5;

//showView.backgroundColor = [UIColor redColor];

[self.view addSubview:showView];

UIImageView *img = [[UIImageView alloc]init];

img.frame = CGRectMake(0, 0, 200, 200);

img.layer.cornerRadius = 100;

img.clipsToBounds = YES;

img.image = [UIImage imageNamed:@"dfg.png"];

[showView addSubview:img];

//创建秒针

secondLayer = [CALayer layer];

//设置锚点

secondLayer.anchorPoint = CGPointMake(1, 1);

secondLayer.frame = CGRectMake(100, 0, 1, 100);

secondLayer.backgroundColor = [UIColor blueColor].CGColor;

//secondLayer.borderColor = [UIColor greenColor].CGColor;

//secondLayer.borderWidth = 5.0f;

[showView.layer addSublayer:secondLayer];

minuteLayer = [CALayer layer];

minuteLayer.anchorPoint = CGPointMake(1, 1);

minuteLayer.frame = CGRectMake(100, 30, 1, 70);

minuteLayer.backgroundColor = [UIColor greenColor].CGColor;

[showView.layer addSublayer:minuteLayer];

hourLayer = [CALayer layer];

hourLayer.anchorPoint = CGPointMake(1, 1);

hourLayer.frame = CGRectMake(100, 55, 1, 45);

hourLayer.backgroundColor = [UIColor redColor].CGColor;

[showView.layer addSublayer:hourLayer];

//创建定时器

myTimer = [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(secondAction) userInfo:nil repeats:YES];

}

-(void)secondAction{

//实现秒针方法--动画效果

static int i = 1;

//设置初始值，结束值

CGFloat oldValue = DEGREES_TO_RADIANS(360/60)*(i+1);

CGFloat newValue = DEGREES_TO_RADIANS(360/60)*i;

i++;

// //方法2

// CGFloat oldValue = DEGREES_TO_RADIANS((360/60)*(i+1));

// CGFloat newValue = DEGREES_TO_RADIANS(360/60)*i;

// CGFloat oldValue1 = DEGREES_TO_RADIANS((360/3600)*(i+1));

// CGFloat newValue1 = DEGREES_TO_RADIANS(360/3600)*i;

// CGFloat oldValue2 = DEGREES_TO_RADIANS((360/(3600*24))*(i+1));

// CGFloat newValue2 = DEGREES_TO_RADIANS(360/(3600*24))*i;

//创建关键帧

CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animation];

keyAnimation.keyPath = @"transform.rotation.z";

//point

keyAnimation.duration = 0.5;

//设置值

keyAnimation.values = [YXEasing calculateFrameFromValue:oldValue toValue:newValue func:QuadraticEaseIn frameCount:30*0.5];

secondLayer.transform = CATransform3DMakeRotation(newValue, 0, 0, 1);

// CAKeyframeAnimation *keyAnimation1 = [CAKeyframeAnimation animation];

// keyAnimation1.keyPath = @"transform.rotation.z";

// //point

// keyAnimation1.duration = 0.5;

// //设置值

// keyAnimation1.values = [YXEasing calculateFrameFromValue:oldValue1 toValue:newValue1 func:QuadraticEaseIn frameCount:30*0.5];

// minuteLayer.transform = CATransform3DMakeRotation(newValue1, 0, 0, 1);

// CAKeyframeAnimation *keyAnimation2 = [CAKeyframeAnimation animation];

// keyAnimation2.keyPath = @"transform.rotation.z";

// //point

// keyAnimation2.duration = 0.5;

// //设置值

// keyAnimation2.values = [YXEasing calculateFrameFromValue:oldValue2 toValue:newValue2 func:QuadraticEaseIn frameCount:30*0.5];

// hourLayer.transform = CATransform3DMakeRotation(newValue2, 0, 0, 1);

// i++;

// [hourLayer addAnimation:keyAnimation2 forKey:nil];

// [minuteLayer addAnimation:keyAnimation1 forKey:nil];

// [secondLayer addAnimation:keyAnimation forKey:nil];

//方法1：

if (i%60==0) {

CGFloat oldValue2 = DEGREES_TO_RADIANS(360/60.0f)*i++;

CGFloat newValue2 = DEGREES_TO_RADIANS(360/60)*i;

CAKeyframeAnimation *keyAnimation1 = [CAKeyframeAnimation animation];

keyAnimation1.keyPath = @"transform.rotation.z";

//point

keyAnimation1.duration = 0.5;

//设置值

keyAnimation1.values = [YXEasing calculateFrameFromValue:oldValue2 toValue:newValue2 func:QuadraticEaseIn frameCount:30*0.5];

minuteLayer.transform = CATransform3DMakeRotation(newValue2, 0, 0, 1);

}

if (i%3600==0) {

CGFloat oldValue2 = DEGREES_TO_RADIANS(360/60.0f)*i++;

CGFloat newValue2 = DEGREES_TO_RADIANS(360/60)*i;

CAKeyframeAnimation *keyAnimation1 = [CAKeyframeAnimation animation];

keyAnimation1.keyPath = @"transform.rotation.z";

//point

keyAnimation1.duration = 0.5;

//设置值

keyAnimation1.values = [YXEasing calculateFrameFromValue:oldValue2 toValue:newValue2 func:QuadraticEaseIn frameCount:30*0.5];

hourLayer.transform = CATransform3DMakeRotation(newValue2, 0, 0, 1);

}

7、实现效果

iOS - UI： 动画汇总一（学习日记）

一、核心动画（Core Animation）

二、核心动画（Core Animation）的使用步骤

三、基础动画（CABasicAnimation）

四、关键帧动画（CAKeyframeAnimation）

iOS - UI：动画汇总一（学习日记）