概述


  • 简介

    • CAKeyframeAnimation又称关键帧动画
    • CAKeyframeAnimation是抽象类CAPropertyAnimation的子类,可以直接使用
    • 通过values与path两个属性指定动画属性
  • 注意事项
    • 若指定了path属性,则values属性将被忽略
    • CABasicAnimation相当于只有两个关键帧的CAKeyframeAnimation

关键帧动画的常用属性


  • values(NSArray *)

    • 存放关键帧的多个值
    • 类似于CABasicAnimation的fromValue与toValue值
  • path(CGPathRef)
    • 动画的执行路径
    • 可以通过绘图的方式绘制路径
  • keyTimes(NSArray *)
    • 每个关键帧的执行时间
    • 类型为NSNumber类型
    • 若不指定,则所有的关键帧平分动画的duration时长
  • timingFunctions(NSArray *)
    • 速度控制函数数组
  • calculationMode(NSString *)
    • 指定关键帧的动画属性
    • 若指定该值,则keyTimes与timingFunctions属性值将被忽略
    • 默认为:kCAAnimationLinear
  • rotationMode(NSString *)
    • 指定旋转模式,默认为nil

示例


  • 效果图

  • 实现思路
    • 通过监听执行动画的UI控件的触摸事件来绘制贝瑟尔曲线
    • 创建关键帧动画,指定执行动画的keyPath属性
    • 将绘制的贝瑟尔曲线作为动画的执行路径
    • 将动画添加到指定的图层上
  • 实现步骤(自定义UIView的子类)
    • 使用成员属性保存贝瑟尔路径
    @property (nonatomic, strong) UIBezierPath *path;
    • 监听触摸事件的状态,绘制贝瑟尔曲线

      • 开始
      //确定起点
      - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
      {
          //获取当前触摸点
          UITouch *touch = [touches anyObject];
          CGPoint curretnPoint = [touch locationInView:self];
      
          //创建路径
          UIBezierPath *path = [UIBezierPath bezierPath];
          [path moveToPoint:curretnPoint];
          //保存路径
          self.path = path;
      }
      • 移动
      //添加线条
      - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
      {
          //获取当前触摸点
          UITouch *touch = [touches anyObject];
          CGPoint currentPoint = [touch locationInView:self];
          //添加线条
          [self.path addLineToPoint:currentPoint];
          //重绘,将曲线显示到图层上
          [self setNeedsDisplay];
      }
      • 结束(创建动画)
      - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
      {
          //创建动画
          CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
      
          //指定执行动画的属性,
          animation.keyPath = @"position";
          //设置动画的执行路径
          animation.path = self.path.CGPath;
      
          //设置动画的执行时间
          animation.duration = 1;
          //设置动画的重复次数
          animation.repeatCount = MAXFLOAT;
      
          //将动画添加到对应的图层上
          [[[self.subviews firstObject] layer] addAnimation:animation forKey:nil];
      }
    • 将路径显示到图层上
    //绘制路径
    - (void)drawRect:(CGRect)rect
    {
        [self.path stroke];
    }

