iOS:核心动画之关键帧动画CAKeyframeAnimation-低调大师

iOS:核心动画之关键帧动画CAKeyframeAnimation

2017-04-29 631

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

具体的关键帧实例如下：

实例一：设置改变的属性值为透明度opacity，触摸屏幕时,动画开始执行,动画执行过程中,动画的透明度逐渐变浅.结束时透明度恢复原状。

代码如下：

//声明属性

#import "ViewController.h"
@interface ViewController ()
@property (strong,nonatomic)CALayer *subLayer; //声明核心动画子层
@end

//创建核心动画子层

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //创建子层
    self.subLayer = [CALayer layer];
    //设置子层大小
    self.subLayer.bounds = CGRectMake(0, 0, 100, 100);
    //设置子层的位置
    self.subLayer.position = CGPointMake(100, 100);
    //设置子层的背景颜色
    self.subLayer.backgroundColor = [[UIColor redColor]CGColor];
    //添加子层到根层
    [self.view.layer addSublayer:self.subLayer];
}

//处理触摸事件

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    //创建关键帧动画
    CAKeyframeAnimation *keyframe = [[CAKeyframeAnimation alloc]init];
    //设置变化属性值为透明度
    keyframe.keyPath = @"opacity";

//设置每一帧动画的透明度时刻值
    keyframe.values = @[@1.0,@0.5,@0.0,@0.5,@1.0];
    
  //设置动画持续事件
    keyframe.duration = 1.0f;
    //添加动画到子层
    [self.subLayer addAnimation:keyframe forKey:@"keyAnimation"]; //forkey:的参数可以自己设置，就是一个标示符,区别开其他的动画
}

演示结果：

开始时：中间某一时刻：结束时：

实例二：设置改变的属性值为位置position,当在屏幕上连续触摸5个点时,动画开始按照这个5个点的连接直线运行。等到结束时,动画就停在最终的位置上,不在恢复原状。

代码如下：

//声明属性

#import "ViewController.h"
#define MAX_CLICKED_NUM 4    //触摸的最大次数
@interface ViewController ()
@property (strong,nonatomic)NSMutableArray *points;  //用于存放触摸屏幕的次数
@property (strong,nonatomic)CALayer *subLayer;//声明核心动画子层
@end

//创建核心动画子层

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //初始化
    self.points = [NSMutableArray array];
    
    //创建子层
    self.subLayer = [CALayer layer];
    self.subLayer.bounds = CGRectMake(0, 0, 100, 100);
    self.subLayer.position = CGPointMake(100, 100);
    self.subLayer.backgroundColor = [[UIColor redColor]CGColor];
    
    //添加子层到根层
    [self.view.layer addSublayer:self.subLayer];
    
}

//触摸事件的处理(如果触摸次数不够5次,就存储起来,达到5次时,创建帧动画,并开始动画)

//触摸事件的处理
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    //获取当前触摸点
    CGPoint location = [[touches anyObject]locationInView:self.view];
    
    //判断当前的点的个数
    if (self.points.count < MAX_CLICKED_NUM)
    {
        //添加当前点
        [self.points addObject:[NSValue valueWithCGPoint:location]];
    }
    else
    {
        
        //创建关键帧动画
        CAKeyframeAnimation *keyanimation = [[CAKeyframeAnimation alloc]init];
        
        //设置该变量为位置position
        keyanimation.keyPath = @"position";
        
        //设置每一帧动画的位置值
        keyanimation.values = self.points;
        
        //设置动画持续时间
        keyanimation.duration = 3.0f;
        
        //设置动画不在恢复原状
        keyanimation.removedOnCompletion = NO;
        keyanimation.fillMode = kCAFillModeForwards;
        
        //设置代理
        keyanimation.delegate = self;
        
        //添加动画到层
        [self.subLayer addAnimation:keyanimation forKey:@"keyanimation"];
    }
    
}

//实现动画的协议方法

#pragma mark -动画代理方法
-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    //关闭隐式动画
    [CATransaction begin];
    [CATransaction setDisableActions:YES];
    
    //停留在最后的位置
    self.subLayer.position = [[self.points lastObject]CGPointValue];
    
    //提交动画事物
    [CATransaction commit];
    
    //删除上一次动画结束后保存的所有的数据
    [self.points removeAllObjects];
}

演示结果：点击5次后,运动过程不好捕捉,就不截图了

起点：终点：

实例三：设置改变的属性值为位置position,在屏幕上绘制一条线,绘制结束后,动画就沿着这条线开始动画。等到结束时,动画就停在最终的位置上,不在恢复原状。

代码如下：

//声明属性

#import "ViewController.h"

@interface ViewController ()
@property (strong,nonatomic)CALayer *subLayer;     //声明核心动画子层用作动画层
@property (assign,nonatomic)CGMutablePathRef path; //声明可变的绘图路径
@property (strong,nonatomic)CALayer *DrawLayer;    //声明核心动画子层用来绘图层
@end

//创建两个核心动画子层,一个用来绘制运行线路,另一个用来当作动画层

@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    
    //创建绘图子层
    self.DrawLayer = [CALayer layer];
    self.DrawLayer.bounds = self.view.bounds;
    self.DrawLayer.position = CGPointMake(0, 0);
    self.DrawLayer.anchorPoint = CGPointMake(0, 0);
    self.DrawLayer.backgroundColor = [[UIColor whiteColor]CGColor];

    //设置绘图子层的代理,它会调用协议中的绘图方法
    self.DrawLayer.delegate = self;
    
    //添加绘图子层
    [self.view.layer addSublayer:self.DrawLayer];
    
    
    
    //创建动画子层
    self.subLayer = [CALayer layer];
    self.subLayer.bounds = CGRectMake(0, 0, 100, 100);
    self.subLayer.position = CGPointMake(100, 100);
    self.subLayer.backgroundColor = [[UIColor redColor]CGColor];

    //添加动画子层
    [self.view.layer addSublayer:self.subLayer];
}

