直接上代码
//改变的值
NSValue *v1 = [NSValue valueWithCGPoint:CGPointMake(14, 19)];
NSValue *v2 = [NSValue valueWithCGPoint:CGPointMake(8, 40)];
NSValue *v3 = [NSValue valueWithCGPoint:CGPointMake(30, 60)];
CAKeyframeAnimation *animation = [CAKeyframeAnimation new];
animation.values = @[v1,v2,v3];
//每一帧停留的时间 0-1 之间
animation.keyTimes = @[@(.5),@(.6),@(.9)];
//动画总共需要的时间
animation.duration = 3;
animation.fillMode = kCAFillModeForwards;
animation.repeatCount = HUGE_VAL;
//函数速度控制
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
[self.contentView.layer addAnimation:animation
forKey:@"position"];
以上是改变
position
的动画
所以核心动画能改变的是 view的layer的属性所有能改变的属性
基本概念普及
position 中文可以理解成为position是layer相对superLayer坐标空间的位置。所以请记住这个结论:position的位置是根据anchorPoint来确定的。
anchorPoint 通常被翻译成锚点,其实可以理解为同一个东西。它具体的表现可以看下面这张图,其实就是作为旋转、缩放等空间变化提供了中心点。这就类似于刚才讲的图钉订在白纸的正中间与左上角时分别造就了两种旋转形态。
.anchorPoint、position、frame之间的关系
3.1 —— 三者之间的计算公式
聪明的你其实已经可以在第二点中已经找到这三者之间的关系了,现在我只不过是特地拿出来正式讲一下。
anchorPoint的默认值为 (0.5,0.5),也就是anchorPoint默认在layer的中心点。计算 position的值便可以用下面的公式计算:
position.x = frame.origin.x + 0.5 * bounds.size.width;
position.y = frame.origin.y + 0.5 * bounds.size.height;
里面的0.5是因为anchorPoint取默认值,更通用的公式应该是:
position.x = frame.origin.x + anchorPoint.x * bounds.size.width;
position.y = frame.origin.y + anchorPoint.y * bounds.size.height;
position点是相对suerLayer的,anchorPoint点是相对layer的,两者是相对不同的坐标空间的一个重合点。
core Animation 结构如图:
CAAnimation
是基类,实现了CAMediaTiming
协议 实现动画一般都是通过 CAAnimation
的子类来实现的。
CAAnimation 类方法属性含义
//方法以及参数属性含义
//创建一个核心动画
+ (instancetype)animation;
//提供默认值给key
+ (nullable id)defaultValueForKey:(NSString *)key;
//属性是否可以被归档
- (BOOL)shouldArchiveValueForKey:(NSString *)key;
//速度控制函数
@property(nullable, strong) CAMediaTimingFunction *timingFunction;
//代理 strong 使用时候注意循环引用
@property(nullable, strong) id delegate;
//动画执行完成之后效果是否移除
@property(getter=isRemovedOnCompletion) BOOL removedOnCompletion;
CAPropertyAnimation 类介绍
CAPropertyAnimation 不能直接使用,要用它的子类来创建动画
@interface CAPropertyAnimation : CAAnimation
//创建动画,使用keypath keypath 必须是一开始图片里面的某个
+ (instancetype)animationWithKeyPath:(nullable NSString *)path;
//创建动画的keypath
@property(nullable, copy) NSString *keyPath;
//YES把更改的值追加到当前的present层中 keypath+=value ,NO是把更改的值设置成当前present层的值keypath = value
@property(getter=isAdditive) BOOL additive;
//属性时YES,一个重复的动画时从上一个重复的动画结束的地方开始每个重复(而不是每次都跳到开始的值来重复)
@property(getter=isCumulative) BOOL cumulative;
@property(nullable, strong) CAValueFunction *valueFunction;
@end
CABasicAnimation 基本动画属性介绍
//改变key 值的起始点
@property(nullable, strong) id fromValue;
//改变key 值的结束点
@property(nullable, strong) id toValue;
//指定 fromValue 可以和byValue 相加作用
@property(nullable, strong) id byValue;
//举个栗子
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position.y"];
animation.fromValue = @(10.0f);
animation.byValue = @(100.0f);
animation.duration = 5;
animation.repeatCount = HUGE_VAL;
animation.cumulative = NO;//注意 设置cumulative YES/NO 不同的变化
[self.contentView.layer addAnimation:animation
forKey:@"position.y"];
CAKeyframeAnimation 类方法属性介绍
关键帧动画
//key 变化的每一帧的value
@property(nullable, copy) NSArray *values;
//key 变化的路径
@property(nullable) CGPathRef path;
//范围区间 是 [0,1] 每一帧的过度时间
@property(nullable, copy) NSArray<NSNumber *> *keyTimes;
//每一帧的速度变化函数
@property(nullable, copy) NSArray<CAMediaTimingFunction *> *timingFunctions;
@property(copy) NSString *calculationMode;
@property(nullable, copy) NSArray<NSNumber *> *tensionValues;
@property(nullable, copy) NSArray<NSNumber *> *continuityValues;
@property(nullable, copy) NSArray<NSNumber *> *biasValues;
@property(nullable, copy) NSString *rotationMode;
写博客也是一件很累的事情,明天继续分析,分析完了再接着分析开源库的源码。凌晨两点,晚安
//参考链接
彻底理解position与anchorPoint