一种跟踪 CAShapeLayer 的 strokeEnd 点的方法？答案

【问题标题】：A way to track strokeEnd point of a CAShapeLayer?一种跟踪 CAShapeLayer 的 strokeEnd 点的方法？
【发布时间】：2014-09-19 16:41:00
【问题描述】：

我的问题涉及跟踪 CAShapeLayer 的 strokeEnd 点坐标的可能性。

我有一个 UISlider，它生成一个介于 0 和 1 之间的变量。我从 CGMutablePathRef 创建一个 UIBezierPath，并将其分配为 CAShapeLayer 的路径属性。

这是我的头文件：

@interface ViewController : UIViewController
@property (strong, nonatomic) IBOutlet UISlider *progressSlider;
@property (strong,nonatomic) CAShapeLayer *raceTrack;
- (IBAction)progressChanged:(id)sender;
@end

在实现文件中，我写了如下代码：

CGMutablePathRef truePath = CGPathCreateMutable();
CGPathMoveToPoint(truePath, NULL, 100.0f, 468.0f-20.0f);
CGPathAddQuadCurveToPoint(truePath, NULL, 70.0f, 268.0f, 100.0f, 68.0f+20.0f);

UIBezierPath *trackPath = [UIBezierPath bezierPathWithCGPath:truePath];

self.raceTrack = [CAShapeLayer layer];
self.raceTrack.path = trackPath.CGPath;
self.raceTrack.strokeEnd = 0.0;
self.raceTrack.strokeColor = [UIColor yellowColor].CGColor;
self.raceTrack.fillColor = [UIColor clearColor].CGColor;
self.raceTrack.lineWidth = 7.0;
[self.view.layer addSublayer:self.raceTrack];

每次更改滑块时都会调用以下函数：

- (IBAction)progressChanged:(id)sender{
self.raceTrack.strokeEnd = self.progressSlider.value;}

这完美！但现在我想在屏幕上绘制的线的末端添加一种圆圈。我不能张贴图片，但如果你想了解，我们可以假设圆圈是彗星，在它后面，描边的路径是彗星的尾巴。

我不知道如何实现这一点。我认为最好的方法可能是跟踪笔画终点的坐标并使用 addSublayer 添加一个圆圈并将该圆圈的位置属性设置为等于 strokeEnd 点的坐标。我不知道是否存在这样的 strokeEnd 点，或者你们中的某个人可能有一个用于此类问题的简单解决方案。

这就是我第一次向您寻求帮助的原因。

【问题讨论】：

标签： objective-c core-animation uibezierpath cgpath cashapelayer

【解决方案1】：

据我所知，您必须根据二次贝塞尔曲线的公式计算点。这段代码，会做到这一点，

- (IBAction)progressChanged:(UISlider *)sender{
    self.raceTrack.strokeEnd = sender.value;
    CGPoint strokeEnd = [self pointAtStrokeEnd:sender.value]; 
}


-(CGPoint)pointAtStrokeEnd:(CGFloat) fraction {

    CGFloat x = (1 - fraction) * (1 - fraction) * self.startPoint.x + 2 * (1 - fraction) * fraction * self.controlPoint.x + fraction * fraction * self.endPoint.x;
    CGFloat y = (1 - fraction) * (1 - fraction) * self.startPoint.y + 2 * (1 - fraction) * fraction * self.controlPoint.y + fraction * fraction * self.endPoint.y;
    return CGPointMake(x, y);
}

您需要为曲线的起点、终点和控制点创建属性或 ivars，以便将它们传递给 pointAtStrokeEnd: 方法。

【讨论】：