iOS开发之动画中的时间
一、概述
在动画中,我们会指定动画的持续时间。例如
scaleAnimation.duration = self.config.appearDuration
那么这个时间是怎么定义的呢?是指的绝对时间吗?
二、层级时间结构
layer在屏幕上的显示位置是根据父layer的位置以及本身相对于父layer偏移定义的。
与此类似,每一个layer都有自己的time space,计算本地时间(local time)时候,需要根据父layer的时间以及一定的转换规则来计算出本地时间。
这个规则就是CAMediaTiming协议。每一个CALayer和CAAnimation实现了这个协议。


三、关于时间的概念
- 绝对时间
Absolute time
由CACurrentMediaTime函数返回,实际调用mach_absolute_time()。 active local time
根据CAMediaTiming协议计算得到的当前对象上的时间。basic local time
由于动画可以重复(repeat)或者回放(play backwards)。需要把active local time转化为做动画相关的时间。
例如active local time是5.5s,动画的重复次数是10,动画持续时间是1s。那么5.5s的active local time对应的local time是0.5s。
四、CAMediaTiming协议
beginTimeRequired. Specifies the begin time of the receiver in relation to its parent object, if applicable.
指定了指定了父对象时间和子对象时间的偏移。
speedSpecifies how time is mapped to receiver’s time space from the parent time space
对动画以及子动画速度应用一个缩放的因子。如果speed是2.0,那么本地时间流逝的速度是父对象的时间流逝速度的两倍。
timeOffsetRequired. Specifies an additional time offset in active local time.
对本地时间做了一个偏移。
五、时间转换公式
- 从父layer转化为active local time
\[ t= max\left\{(t_p-begintime),0\right\}\times speed+offset \]
其中\(t\)是本地时间,\(t_p\)是父layer的时间,其他都是CAMediaTiming要求实现的字段。
六、例子
用一个简单的例子来说明各个参数的影响。动画很简单,一个红色的方块从左移到右边。动画的持续时间是1s,没有重复。

- 设置speed为2,begin time为0.3s,offset为0.5s,效果如下

与上面相比,三处不同- 动画的速度是原来的两倍,这是因为动画的speed是2。
- 动画起始时,滑块的位置为中央,而不是在左边。这是因为offset为0.5s。由于动画的持续时间是1s,0.5s时,动画刚刚进行了一半,滑块的位置是在屏幕中央。
- 点击开始动画的按钮,到开始动画,有一个延迟,这是因为begin time的时间不是默认值,而是有一个0.3s的延迟。
时间变换的图像表示
- 从父layer的时间到子layer的active local time

图中,直线的斜率是speed,第一个y值不为零的点,对应的横轴坐标是begintime,对应的y轴坐标是offset - 从active local time到basic local time

图中,不为0的部分的x轴长度,即是动画时间,由repeattime或repeatDuration指定。由于这个动画没有repeattime或repeatDuration,因此就是动画的duration。如果指定了动画的时间,比如repeatcount为3,那么非0部分会重复3次。
如果指定了
autoreverses为yes,那么折线会部分有负的曲率。第一个不为0的点对应的横轴坐标即为offset。
fillMode可以理解为不在动画时间内的y值是什么。如果kCAFillModeBackwards,对应于横轴在offset之前时,纵轴对应于offset。kCAFillModeForwards对应于横轴在动画结束之后,纵轴保存不变。- 从父layer的时间到子layer的active local time
父对象和子对象联动
我们的例子中,动画是加在layer上的,它们都遵守
CAMediatiming协议,就CAMediatiming看来,动画的父对象是layer。- 设置父对象的speed
我们设置layer的speed为2,动画的speed为0.1,实际的速度会是0.2.
 - 设置父对象的offset
设置父对象的offset为0.5,那么动画将会在一半处开始。

