【code_小马】OC沿着曲线运动的动画-CFANZ编程社区

CALayer篇：

这个帖子展示的是CALayer的一个子类：CAReplicatorLayer 与UIBezierPath 实现曲线运动的动画效果（里边有曲线，直线）。
一共有五个动画效果，本帖子先举出一个，接下来还会更新更多，如果喜欢，希望大家多多鼓励。

来 ~ 先上gif图

1.复制图层" instanceCount"设置为多个时候的效果

_replicatorLayer.instanceCount = 30.0

2.复制图层" instanceCount"设置为一个时候的效果

_replicatorLayer.instanceCount = 1.0

代码量很小，先拿去复制粘贴吧

#import "ViewController.h"

#define H self.view.frame.size.height
#define W self.view.frame.size.width

@interface ViewController ()
/**图片*/
@property (nonatomic , weak) UIImageView *imageView;
/**replicatorLayer*/
@property (nonatomic , weak) CAReplicatorLayer *replicatorLayer;

@end

#pragma mark - 添加图片
- (void)addImageView {
    UIImageView *imageView = [[UIImageView alloc]init];
    [self.view addSubview:imageView];
    
    imageView.contentMode = UIViewContentModeScaleAspectFit;
    _imageView = imageView;
}

#pragma mark - 设置ReplicatorLayer 
- (void)addReplicatorLayer {
    
    CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];
    
    replicatorLayer.bounds = self.view.bounds;
    replicatorLayer.position = self.view.center;
    
    replicatorLayer.preservesDepth = YES;
    
    replicatorLayer.instanceColor = [UIColor whiteColor].CGColor;
    
    [replicatorLayer addSublayer:_imageView.layer];
    [self.view.layer addSublayer:replicatorLayer];
    _replicatorLayer = replicatorLayer;
    
    
}

#pragma mark - 设置动画

- (void)code_XMAnimationTwo{
    _imageView.contentMode = UIViewContentModeScaleAspectFit;
    /**初始位置*/
    _imageView.frame = CGRectMake(20, 600, 15, 15);
    
    _imageView.backgroundColor = [UIColor orangeColor];
    _imageView.image = [UIImage imageNamed:@"hei"];
    _imageView.layer.cornerRadius = 7.5;
    _imageView.layer.masksToBounds = YES;
    
    CGFloat count = 30.0;
    CGFloat duration = 3;
    _replicatorLayer.instanceCount = count;/**复制图层个数*/
    _replicatorLayer.instanceDelay = duration / count;/**复制延迟*/
    _replicatorLayer.instanceAlphaOffset = 0.1;
    
    /**规划路径----UIBezierPath*/
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(20, 600)];/**动画开始的点--基准点*/
    [path addLineToPoint:CGPointMake(20, 100)];/**第一条直线终点（也是第二条直线的开始点）*/
    [path addCurveToPoint:CGPointMake(200, 400) controlPoint1:CGPointMake(200, 20) controlPoint2:CGPointMake(20, 400)];/**曲线的  起点(也是第二条直线的终点) 、 控制点1 、控制点2*/
    [path addLineToPoint:CGPointMake(280, 90)];/**直线*/
    [path addLineToPoint:CGPointMake(380, 280)];/**直线*/
    [path addLineToPoint:CGPointMake(240, 400)];/**直线*/
    [path addLineToPoint:CGPointMake(400, 500)];/**最后一条直线终点*/
    
    CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    keyFrameAnimation.path = CGPathCreateCopyByTransformingPath(path.CGPath, NULL);
    keyFrameAnimation.duration = duration;
    keyFrameAnimation.repeatCount = 2;/**重复次数*/
    [_imageView.layer addAnimation:keyFrameAnimation forKey:nil];
    
}

属性简介解


// CAReplicatorLayer可以将自己的子图层复制指定的次数,并且复制体会保持被复制图层的各种基础属性以及动画

//基本属性

instanceCount
 Int 型   拷贝图层的次数,包括其所有的子图层,默认值是1,也就是没有任何子图层被复制


instanceDelay
CFTimeInterval 类  在短时间内的复制延时,一般用在动画上(支持动画的延时)



instanceTransform
 CATransform3D 类  复制图层在被创建时产生的和上一个复制图层的位移(位移的锚点时CAReplicatorlayer的中心点)



preservesDepth
 Bool 型  如果设置为YES,图层将保持于CATransformLayer类似的性质和相同的限制



instanceColor
CGColor 类 设置多个复制图层的颜色,默认位白色



instanceRedOffset
 Float 型  设置每个复制图层相对上一个复制图层的红色偏移量



instanceGreenOffset
 Float 型  设置每个复制图层相对上一个复制图层的绿色偏移量



instanceBlueOffset
 Float 型    设置每个复制图层相对上一个复制图层的蓝色偏移量



instanceAlphaOffset
Float 型  设置每个复制图层相对上一个复制图层的透明度偏移量

【code_小马】

晌午时光

很喜欢的一篇文章，拿出来和大家分享
【第九集】

点击阅读文章第八集

点击阅读文章第十集

文章后续更新中，喜欢请关注哦 ?