当你的才华撑不起你的野心时,你就应该静下来学习。 —— CJJ
- 这一篇讲解的是CoreAnimation这个类中的属性和方法,了解了每一个属性和方法之后,使用起来就很轻松了。
- 文尾有demo链接,想要学习一下的小伙伴可以下载看看,帮到你的话点个star吧
- 话不多说,直接上图上代码
我们用下图来表达CoreAnimation的完整结构
-
此外还有CASpringAnimation 弹性动画 (iOS9.0之后,它实现弹簧效果的动画,是CABasicAnimation的子类。)
在Core Animation中可以使用创建实例对象的动画类:
1.基础动画: CABasicAnimation
2.关键帧动画: CAKeyframeAnimation
3.转场动画: CATransition
4.弹性动画: CASpringAnimation
5.动画组合: CAAnimationGroup
-
Core Animation是在后台执行的,不会阻塞主线程。
-
Core Animation直接作用于CALayer,而不是UIView
总体来说核心动画的优点有:
1、性能强大,使用硬件加速,可以同时向多个图层添加不同的动画效果
2、接口易用,只需要少量的代码就可以实现复杂的动画效果。
3、运行在后台线程中,在动画过程中可以响应交互事件(UIView动画默认动画过程中不响应交互事件)
4、只有在发生改变的时候才重绘内容,消除了动画的帧速率上的运行代码,提高应用性能
动画操作过程:
1、创建一个CAAnimation对象
2、设置一些动画的相关属性
3、给CALayer添加动画(addAnimation:forKey: 方法)
4、移除CALayer中的动画(removeAnimationForKey: 方法)
各项类的用法与相关属性
-
CAAnimation(动画基类)
@interface CAAnimation : NSObject
{
@private
void *_attr;
uint32_t _flags;
}
/* 初始化类方法,创建实例对象 */
+ (instancetype)animation;
/* 动画实现与CALayer定义的相同的属性模型.有关更多详细信息,请参见CALayer.h */
/* 设置动画key值(在CALayer添加动画时,添加动画并设置key:CALayer方法中设置- (void)addAnimation:(CAAnimation *)anim forKey:(nullable NSString *)key */
+ (nullable id)defaultValueForKey:(NSString *)key;
- (BOOL)shouldArchiveValueForKey:(NSString *)key;
(
属性类别:
设置 动画一段时的快慢
设置了其动画的时间函数为CAMediaTimingFunction(name:kCAMediaTimingFunctionLinear)。时间函数通过修改持续时间的分数来控制动画的速度。(猜想:通过这个方法设置CAMediaTiming协议下的speed)
kCAMediaTimingFunctionLinear //线型移动
kCAMediaTimingFunctionEaseIn //淡入
kCAMediaTimingFunctionEaseOut //淡出
kCAMediaTimingFunctionEaseInEaseOut //淡入淡出
kCAMediaTimingFunctionDefault // 默认
同时可以通过自定义CAMediaTimingFunction时间功能定义动画的时间
)
@property(nullable, strong) CAMediaTimingFunction *timingFunction;
/* 动画的执行的两个阶段的代理 */
@property(nullable, strong) id delegate;
/* 默认为YES,代表动画执行完毕后就从图层上移除,图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态,那就设置为NO,不过还要设置fillMode属性为kCAFillModeForwards。比如进入后台回来动画依然执行,可以使用这个属性。*/
@property(getter=isRemovedOnCompletion) BOOL removedOnCompletion;
@end
/* 以下属性继承CAMediaTiming协议 */
@protocol CAMediaTiming
/* 设置当前动画开始的时间,如果没有设置默认为0,动画当前生成的时间 */
@property CFTimeInterval beginTime;
/* 设置 动画执行的时长 默认:0 */
@property CFTimeInterval duration;
/*
可以通过speed和timeOffset这两个参数设置更复杂的动画效果,可以实现动画的暂停、快进等效果
动画执行时间: t = (tp - begin) * speed + offset
动画执行时间为:t 系统时间:tp 动画开始时间:begin
默认情况下,speed:1 offset:0
speed:单位时间执行的rate 例子:如果rate是2 本地时间是当前时间快两倍
*/
@property float speed;
@property CFTimeInterval timeOffset;
/* 动画执行的重复次数 */
@property float repeatCount;
/* 动画每次执行的时长 默认时间为0 */
@property CFTimeInterval repeatDuration;
/* 是否 动画反方向执行);自定义为NO */
@property BOOL autoreverses;
(
//默认是kCAFillModeRemoved,当动画不再播放的时候就显示图层模型指定的值剩下的三种类型向前,向后或者即向前又向后去填充动画状态,使得动画在开始前或者结束后仍然保持开始和结束那一刻的值
kCAFillModeForwards//对应toValue:动画结束后,图层保持toValue状态
kCAFillModeBackwards//对应fromValue:动画前,图层一直保持fromValue状态
kCAFillModeBoth//对应fromValue和toValue:以上两者的结合
kCAFillModeRemoved//对图层没有什么影响,动画结束后图层恢复原来的状态
)
@property(copy) CAMediaTimingFillMode fillMode;
@end
/* 动画的执行的两个阶段的协议 */
@protocol CAAnimationDelegate
@optional
/* 核心动画开始时执行 */
- (void)animationDidStart:(CAAnimation *)anim;
/* 核心动画执行结束后调用 */
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;
@end
-
CAPropertyAnimation(属性动画,继承CAAnimation)
CAPropertyAnimation基于property,他的keyPath就是描述需要动画的属性
keyPath:通过指定CALayer的一个属性名做为keyPath里的参数(NSString类型),并且对CALayer的这个属性的值进行修改,达到相应的动画效果。比如,指定@”position”为keyPath,就修改CALayer的position属性的值,以达到平移的动画效果。
CAPropertyAnimation *animation = [CAPropertyAnimation animationWithKeyPath:@"position.y"];
[self.view.layer addAnimation:animation forKey:@"position_y"];
一些常用的animationWithKeyPath值的总结
@interface CAPropertyAnimation : CAAnimation
+ (instancetype)animationWithKeyPath:(nullable NSString *)path;
/* 要改变的属性名称(传字符串)*/
@property(nullable, copy) NSString *keyPath;
/*
这个属性确定动画执行的状态是否叠加在控件的原状态上
默认设置为NO,如果我们执行两次位置移动的动画,会从同一位置执行两次
如果设置为YES,则会在第一次执行的基础上执行第二次动画
*/
@property(getter=isAdditive) BOOL additive;
/*
cumulative这个属性,有重复次数时才有用,
当设为true时这个动画的当前value就是上次动画的结尾的value加上当前重复中的value,
当设为false,value就一直是这个值
*/
@property(getter=isCumulative) BOOL cumulative;
/*
valueFunction这个是用来转化你设置的动画值为动画需要的矩阵值,
不赋值他就有默认的转化方式
*/
@property(nullable, strong) CAValueFunction *valueFunction;
@end
-
CABasicAnimation(基本动画,继承CAPropertyAnimation)
@interface CABasicAnimation : CAPropertyAnimation
/* keyPath相应属性的初始值 */
@property(nullable, strong) id fromValue;
/* keyPath相应属性的结束值 */
@property(nullable, strong) id toValue;
/* byValue和toValue的区别,前者是在当前的位置上增加多少,后者是到指定的位置 */
@property(nullable, strong) id byValue;
@end
-
CAKeyframeAnimation(关键帧动画,继承CAPropertyAnimation)
类似画图,画多个点,各个点连起来的线就是动画轨迹,每个点有对应的位置,对应的时间点
@interface CAKeyframeAnimation : CAPropertyAnimation
/*
NSArray对象,里面的元素称为”关键帧”(NSValue类型),
动画对象会在指定的时间(duration)内,
依次显示values数组中的每一个关键帧( NSValue)
*/
@property(nullable, copy) NSArray *values;
/*
可以设置一个CGPathRef、CGMutablePathRef,
让层跟着路径移动,path只对CALayer的anchorPoint和position起作用,
如果设置了path,那么values、keyTimes将被忽略。
*/
@property(nullable) CGPathRef path;
/*
keyTimes的值与values中的值一一对应指定关键帧在动画中的时间点,取值范围为[0,1]。当keyTimes没有设置的时候,
各个关键帧的时间是平分的
*/
@property(nullable, copy) NSArray *keyTimes;
/* 指定每个关键帧之间的动画缓冲效果,timingFunctions.count = keyTimes.count-1 */
@property(nullable, copy) NSArray *timingFunctions;
/* 关键帧间插值计算模式 */
@property(copy) CAAnimationCalculationMode calculationMode;
/*针对cubic 计算模式的动画,这些属性提供对插值方案的控制。每个*关键帧都可以具有与之相关的
张力、连续性和偏差值,这些值的范围在[-1,1]内(这定义了Kochanek-*Bartels样条,见http://en.wikipedia.org/wiki/Kochanek-Bartels_spline)。
*tensionValues控制曲线的“紧密度”(正值更紧,负值更圆)。
*continuityValues控制段的连接方式(正值表示锐角,负值表示倒角)。
*biasValues定义曲线发生的位置(正值在控制点之前移动曲线,负值在控制点之后移动它)。
*每个数组中的第一个值定义第一个控制点的切线的行为,第二个值控*制第二个点的切线,依此类推。任何未指定的值都默认为零
*(如果未指定,则给出Catmull-Rom样条曲线)。
*/
@property(nullable, copy) NSArray *tensionValues;
@property(nullable, copy) NSArray *continuityValues;
@property(nullable, copy) NSArray *biasValues;
/*
定义沿路径动画的对象是否旋转以匹配路径切线
kCAAnimationRotateAuto //根据路径自动旋转
kCAAnimationRotateAutoReverse //根据路径自动翻转
*/
@property(nullable, copy) CAAnimationRotationMode rotationMode;
@end
-
CASpringAnimation(弹簧动画,继承CAAnimation)
@interface CASpringAnimation : CABasicAnimation
/* 质量,影响图层运动时的弹簧惯性,质量越大,弹簧拉伸和压缩的幅度越大 */
@property CGFloat mass;
/* 刚度系数(劲度系数/弹性系数),刚度系数越大,形变产生的力就越大,运动越快 */
@property CGFloat stiffness;
/* 阻尼系数,阻止弹簧伸缩的系数,阻尼系数越大,停止越快 */
@property CGFloat damping;
/*
初始速率,动画视图的初始速度大小 Defaults to zero
速率为正数时,速度方向与运动方向一致,速率为负数时,速度方向与运动方向相反
*/
@property CGFloat initialVelocity;
/* 估算时间 返回弹簧动画到停止时的估算时间,根据当前的动画参数估算 */
@property(readonly) CFTimeInterval settlingDuration;
@end
-
CATransition(转场动画,继承CAAnimation)
CATransitionType
以下是基本的四种效果
kCATransitionPush 推入效果
kCATransitionMoveIn 移入效果
kCATransitionReveal 截开效果
kCATransitionFade 渐入渐出效果
以下API效果可以安全使用
cube 方块
suckEffect 三角
rippleEffect 水波抖动
pageCurl 上翻页
pageUnCurl 下翻页
oglFlip 上下翻转
cameraIrisHollowOpen 镜头快门开
cameraIrisHollowClose 镜头快门开
以下API效果请慎用
spewEffect 新版面在屏幕下方中间位置被释放出来覆盖旧版面.
genieEffect 旧版面在屏幕左下方或右下方被吸走, 显示出下面的新版面
unGenieEffect 新版面在屏幕左下方或右下方被释放出来覆盖旧版面.
twist 版面以水平方向像龙卷风式转出来.
tubey 版面垂直附有弹性的转出来.
swirl 旧版面360度旋转并淡出, 显示出新版面.
charminUltra 旧版面淡出并显示新版面.
zoomyIn 新版面由小放大走到前面, 旧版面放大由前面消失.
zoomyOut 新版面屏幕外面缩放出现, 旧版面缩小消失.
oglApplicationSuspend 像按”home” 按钮的效果
CATransitionSubtype
kCATransitionFromRight 从右边开始
kCATransitionFromLeft 从左边开始
kCATransitionFromTop 从上面开始
kCATransitionFromBottom 从下面开始
@interface CATransition : CAAnimation
/* 可选效果如上,动画的效果,传字符串 */
@property(copy) CATransitionType type;
/* 可选效果如上 动画开始的方向*/
@property(nullable, copy) CATransitionSubtype subtype;
/* 开始和结束的位置进度,数值介于[0,1]之间,结束值一定是大于开始值的 */
@property float startProgress;
@property float endProgress;
@end
-
CAAnimationGroup(动画组,继承CAAnimation)
@interface CAAnimationGroup : CAAnimation
/* 组动画中的动画数组 */
@property(nullable, copy) NSArray *animations;
@end
文尾献上Demo CJJCoreAnimationDemo
传送门:iOS-CoreAnimation核心动画(使用篇)