CAShapeLayer动画路径闪光/闪烁(从椭圆到矩形和背面)

Question

当我创建一个显式动画来将CAShapeLayer的路径值从椭圆更改为矩形时，我遇到了一个问题。

在我的画布控制器中，我设置了一个基本的CAShapeLayer，并将其添加到根视图的层：

CAShapeLayer *aLayer;
aLayer = [CAShapeLayer layer];
aLayer.frame = CGRectMake(100, 100, 100, 100);
aLayer.path = CGPathCreateWithEllipseInRect(aLayer.frame, nil);
aLayer.lineWidth = 10.0f;
aLayer.strokeColor = [UIColor blackColor].CGColor;
aLayer.fillColor = [UIColor clearColor].CGColor;
[self.view.layer addSublayer:aLayer];

然后，当我为路径设置动画时，当形状变成矩形时，我在动画的最后几帧中会出现奇怪的小故障/闪烁，而当它从矩形变为矩形时，在前几帧中也会出现这种情况。动画设置如下：

CGPathRef newPath = CGPathCreateWithRect(aLayer.frame, nil);
[CATransaction lock];
[CATransaction begin];
[CATransaction setAnimationDuration:5.0f];
CABasicAnimation *ba = [CABasicAnimation animationWithKeyPath:@"path"];
ba.autoreverses = YES;
ba.fillMode = kCAFillModeForwards;
ba.repeatCount = HUGE_VALF;
ba.fromValue = (id)aLayer.path;
ba.toValue = (__bridge id)newPath;
[aLayer addAnimation:ba forKey:@"animatePath"];
[CATransaction commit];
[CATransaction unlock];

我尝试了很多不同的东西，比如锁定/解锁CATransaction，玩各种填充模式，等等

以下是故障图像：http://www.postfl.com/outgoing/renderingglitch.png

我正在经历的一段视频可以在这里找到：http://vimeo.com/37720876

Answer 1

我收到了来自石英开发列表的反馈：

David Duncan写道：

只有当你是从喜欢到喜欢的动画。矩形是一系列直线，而椭圆是一系列圆弧（您可以看到使用CGPathApply生成的序列），以及动画他们之间并不能保证看起来很好，或者工作得很好。

要做到这一点，你基本上必须通过使用与创建椭圆相同的曲线，但是参数会使渲染看起来像长方形这应该不会太难（而且，您可以使用使用创建的路径上的CGPathApplyCGPathAddEllipseRecct作为指南），但可能需要一些调整以获得正确的结果。

Answer 2

不幸的是，这是对CAShapeLayers的动画路径属性的限制。

基本上，它试图在两条路径之间进行插值。当目标路径和起始路径具有不同数量的控制点时，它会遇到问题，而曲线和直边会出现此问题。

你可以试着把椭圆画成4条曲线而不是一个椭圆来尽量减少这种影响，但这仍然不太正确。我还没有找到一种从曲线到多边形的平滑方法。

你可能可以完成大部分工作，然后在最后一部分转移到渐变动画中——不过这看起来不太好。