iOS基于路径显示/取消屏蔽图像？

Question

我正在尝试绘制此特定图像的动画：

然而，我意识到尝试用CGPath绘制它并不是真的可行。我认为下一个解决方案是尝试根据它的路径上的近似值来显示这个图像。所以我设法画出了一张接近这张图片的CGPath：

我希望有人可以帮我搞清楚！

我确实有以下代码来至少描述路径。我正在使用SVGKit来帮助从SVG文件创建路径：

-(void)animateItAll{
    self.thePath = [UIBezierPath bezierPathWithCGPath:[PocketSVG pathFromSVGFileNamed:@"SquiggleLine"]];
    self.thePath.lineCapStyle = kCGLineCapRound;
    self.thePath.lineJoinStyle = kCGLineJoinRound;

CAShapeLayer *shapeView = [[CAShapeLayer alloc] init];
[shapeView setPath:self.thePath.CGPath];
shapeView.fillColor = [[UIColor clearColor] CGColor];
shapeView.strokeColor = [[UIColor redColor] CGColor];
shapeView.lineWidth = 8.0f;

[[self.view layer] addSublayer: shapeView];

CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 1.0;
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];
//pathAnimation.toValue = (id) self.thePath.CGPath;

[shapeView addAnimation:pathAnimation forKey:nil];

}

Answer 1

  

不是用一条贝塞尔曲线表示我们的绘制笔划，而是用两条贝塞尔曲线之间的填充区域来表示它。通过稍微改变定义这两条贝塞尔曲线的控制点的偏移量，我们将设法实现平滑变化的笔宽度的非常合理的效果。   https://code.tutsplus.com/tutorials/ios-sdk-advanced-freehand-drawing-techniques--mobile-15602

你可以借助这个答案从UIBezierPath获得点数组https://stackoverflow.com/a/5714872/2412568