CAKeyframeAnimation->CAPropertyAnimation->CAAnimation 继承关系
CABasicAnimation->CAPropertyAnimation->CAAnimation 继承关系
- (CAKeyframeAnimation *)getMoveAnimation:(CGPoint)tpoint fromPoint:(CGPoint)fpoint index:(int)index { CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"]; // 设定动画起始帧和结束帧 animation.calculationMode = kCAAnimationPaced; animation.fillMode = kCAFillModeForwards; //当动画结束后,layer会一直保持着动画最后的状态. animation.removedOnCompletion = NO; //当动画结束后,是否保留显示隐性层 animation.repeatCount = 0; //重复次数,无限使用INFINITY animation.delegate = self; [animation setValue:@(index) forKey:@"AnimationViewIndex"]; float d = sqrtf ((fpoint.x-tpoint.x)*(fpoint.x-tpoint.x)+(fpoint.y-tpoint.y)*(fpoint.y-tpoint.y)); animation.duration = d/500; //所用时间 CGMutablePathRef curvedPath = CGPathCreateMutable(); CGPathMoveToPoint(curvedPath, 0, fpoint.x, fpoint.y); CGPathAddLineToPoint(curvedPath, 0, tpoint.x, tpoint.y); animation.path = curvedPath; CGPathRelease(curvedPath); return animation; }
caleculatuinMode: kCAAnimationLinear calculationMode的默认值,表示当关键帧为座标点的时候,关键帧之间直接直线相连进行插值计算; kCAAnimationDiscrete 离散的,就是不进行插值计算,所有关键帧直接逐个进行显示; kCAAnimationPaced 使得动画均匀进行,而不是按keyTimes设置的或者按关键帧平分时间,此时keyTimes和timingFunctions无效; kCAAnimationCubic 对关键帧为座标点的关键帧进行圆滑曲线相连后插值计算,这里的主要目的是使得运行的轨迹变得圆滑; kCAAnimationCubicPaced 看这个名字就知道和kCAAnimationCubic有一定联系,其实就是在kCAAnimationCubic的基础上使得动画运行变得均匀,就是系统时间内运动的距离相同,此时keyTimes以及timingFunctions也是无效的.
fillMode: kCAFillModeRemoved 这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态 . kCAFillModeForwards 当动画结束后,layer会一直保持着动画最后的状态. kCAFillModeBackwards 在动画开始前,你只要将动画加入了一个layer,layer便立即进入动画的初始状态并等待动画开始. 你可以这样设定测试代码,将一个动画加入一个layer的时候延迟5秒执行.然后就会发现在动画没有开始的时候,只要动画被加入了layer,layer便处于动画初始状态 kCAFillModeBoth 这个其实就是上面两个的合成.动画加入后开始之前,layer便处于动画初始状态,动画结束后layer保持动画最后的状
@interface NSObject (CAAnimationDelegate) /* Called when the animation begins its active duration. */ - (void)animationDidStart:(CAAnimation *)anim; /* Called when the animation either completes its active duration or * is removed from the object it is attached to (i.e. the layer). 'flag' * is true if the animation reached the end of its active duration * without being removed. */ - (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag; @end
动画开始和结束都会有delegate回调,具体回调内容可以使用setvalue的方式带参过去!
[animation setValue:@(index) forKey:@"AnimationViewIndex"];
另外可以通过下面函数来画出想要的行动轨迹。
CGPathMoveToPoint、CGPathAddLineToPoint、CGPathAddArc、CGPathAddRect
------------------------------------凌乱的分割线----------------------------------------
如果你只是想简单的移动某点到某点的话,可以使用CABasicAnimation能更简单点
- (CABasicAnimation *)getMoveAnimation:(CGPoint)tpoint fromPoint:(CGPoint)fpoint index:(int)index type:(NSString *)type { CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position"]; // 设定动画起始帧和结束帧 animation.fromValue = [NSValue valueWithCGPoint:fpoint]; // 起始点 animation.toValue = [NSValue valueWithCGPoint:tpoint]; // 终点 animation.fillMode = kCAFillModeForwards; animation.removedOnCompletion = NO; animation.repeatCount = 0; animation.delegate = self; [animation setValue:@(index) forKey:@"AnimationViewIndex"]; [animation setValue:type forKey:@"AnimationKeyType"]; float d = sqrtf ((fpoint.x-tpoint.x)*(fpoint.x-tpoint.x)+(fpoint.y-tpoint.y)*(fpoint.y-tpoint.y)); animation.duration = d/500; return animation; }
速度控制函数(CAMediaTimingFunction) 1> kCAMediaTimingFunctionLinear(线性):匀速,给你一个相对静态的感觉 2> kCAMediaTimingFunctionEaseIn(渐进):动画缓慢进入,然后加速离开 3> kCAMediaTimingFunctionEaseOut(渐出):动画全速进入,然后减速的到达目的地 4> kCAMediaTimingFunctionEaseInEaseOut(渐进渐出):动画缓慢的进入,中间加速,然后减速的到达目的地。 这个是默认的动画行为。
移动简单的移动外还有启动的动画,只需要修改keyPath值就行
@"position":位置移动 @"transform.scale":缩放 @"transform.rotation.x":x轴旋转 @"transform.rotation.y":y轴旋转 @"transform.rotation.z":z轴旋转 默认以layer中心为圆心,可以通过下面方式修改 [yourView.layer setAnchorPoint:CGPointMake(0.5, 0.5)];
/* 动画组 */ CAAnimationGroup *group = [CAAnimationGroup animation]; group.delegate = self; group.duration = 5.0; group.repeatCount = 1; // 动画结束后不变回初始状态 group.removedOnCompletion = NO; group.fillMode = kCAFillModeForwards; // 添加动画 group.animations = [NSArray arrayWithObjects:animation1, animation2, nil]; [imageView.layer addAnimation:group forKey:@"move-rotate-layer"];
------------------------------------凌乱的分割线----------------------------------------
加贝塞尔曲线运动
CAKeyframeAnimation *positionAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"]; positionAnimation.calculationMode = kCAAnimationPaced; positionAnimation.fillMode = kCAFillModeForwards; positionAnimation.removedOnCompletion = NO; positionAnimation.repeatCount = 0; CGMutablePathRef curvedPath = CGPathCreateMutable(); UIBezierPath *cutePath = [UIBezierPath bezierPath]; [cutePath moveToPoint:fpoint]; [cutePath addCurveToPoint:tpoint controlPoint1:point1 controlPoint2:point2]; //贝塞尔曲线 CGPathAddPath(curvedPath, 0, cutePath.CGPath); positionAnimation.path = curvedPath; CGPathRelease(curvedPath);