//处理触摸点击事件,设置绘制线路径的起点

//触摸点击事件的处理
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    //获取当前触摸点
    CGPoint location = [[touches anyObject]locationInView:self.view];
        
    //创建路经
    self.path = CGPathCreateMutable();
    
    //将当前点加到路径中去
    CGPathMoveToPoint(self.path, NULL, location.x, location.y);
    
}

//处理触摸移动事件,绘制一条路径线到终点,此时绘图子层调用setNeedDisplay方法绘图

//触摸移动事件的处理
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    //获取当前触摸点
    CGPoint location = [[touches anyObject]locationInView:self.view];
    
    //将当前点加到路径中去
    CGPathAddLineToPoint(self.path, NULL, location.x, location.y);
    
    //让绘图子层绘图
    [self.DrawLayer setNeedsDisplay];
}

//处理触摸结束事件,绘制线路径结束后,创建帧动画,设置相关属性并执行动画

//触摸结束事件的处理
-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    
    //创建帧动画
    CAKeyframeAnimation *keyAnimation = [[CAKeyframeAnimation alloc]init];
    
    //设置改变属性值为位置position
    keyAnimation.keyPath = @"position";
    
    //设置动画路径为绘制的路径
    keyAnimation.path = self.path;
    
    //设置动画持续时间
    keyAnimation.duration = 3.0f;
    
    
    //设置动画结束时保持不变,不在恢复原状
    keyAnimation.removedOnCompletion = NO;
    keyAnimation.fillMode = kCAFillModeForwards;
    
    
    //设置帧动画代理
    keyAnimation.delegate = self;
    
    
    //添加帧动画到动画子层
    [self.subLayer addAnimation:keyAnimation forKey:@"keyAnimation"];
}

//实现帧动画协议方法,动画结束后,释放绘制路径

#pragma mark -动画代理方法
-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    //释放路径
    CGPathRelease(self.path);
}

//重写绘图子层的绘图方法-(void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx,绘图子层代理会调用它绘图

#pragma mark -UILayer画图方法
-(void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx
{
    //添加路径
    CGContextAddPath(ctx, self.path);
    
    //设置颜色
    CGContextSetStrokeColorWithColor(ctx, [[UIColor blueColor]CGColor]);
    
    //绘路径
    CGContextDrawPath(ctx, kCGPathStroke);
}

运行结果如下：只给出起始位置和结束位置截图,动画过程不好捕捉,就不给出截图了

开始时位置：绘制路径后,动画沿路径运行结束位置：

程序猿神奇的手，每时每刻，这双手都在改变着世界的交互方式！

分类: iOS高级

本文转自当天真遇到现实博客园博客，原文链接：http://www.cnblogs.com/XYQ-208910/p/4886488.html，如需转载请自行联系原作者

微信关注我们

原文链接：https://yq.aliyun.com/articles/366183

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

iOS:核心动画之动画组CAAnimationGroup

CAAnimationGroup——动画组动画组，是CAAnimation的子类，可以保存一组动画对象，将CAAnimationGroup对象加入层后，组中所有动画对象可以同时并发运行属性说明： –animations：用来保存一组动画对象的NSArray 默认情况下，一组动画对象是同时运行的，也可以通过设置动画对象的beginTime属性来更改动画的开始时间具体的实例如下：实现功能：在创建的动画组中存入两个基本动画,一个是沿着Z轴旋转360度的动画,另一个是放大2倍的动画,这两个动画并发执行，动画结束后,均不在恢复原状。代码如下： //声明属性 #import "ViewController.h" @interface ViewController () @property (strong,nonatomic)CALayer *subLayer; //声明核心动画子层 @end //创建动画子层,同时创建触摸手势,添加的手势事件处理的是动画组 @implementation ViewController - (void)viewDidLoad { [super viewD...

2017-04-30

631

核心动画类：CAAnimation、CAPropertyAnimation、CABasicAnimation、CAKeyframeAnimation、CATransition、CAAnimationGroup 父类：CAAnimation（抽象类） CAAnimation直接子类:CAPropertyAnimation(抽象类),CATransition(转场动画),CAAnimationGroup(动画数组) CAPropertyAnimation直接子类：CABasicAnimation(基本动画)、CAKeyframeAnimation(关键帧动画) ========================================================= 类介绍： @interface CAAnimation : NSObject<NSCoding, NSCopying, CAMediaTiming, CAAction>//动画根抽象类 //速度控制函数(决定动画的运行速率) @property(strong)CAMediaTimingFunction*t...

2017-04-30

550

资源下载

更多资源

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

腾讯云软件源

为解决软件依赖安装时官方源访问速度慢的问题，腾讯云为一些软件搭建了缓存服务。您可以通过使用腾讯云软件源站来提升依赖包的安装速度。为了方便用户自由搭建服务架构，目前腾讯云软件源站支持公网访问和内网访问。

Nacos

Nacos /nɑ:kəʊs/ 是 Dynamic Naming and Configuration Service 的首字母简称，一个易于构建 AI Agent 应用的动态服务发现、配置管理和AI智能体管理平台。Nacos 致力于帮助您发现、配置和管理微服务及AI智能体应用。Nacos 提供了一组简单易用的特性集，帮助您快速实现动态服务发现、服务配置、服务元数据、流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。