画线动画渐次画出来，视觉效果还不赖

最近逛论坛看到不少人问画线+动画效果的问题，好多年前项目用过。UI设计的好，实现效果确实杠杠滴。具体实现也不难，就是CAShapeLayer画线 + CABasicAnimation动画 就ok。画线路径，画线时间可自己随意编辑。

先上核心代码吧：

- (void)showLinesAnimationBegin
{
    for (int i=0; i<[self.allPoints count]; i++)
    {
        self.curPoints = [self.allPoints objectAtIndex:i];
        //添加path的UIView
        ShapeView  *pathShapeView = [[ShapeView alloc] init];
        pathShapeView.backgroundColor = [UIColor clearColor];
        pathShapeView.opaque = NO;
        pathShapeView.translatesAutoresizingMaskIntoConstraints = NO;
        [self addSubview:pathShapeView];
        
        //设置线条的颜色
        UIColor *pathColor = nil;
        pathColor = [UIColor colorWithRed:96.0/255 green:142.0/255 blue:190.0/255 alpha:1.0f];
        pathShapeView.shapeLayer.fillColor = nil;
        pathShapeView.shapeLayer.strokeColor = pathColor.CGColor;
        pathShapeView.shapeLayer.lineWidth = LINEWIDE;
        
        //创建动画
        CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:NSStringFromSelector(@selector(strokeEnd))];
        animation.fromValue = @0.0;
        animation.toValue = @1.0;
        animation.duration = [[TIMESELFSETARRAY objectAtIndex:i] floatValue];//设置画线时间;
        [pathShapeView.shapeLayer addAnimation:animation forKey:NSStringFromSelector(@selector(strokeEnd))];
        [self updatePathsWithPathShapeView:pathShapeView];
        
        if (i == [self.allPoints count]-1) {
            _lindex = 0;
            [[UIApplication sharedApplication] endIgnoringInteractionEvents];
            return;
        }
    }
}

贴个效果图吧，要是能加视频就好了，毕竟是做的动画效果，图片不能体现出来效果

简单封装了一下，调用起来也相当方便：

NeedDrawView *pathBuilderView = [[NeedDrawView alloc] initWithFrame:CGRectMake(0, 35, self.view.frame.size.width, self.view.frame.size.height)];
    pathBuilderView.contentMode =UIViewContentModeScaleAspectFill;
    [self.view addSubview:pathBuilderView];
    
    [pathBuilderView setData:nil];

查看具体dema下载地址： https://github.com/Deng0512/DrawAnimationLine 下载