CoreAnimation-06-CAKeyframeAnimation的更多相关文章

  1. iOS CoreAnimation详解(一) 有关Layer的动画

    以前由于项目需要 也写了一些动画 ,但是知识不系统,很散.这段时间趁着项目完成的空袭,来跟着大神的脚步系统的总结一下iOS中Core Animation的知识点. 原博客地址:http://blog. ...

  2. iOS CoreAnimation 核心动画

    一 介绍 一组非常强大的动画处理API 直接作用在CALAyer上,并非UIView(UIView动画) CoreAnimation是所有动画的父类,但是不能直接使用,应该使用其子类 属性: dura ...

  3. iOS关于CoreAnimation动画知识总结

    一:UIKit动画 在介绍CoreAnimation动画前先简单介绍一下UIKit动画,大部分简单的动画都可以使用UIKit动画实现,如果想实现更复杂的效果,则需要使用Core Animation了: ...

  4. CoreAnimation方法汇总

    使用CoreAnimation一般分为三个部分:1.创建执行动画的CALayer 2.创建动画 3.CALayer 添加Animation CoreAnimation是以锚点为基础. CoreAnim ...

  5. CoreAnimation笔记

    核心动画继承结构 CoreAnimation Core Animation是直接作用在CALayer上的(并非UIView上)非常强大的跨Mac OS X和iOS平台的动画处理API,Core Ani ...

  6. 【原】iOSCoreAnimation动画系列教程(二):CAKeyFrameAnimation【包会】

    在上一篇专题文章[原]iOSCoreAnimation动画系列教程(一):CABasicAnimation[包会]中我们学习了iOS核心动画CoreAnimation中CABasicAnimation ...

  7. 第二十九篇、CoreAnimation的使用

    使用的的三个步骤 1.初始化演员 2.设置好剧情 3.播放 主要类: CALayer // 绘图部分 CABaseAnimation // 基本动画(缩放,移动) CAKeyframeAnimatio ...

  8. CoreAnimation

    CoreAnimation 1.CABasicAnimation // position CABasicAnimation *ba = [CABasicAnimation animationWithK ...

  9. Core Animation之CAKeyframeAnimation

    在上一篇专题文章中我们学习了iOS核心动画CoreAnimation中CABasicAnimation动画的使用方法.CABasicAnimation已经可以应付一些比较简单的应用场景了,比如view ...

  10. CoreAnimation (CALayer 动画)

    CoreAnimation基本介绍: CoreAnimation动画位于iOS框架的Media层 CoreAnimation动画实现需要添加QuartzCore.Framework CoreAnima ...

随机推荐

  1. Python_查询手机供应商

    def Seach_Phone_Nmuber_operator(): CN_mobile = [134,135,136,137,138,139,150,151,152,157,158,159,182, ...

  2. SOAPUI使用教程-从现有的服务创建REST模拟服务

    从现有的服务创建REST模拟服务 在您的项目创建一个模拟服务从现有的服务是非常简单的. 右键单击 服务 . 选择 生成模拟服务 . 打开一个对话框窗口. 输入一个描述性的名称. 点击 好吧 . 创建模 ...

  3. 关于clientWidth scrollWidth offsetWidth的理解

    clientWidth:元素可见区域的宽度  clientWidth=padding+width-滚动条 scrollWidth:元素实际内容的宽度 scrollWidth=padding+width ...

  4. mac PHP配置

    apache默认路径配置方法 apache的配置   apache已经自带了,只需如下三个命令就可以了. 开启apache服务 sudo apachectl start 停止apache服务 sudo ...

  5. sublime和python--path

    配置Sublime Text 2 的Python运行环境 (2013-09-11 11:36:17) 转载▼ 标签: python 分类: 科技相关     Sublime Text 2作为一款轻量级 ...

  6. DrawerLayout

        一.概述       DrawerLayout是官方提供的侧滑菜单,相比SliddingMenu,它更加轻量级.默认情况下,DrawerLayout可以设置左侧或者右侧滑出菜单.如下,   x ...

  7. metasploit 常用命令汇总

    1.连接数据并显示一些信息 db_connet username:password@ip address/database name db_destroy 同上 db_import 文件名字 db_h ...

  8. (转)在网页中JS函数自动执行常用三种方法

    原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...

  9. win7 下配置resin的一些tip

    一.如何查看jdk安装目录: 通过不同方法搜索javac看看, javac.exe 是java的编译器: 可用的搜索方法: 1.cmd 控制台:  where javac 2.开始菜单的搜索: 一直到 ...

  10. github 学习笔记【一】

    这几天在学习github ,其实学了主要用来管理自己的项目!因为要在家里和公司两头做! 所以就开始学习使用!目前熟练几个命令,其他的一边用一遍学吧!想一举成功应该是不太可能的! 反复记忆才能更好,据说 ...