- 设置父对象的speed
七、关于begintime
根据公式
\[
t= max\left\{(t_p-begintime),0\right\}\times speed+offset
\]
这里begintime是应该怎么指定呢?如果想把一个加到layer的动画的延迟5s执行,应该把begintime直接设为5吗?
由于begintime是相对于父对象(layer)的时间偏移。由于layer可能在很久以前就存在了,因此对于动画来说\(t_p\)是一个很大的值。直接把begintime指定为5s,那么\(t\)将会是一个很大的值。正确的做法是把begintime设置为5s+这个layer被加到父layer以后,度过的时间,称为addtime.
animation.beginTime = addTime + delay;
如何得到addtime
addTime = [layer convertTime:CACurrentMediaTime() fromLayer:nil];
参考
控制动画时间
控制动画时间
Time Warp in Animation
iOS开发之动画中的时间的更多相关文章
- iOS开发之动画中的时间(概况)
一.引言 在iOS开发中使用动画时,可以通过设置动画的duration.speed.begintime.offset属性,来设置动画的时长.速度.起始时间及起始偏移. 用一个简单的例子来说明各个参数的 ...
- iOS开发之动画编程的几种方法
iOS开发之动画编程的几种方法 IOS中的动画总结来说有五种:UIView<block>,CAAnimation<CABasicAnimation,CATransition,CAKe ...
- iOS 开发之动画篇 - 从 UIView 动画说起
毋庸置疑的:在iOS开发中,制作动画效果是最让开发者享受的环节之一.一个设计严谨.精细的动画效果能给用户耳目一新的效果,吸引他们的眼光 —— 这对于app而言是非常重要的. 本文作为动画文集的第一篇, ...
- iOS开发-动画总结
一.简介 IOS 动画主要是指Core Animation框架.官方使用文档地址为:Core Animation Guide.Core Animation是IOS和OS X平台上负责图形渲染与动画的基 ...
- ios开发核心动画七:核心动画与UIView动画的区别
/** UIView与核心动画区别?(掌握) 1.核心动画只作用在layer. 2.核心动画看到的都是假像,它并没有去修改UIView的真实位置. 什么时候使用核心动画? 1.当不需要与用户进行交互, ...
- iOS dateformatter设置GMT格式时间--iOS开发系列---项目中成长的知识四
今天在项目中开始接手客户端的签名这个模块,签名这个会在项目结束过后再单独写一下自己的心得! 今天讲讲在签名的过程中我们需要向服务器传送一个Date值,格式要求是格林威治时间,也就是GMT时间! 格式要 ...
- (转)iOS 开发,工程中混合使用 ARC 和非ARC
[前提知识] ARC:Automatic Reference Counting,自动引用计数 在开发 iOS 3 以及之前的版本的项目时我们要自己负责使用引用计数来管理内存,比如要手动 retain. ...
- iOS 开发,工程中混合使用 ARC 和非ARC(转)
[前提知识] ARC:Automatic Reference Counting,自动引用计数 在开发 iOS 3 以及之前的版本的项目时我们要自己负责使用引用计数来管理内存,比如要手动 retain. ...
- iOS开发CABasicAnimation动画理解
1.CALayer简介 CALayer是个与UIView很类似的概念,同样有backgroundColor.frame等相似的属性,我们可以将UIView看做一种特殊的CALayer.但实际上UIVi ...
随机推荐
- Java中如何将String转成Date
Java中如何将String转成Date 最近在开发Json数据反序列化为Java对象的时候发现spring mvc 和 Jackson 对Date类型对支持不是特别好,虽然在Java对象序列化为Js ...
- eclipse中断点调试debug
几乎没有用过debug模式,每次想要知道结果都是sysou一下.记得曾经问乱码问题,jfinal说打断点调试看在哪里出错.简单记下普通调试. 1.在需要查看的地方打断点,方法是在行号右侧双击. 2.运 ...
- 第18/24周 乐观并发控制(Optimistic Concurrency)
大家好,欢迎回到性能调优培训.上个星期我通过讨论悲观并发模式拉开了第5个月培训的序幕.今天我们继续,讨论下乐观并发模式(Optimistic Concurrency). 行版本(Row Version ...
- web框架--flask
flask介绍 Flask是一个基于Python开发并且依赖jinja2模板和Werkzeug WSGI服务的一个微型框架,对于Werkzeug本质是Socket服务端,其用于接收http请求并对请求 ...
- C语言学习006:歌曲搜索
#include <stdio.h> #include <string.h> //字符串处理库 ]={ "I left my heart in Harvard Med ...
- 使用html和css的一些经验
1.注释须知:html中注释不能这样写: <div></div><!--------这是错误写法-------> <div></div>&l ...
- 头文件里面的ifndef /define/endif的作用
c,c++里面,头文件里面的ifndef /define/endif的作用 今天和宿舍同学讨论一个小程序,发现有点地方不大懂······ 是关于头文件里面的一些地方: 例如:要编写头文件test.h ...
- linux两个文件修改主机名
linux修改主机名的方法 用hostname命令可以临时修改机器名,但机器重新启动之后就会恢复原来的值. #hostname //查看机器名#hostname -i //查看本机器名对应的ip ...
- C# 站点IP访问频率限制 针对单个站点
0x00 前言 写网站的时候,或多或少会遇到,登录,注册等操作,有时候,为了防止别人批量进行操作,不得不做出一些限制IP的操作(当前也可以用于限制某个账号的密码校验等). 这样的简单限制,我们又不想对 ...
- idea IntelliJ IDEA 2016.2破解
从2016-08-06开始全面切到HTTPS访问模式,而IntelliJ IDEA的License server不支持HTTPS访问,所以本博客将IntelliJ IDEA的在线注册码生成页面转到了h ...